Nginx配置异常：Angular6子应用请求被Tomcat覆盖处理

我来帮你搞定这个配置问题！你的需求是让staging.app.com/blah/*下的所有请求由Angular6处理，其余请求转发给Tomcat，但当前配置里location /的规则看似覆盖了全局，其实核心问题是Angular的路由规则没有正确拦截/blah路径下的所有请求，还存在文件路径匹配的小漏洞。

问题分析 #

你当前的location ^~ /blah/规则优先级确实高于location /，但try_files $uri /index.html的写法有问题：当请求/blah/some-angular-route时，Nginx会去/las/blah/app/index.html找文件，而不是/las/blah/app/blah/index.html（如果你的Angular index.html在/blah子目录下）；如果Angular静态文件直接放在/las/blah/app，这个路径又会导致找不到对应资源。

修正后的完整配置 #

根据Angular单页应用的部署规范，我调整了配置，确保/blah路径下的所有请求都能被Angular正确处理：

server {
    listen 80;
    server_name staging.app.com;
    client_max_body_size 980M;
    include /etc/nginx/default.d/*.conf;

    # 处理Angular6应用的/blah/*请求
    location ^~ /blah/ {
        # 替换成你Angular编译后静态文件的实际目录（比如dist目录）
        root /las/blah/app;
        # 优先匹配实际静态文件，找不到则交给Angular路由处理
        try_files $uri $uri/ /blah/index.html;
    }

    # 所有其他请求转发到Tomcat
    location / {
        proxy_pass http://localhost:8080;
        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;
    }

    error_page 404 /404.html;
    location = /40x.html { }
    error_page 500 502 503 504 /50x.html;
    location = /50x.html { }
}

关键调整说明 #

• 优先级保证：^~ /blah/是前缀匹配且优先级高于普通的location /，所以所有以/blah/开头的请求都会先进入Angular的处理规则，不会被Tomcat拦截。
• 正确的文件匹配：try_files $uri $uri/ /blah/index.html的逻辑是：
  1. 先尝试访问请求的静态文件（比如/blah/main.js），如果存在直接返回；
  2. 如果是目录，尝试找目录索引；
  3. 以上都找不到时，返回/blah/index.html，让Angular的前端路由接管请求，完美适配单页应用的路由需求。
• Angular基础路径配置：别忘了在Angular项目里设置正确的base href，要么在angular.json的build配置里加"baseHref": "/blah/"，要么在index.html里添加<base href="/blah/">，否则Angular的路由会出现跳转错误。

额外适配提示 #

如果你的Angular静态文件不在/las/blah/app/blah/下，而是直接放在/las/blah/angular-dist/（没有blah子目录），可以把location ^~ /blah/改成用alias：

location ^~ /blah/ {
    alias /las/blah/angular-dist/;
    try_files $uri $uri/ /blah/index.html;
}

这样Nginx会把/blah/xxx映射到/las/blah/angular-dist/xxx，更符合Angular编译后的文件结构。

最后，用nginx -t检查配置是否合法，没问题的话执行nginx -s reload重启Nginx生效即可。

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