如何配置Nginx以访问动态子目录下的静态index.html文件？

核心错误点 #

1. 正则匹配范围不足：原配置中的正则~/public/base/(?<foo>[^/]+)/要求路径以/结尾，但实际请求/public/base/foo1/index.html并不满足这个条件，导致该location规则未被触发，请求最终落入location /的rewrite规则，被重定向到根目录的index.html，从而返回404。
2. root/alias路径映射错误：使用root时未结合请求URI的正确拼接逻辑，使用alias时路径末尾缺少/，导致Nginx无法正确定位文件。

正确配置方案 #

根据你的静态包实际存储路径，选择对应配置：

情况1：静态包存储在网站根目录下（即/www/mysite/public/base/） #

此时无需额外配置location，只需调整location /规则，优先允许静态文件的正常访问：

location / {
    try_files $uri $uri/ /index.html;
}

解释：try_files会先尝试访问请求的文件或目录，只有当文件不存在时才重写到/index.html，避免拦截已存在的静态资源请求。

情况2：静态包存储在独立路径（如/var/www/html/public/base/） #

需要配置正则location来映射路径，同时修正匹配规则：

server {
    server_name example.com;
    root   /www/mysite/;
    index  index.html index.htm;

    # 匹配/public/base/xxx下的所有请求
    location ~ ^/public/base/(?<foo>[^/]+) {
        alias /var/www/html/public/base/$foo/;
        index index.html index.htm;
        # 尝试访问文件、目录，最后回退到对应目录的index.html
        try_files $uri $uri/ /public/base/$foo/index.html;
    }

    location /backend-service {
        proxy_pass http://localhost:123/backend-service;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
    }

    location / {
        try_files $uri $uri/ /index.html;
    }

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

额外检查项 #

1. 确认静态文件权限：确保Nginx进程对public/base/下的文件有读取权限，可执行命令chmod -R 755 /var/www/html/public/base/（根据实际路径调整）。
2. 验证Nginx配置：执行nginx -t检查配置文件是否合法，无误后重启Nginx：systemctl restart nginx。

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