Nginx环回反向代理无法访问自定义路径问题求助

Let's break down what's causing your issues and fix your Nginx configuration to properly proxy all requests to your Loopback server.

Key Issues in Your Current Config #

1. Conflicting Server Names & Broken Redirects: Your first server block uses server_name _ (which matches all unmatched domains) and doesn't preserve the requested path when redirecting to HTTPS. This causes unnecessary redirect loops and slow loading.
2. Nginx Trying to Serve Static Files Directly: The root directive in your HTTPS server block makes Nginx attempt to find files like /admin/login in your client directory instead of forwarding the request to Loopback. When it can't find the file, you get a Bad Gateway error.
3. Redundant Location Blocks: The separate /api and /explorer locations are unnecessary—your Loopback server already handles these routes, so we can simplify by proxying all requests through a single location block.

Updated Nginx Configuration #

Replace your /etc/nginx/sites-available/example.com with this:

# Handle HTTP -> HTTPS redirects
server {
    listen 80;
    server_name example.com www.example.com;

    # Allow access to Let's Encrypt challenge files
    location ~ ^/.well-known {
        root /apps/example/client;
        allow all;
    }

    # Redirect all HTTP traffic to HTTPS, preserving the requested path
    return 301 https://example.com$request_uri;
}

# Handle HTTPS traffic
server {
    listen 443 ssl;
    server_name example.com www.example.com;

    ssl_certificate /etc/letsencrypt/live/www.example.com/fullchain.pem;
    ssl_certificate_key /etc/letsencrypt/live/www.example.com/privkey.pem;

    # Allow access to Let's Encrypt challenge files
    location ~ ^/.well-known {
        root /apps/example/client;
        allow all;
    }

    # Optional: Redirect www.example.com to example.com (clean up your domain)
    if ($host = www.example.com) {
        return 301 https://example.com$request_uri;
    }

    # Proxy ALL requests to your Loopback server
    location / {
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header Host $host;
        proxy_set_header X-Forwarded-Proto $scheme; # Tell Loopback the request is HTTPS
        proxy_pass http://127.0.0.1:3000/;
        proxy_redirect off;
    }
}

Why This Works #

• Clean Redirects: We explicitly target your domains, remove the catch-all _ server name, and use $request_uri to preserve the user's requested path during redirects. This eliminates loop issues and slow loading.
• Full Proxy to Loopback: By removing the root directive from the HTTPS block, we let Loopback handle both static files (via loopback.static) and routing fallback to index.html. Your existing Loopback code already checks for ignored paths (like /api) and serves index.html for everything else—perfect for Angular's HTML5 routing.
• HTTPS Context: The X-Forwarded-Proto header ensures Loopback knows the request came over HTTPS, which fixes issues with generated URLs (like in the Loopback Explorer).

Steps to Apply the Fix #

1. Test the configuration for syntax errors:

   sudo nginx -t
   

2. If the test passes, reload Nginx to apply changes:

   sudo systemctl reload nginx
   

3. Verify your Loopback server is running on port 3000.

Now when you visit https://example.com/admin/login, the request will be forwarded to Loopback, which will return index.html (since it doesn't match your ignored paths), and Angular will handle the routing client-side. Requests to /api or /explorer will go straight to Loopback's API endpoints as expected.

内容的提问来源于stack exchange，提问作者alons-oh