NGINX proxy_pass rewrite asset uri

Question

I'm trying to do a basic NGINX reverse proxy by subdomian, to localhost/folder and am stumped getting it to rewrite my assets+links.

My http://localhost:8080/myapp/ works like a charm, but via NGINX+subdomain it fails on the subfolder assets.

I believe I'm stumped on the 'rewrite' clause for NGINX.

How can I rewrite the HTML going to the client browser to drop the /myapp/ context?

server {
    listen       443 ssl;
    server_name  app1.domain.com;
    location / {
        rewrite ^/myapp/(.*) /$1 break; # this line seems to do nothing
        proxy_pass http://localhost:8080/myapp/;
    }
}

I'm expecting my resultant HTML (via https://app1.domain.com ) to be rewritten without the subfolder /myapp/, so when assets are requested they can be found instead of a 404 against https://app1.domain.com/myapp/assets/ . It should just be https://app1.domain.com/assets/ (which if I manually go there they work)

--thanks.

Answer 1

Feeding from Ivan's response and finalizing my solution as:

server {
    listen       443 ssl;
    server_name  app1.domain.com;
    location / {
        sub_filter '/myapp/'  '/'; # rewrites HTML strings to remove context
        sub_filter_once off; # ensures it loops through the whole HTML (required)
        proxy_pass http://localhost:8080/myapp/;
    }
}

Answer 2

As nginx proxy_pass documentation states :

In some cases, the part of a request URI to be replaced cannot be determined:

...

When the URI is changed inside a proxied location using the rewrite directive, and this same configuration will be used to process a request (break):

 location /name/ { rewrite /name/([^/]+) /users?name=$1 break; proxy_pass http://127.0.0.1; } 

In this case, the URI specified in the directive is ignored and the full changed request URI is passed to the server.

So with this configuration block after you rewrite /myapp/assets/some_asset URI to /assets/some_asset and use a break flag, nginx ignores /myapp/ suffix on a proxy_pass directive and passes /assets/some_asset request to your backend. However strange it is, what you need is to use this rewrite rule instead:

rewrite ^(/myapp/.*)$ $1 break;

Another (may be even better) solution is to use two location blocks:

location / {
    proxy_pass http://localhost:8080/myapp/;
}
location /myapp/ {
    proxy_pass http://localhost:8080;
}