SvelteKit经Nginx反向代理后非根路由陷入重定向循环求助

核心问题 #

1. 精确匹配路由的局限性：你用location = /about/这类精确匹配规则，仅能匹配带尾斜杠的/about/路径，但用户实际访问的可能是不带尾斜杠的/about，此时Nginx无对应转发规则，结合SvelteKit的重定向逻辑就会触发循环。
2. 缺失关键代理请求头：未向SvelteKit传递Host、X-Forwarded-Proto等头信息，导致SvelteKit无法正确识别用户的实际访问协议（HTTP/HTTPS）和域名，进而触发不必要的重定向，形成循环。
3. 路由规则冗余且覆盖不全：手动逐个配置页面路由不仅繁琐，还容易遗漏其他路由，无法适配SvelteKit的动态路由特性。

修正后的Nginx配置 #

user nginx;
worker_processes 1;
pid /var/run/nginx.pid;
events {
    worker_connections 1024;
}

http {
    # SvelteKit server on port 3000
    upstream website {
        server website_server:3000;
    }

    # Another server for /api/ on port 4000
    upstream apis {
        server api_server:4000;
    }

    server {
        listen 80;
        listen 443 ssl; 
        listen [::]:443 ssl;
        ssl_certificate /etc/letsencrypt/live/mydomain.com/fullchain.pem;
        ssl_certificate_key /etc/letsencrypt/live/mydomain.com/privkey.pem;
        server_name mydomain.com www.mydomain.com;

        # 强制HTTP跳转HTTPS（可选，按需开启）
        if ($scheme != "https") {
            return 301 https://$host$request_uri;
        }

        # 转发/api/请求到API服务
        location /api/ {
            proxy_pass http://apis;
            proxy_set_header Host $host;
            proxy_set_header X-Forwarded-For $remote_addr;
            proxy_set_header X-Forwarded-Proto $scheme;
            proxy_redirect off;
        }

        # 处理SvelteKit静态资源
        location ~ ^/(_app|images|css|fonts)/ {
            proxy_pass http://website;
            proxy_set_header Host $host;
            proxy_set_header X-Forwarded-For $remote_addr;
            proxy_set_header X-Forwarded-Proto $scheme;
            # 静态资源开启缓存优化
            expires 1y;
            add_header Cache-Control "public, immutable";
        }

        # 所有其他请求交给SvelteKit处理路由
        location / {
            proxy_pass http://website;
            proxy_set_header Host $host;
            proxy_set_header X-Forwarded-For $remote_addr;
            proxy_set_header X-Forwarded-Proto $scheme;
            proxy_redirect off;
        }
    }
}

关键修改说明 #

• 合并静态资源路由：用正则表达式批量匹配所有静态资源路径，避免重复配置。
• 统一页面路由处理：用location /匹配所有非API、非静态资源的请求，交给SvelteKit处理动态路由，无需逐个添加页面路由。
• 添加必要代理头：
  • Host $host：让SvelteKit识别用户访问的实际域名。
  • X-Forwarded-Proto $scheme：告诉SvelteKit用户使用的是HTTPS协议，避免协议不匹配导致的重定向循环。
  • X-Forwarded-For $remote_addr：传递用户真实IP，方便日志排查（可选）。
• 可选HTTP转HTTPS：添加强制跳转规则，确保所有请求通过HTTPS访问，进一步避免协议相关问题。

额外注意事项 #

• 修改SvelteKit配置文件svelte.config.js，开启反向代理头支持：

import adapter from '@sveltejs/adapter-node';

export default {
    kit: {
        adapter: adapter({
            env: {
                host: 'HOST',
                port: 'PORT',
                protocol: 'PROTOCOL'
            }
        })
    }
};

• 重启Nginx和SvelteKit服务使配置生效：

sudo systemctl restart nginx
# 重启你的SvelteKit Node服务

内容的提问来源于stack exchange，提问作者goose_lake