Angular应用部署至虚拟目录：所有请求均返回index.html问题求助

问题根源 #

你的Nginx配置中，try_files指令最后兜底指向的是根目录的/index.html，导致所有匹配/app/路径的请求（包括静态资源）在找不到对应文件时，都会返回根目录的index.html；同时部署路径和配置的映射关系未匹配正确，引发资源加载和路由跳转异常。

正确配置方案 #

场景1：Angular编译产物存放于/usr/share/nginx/html/app #

修改Nginx的default.conf中location /app/块：

location /app/ {
    root   /usr/share/nginx/html;
    index  index.html index.htm;
    try_files $uri $uri/ /app/index.html;
}

• 关键调整：将兜底的/index.html改为/app/index.html，确保路由刷新时返回虚拟目录下的Angular入口文件；root设置为/usr/share/nginx/html，会让Nginx自动在该目录下拼接/app/路径查找静态资源（如请求/app/main.js会对应到/usr/share/nginx/html/app/main.js）。

场景2：Angular编译产物直接存放于/usr/share/nginx/html，通过/app/路径访问 #

使用alias指令替代root，配置如下：

location /app/ {
    alias   /usr/share/nginx/html/;
    index  index.html index.htm;
    try_files $uri $uri/ /app/index.html;
}

• 解释：alias会将/app/路径直接映射到/usr/share/nginx/html/目录，请求/app/main.js会对应到/usr/share/nginx/html/main.js，兜底规则同样保证路由刷新正常。

验证步骤 #

• 确认Angular编译时已设置正确的baseHref：

  ng build --base-href /app/
  

  或在angular.json的build配置中设置"baseHref": "/app/"后执行ng build。
• 重启Nginx使配置生效：

  nginx -s reload
  

• 访问http://你的域名/app/，检查静态资源加载状态和路由刷新是否正常。

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