如何配置Nginx代理路径访问S3存储桶指定文件夹静态资源

你的核心问题是静态资源请求没有被正确映射到S3的/dev/app1/目录下——当前配置仅处理了/app1根路径的跳转，其他资源（如js/css）会直接请求S3的根目录，导致S3返回403/404。以下是修正后的Nginx配置及关键说明：

修正后的完整配置 #

server {
    listen 80;
    listen 443 ssl;
    ssl_certificate     /etc/ssl/nginx-server.crt;
    ssl_certificate_key /etc/ssl/nginx-server.key;

    server_name timemachine.com;
    sendfile on;
    include       mime.types;  # 引入mime类型，确保静态资源被正确识别
    default_type application/octet-stream;
    resolver        8.8.8.8;
    server_tokens   off;

    # 处理不带斜杠的/app1请求，重定向到带斜杠的路径，避免前端资源相对路径解析错误
    location = /app1 {
        return 302 /app1/;
    }

    # 处理所有/app1/开头的请求，映射到S3的/dev/app1/目录
    location ~ ^/app1/(.*) {
        set $s3_bucket_endpoint  "timemachineapp.s3-us-east-1.amazonaws.com";
        proxy_http_version     1.1;
        proxy_buffering        off;
        proxy_ignore_headers   "Set-Cookie";
        proxy_hide_header      x-amz-id-2;
        proxy_hide_header      x-amz-request-id;
        proxy_hide_header      x-amz-meta-s3cmd-attrs;
        proxy_hide_header      Set-Cookie;
        proxy_set_header       Authorization "";
        proxy_intercept_errors on;

        # 访问/app1/根路径时，转发到S3的index.html
        if ($1 = "") {
            rewrite ^ /dev/app1/index.html break;
        }
        # 把/app1/后的路径映射到S3的/dev/app1/目录下
        proxy_pass https://timemachineapp.s3-us-east-1.amazonaws.com/dev/app1/$1;
    }
}

关键修正点说明 #

• 引入mime.types：让Nginx正确识别js、css等静态资源的MIME类型，避免浏览器因类型错误无法加载资源。
• 根路径重定向：新增location = /app1块，将不带斜杠的请求重定向到/app1/，防止前端相对路径解析出错（比如原本请求/app1/main.js会误解析为/main.js）。
• 路径映射修正：在proxy_pass中拼接/dev/app1/$1，把/app1/xxx的请求转发到S3的/dev/app1/xxx，确保所有静态资源都能命中正确的S3路径。
• 首页逻辑处理：通过if ($1 = "")判断用户访问/app1/时，自动转发到S3的/dev/app1/index.html，实现首页加载。

额外检查项 #

1. 确认S3存储桶中dev/app1目录下的所有静态文件（js、css、图片等）都配置了公开读取权限，或Nginx使用的IAM角色拥有访问这些文件的权限。
2. 检查前端项目的资源引用路径：确保前端代码使用相对路径（如./main.js）而非绝对路径（如/main.js），否则会直接请求域名根目录，绕过Nginx的location规则。

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