Proxying Static Files via Nginx

[abs1ck]

Hello, I encountered an issue with proxying static files via Nginx on my NAS. My current configuration proxies several services, but one of them (accessible at `/nas/`) cannot find static files because they are requested relative to the root, not the `/nas/` path

Code: Select all

location /nas/ {
            rewrite ^/nas/(.*)$ /$1 break;
            proxy_pass http://192.168.1.1:8181/;
            proxy_set_header Host $host;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header X-Forwarded-Proto $scheme;

            # Handle WebSocket connections
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection "upgrade";

            # Replace links in HTML content
            sub_filter_types text/html;
            sub_filter 'src="/' 'src="/nas/';
            sub_filter 'href="/' 'href="/nas/';
            sub_filter_once off;

            # Prefix for cookie paths
            proxy_cookie_path / "/nas";
        }

Issue:
When I try to access the application at /nas/, it cannot find its static files because requests to them are made relative to the root, not /nas/.

Code: Select all

"GET /data/loading.gif?key=0.08550430991287694 HTTP/1.1" 404 11667 "https://domain.com/nas/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/126.0.0.0 Safari/537.36 Edg/126.0.0.0"

What I Tried:
Using sub_filter to replace links in HTML content.
Applying the proxy_redirect directive to change paths in Location and Refresh headers.

Additional Information:
If I set the path from the root - location /, then there are no problems, and everything works. But this option is not suitable since my Nginx proxies several services.

Code: Select all

location / {
            proxy_pass http://192.168.1.1:8181/;
            proxy_set_header Host $host;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header X-Forwarded-Proto $scheme;

            # Обработка WebSocket соединений
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection "upgrade";

        }

Question:
How can I correctly configure the proxying so that the static files of the application accessible at /nas/ are properly loaded?

Any help or advice would be greatly appreciated. Thank you!

[douglasputnam]

Hello,
To address the issue of static files not loading correctly when accessing the application at /nas/ due to requests being made relative to the root instead of the /nas/ path, I think you can adjust your Nginx configuration to properly handle these requests. One approach you can take is to modify the sub_filter directive settings.

Here's an updated configuration snippet that should help resolve the problem:

Code: Select all

nginx

location /nas/ {
    rewrite ^/nas/(.*)$ /$1 break;
    proxy_pass http://192.168.1.1:8181/;
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Proto $scheme;

    # Handle WebSocket connections
    proxy_http_version 1.1;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection "upgrade";

    # Replace links in HTML content
    sub_filter_types text/html;
    sub_filter 'src="/' 'src="/nas/';
    sub_filter 'href="/' 'href="/nas/';
    sub_filter_once off;

    # Prefix for cookie paths
    proxy_cookie_path / "/nas";

    # Adjust the path for static files
    location ~ ^/nas/(.*) {
        alias /path/to/your/static/files/directory/$1;
    }
}

In this configuration snippet:

- The location ~ ^/nas/(.*) block is added to specifically handle requests for static files.
- The alias directive is used to map requests for static files to the correct directory path on your server.

By implementing this change, static files requested by the application at /nas/ should now be properly loaded. Adjust the path in the alias directive to match the actual path where your static files are located on your server.