Dynamic base href for one app and multiples domains path

[distant dune]

Hi.

I'm researching frameworks that meet my requirements.

And the most important one is the ability to handle dynamic base href.

We need to serve the same app on multiple domains.

When clients hire us they will point some url from their domains to us.

It could be anything like

client1.com/store          -> our app
client2.com/shop           -> our app
client3.com/other-path     -> our app
client4.com                -> our app
subdomain.client5.com      -> our app
subdomain.client6.com/path -> our app

So we have to have a SSR application that will serve the home page on any of those domains.
One instance of the app should handle all of those urls.

The problem is that in all SPA framework (SSR or not) the base href is handled statically, you build your app with that static path and when the app load in the browser it verifies if is in the correct base href, some frameworks don’t do nothing and just break (trying to load resources from root) or reloads the page to the specific statically builted base href.

What is ok if you are in a domain with the statically built base href, but it breaks for all other clients that have a different base href or are in the root.

I guess that one example of this behavior is shopify, you can point your own domain in many ways and it works.

But as far as I know they don’t use SPA.

Thanks.

[open blade]

Any reason you could not have a reverse proxy in front to handle this ? I assume (if you're using SSL) you will need to have something manage this already. So for instance:

server {
    listen 80; # Listen on HTTP port 80
    server_name client1.com; # Define the domain name

    location /store {
        proxy_pass http://localhost:3000;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }
}```

server {
listen 80; # Listen on HTTP port 80
server_name client2.com; # Define the domain name

location /shop {
    proxy_pass http://localhost:3000;
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}

}```