Nginx多location配置下js、css等静态资源无法加载问题咨询

1. 配置拼写与实际路径不匹配
   • 本地项目目录名为app01/app02，配置中写为app1/app2，资源路径无法正确命中
   • 配置中定义的location规则为/blog1//blog2，但实际需要访问的路径是/blog，规则匹配失效
   • server_name配置为example.com，与实际访问的域名my-apps.local不一致
2. alias与try_files搭配规则冲突
   Nginx的alias块内使用try_files $uri时，$uri会保留location匹配的前缀，导致静态资源路径拼接错误。例如请求/blog/style.css时，拼接后的实际查找路径会变成/Users/username/test/apps/app02/blog/style.css，而非预期的/Users/username/test/apps/app02/style.css
3. 根路径规则缺失
   当前配置未定义/根路径的location规则，根路径能访问到app01属于默认匹配的巧合，不符合配置规范。

调整后的Nginx配置如下：

listen      *:3460;
server_name my-apps.local;

# 根路径对应app01
location / {
  root /Users/username/test/apps/app01/;
  try_files $uri $uri/ index.html =404;
  index index.html;
}

# /blog路径对应app02
location ^~ /blog {
  alias /Users/username/test/apps/app02/;
  try_files $uri $uri/ /blog/index.html =404;
  index index.html;
}

• 项目内静态资源引用尽量使用相对路径，避免绝对路径直接指向根目录导致资源请求命中根路径规则
• ^~前缀可以保证/blog开头的请求优先命中对应location规则，不会被其他正则location覆盖

内容的提问来源于stack exchange，提问作者Emil Devantie Brockdorff