在s3上托管的反应单页面应用程序（SPA）的nginx配置无法正常工作

Question

我试图让nginx与s3文件夹上托管的单页应用程序一起工作。对于主推，我们使用常规的cloudfront，s3和路由53.但是对于分支部署，我们不希望每个开发人员使用cloudfront。所以我们所做的就是将资产推送到s3 bucket my.example.com/branch-name/，然后我们创建一个路由53 A record - branch-name.my.example.com，它指向nginx服务器。这是我的nginx配置：

server {
    listen       8443;
    server_name  *.my.example.com;
    index   index.html;

    location / {
        resolver 8.8.8.8;

        set $bucket "my.example.com.s3-website-us-west-1.amazonaws.com";
        rewrite ^([^.]*[^/])$ $1/ permanent;

        # matches: branch-name
        if ($host ~ ^([^.]*)\.my\.example\.com) {
            set $branch $1;
            proxy_pass http://$bucket/${branch}$uri;
        }
        try_files '' /index.html =404;
        proxy_intercept_errors on;
        proxy_redirect off;
        proxy_set_header Host $bucket;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_hide_header x-amz-id-2;
        proxy_hide_header x-amz-request-id;
    }

}

我正在寻找的行为是，如果我去http://branch-name.my.example.com它应该加载http：// $ bucket / $ {branch} /index.html。如果我去http://branch-name.my.example.com/garbage-nonexistent-path/more-garbage/ ...它应该保留浏览器中的URL但仍然加载http：// $ bucket / $ {branch} /index.html如果我去http://branch-name.my.example.com/correct-path/它应该被路由到我的应用程序中的正确选项卡因为反应路由器有/ correct-path的组件。如果我去http://branch-name.my.example.com/correct-path/sdcsd/sdcsd/它仍然应该路由到正确的页面但保留网址。

现在我得到的行为是我只能去根网址，即http://branch-name.my.example.com，我被路由到正确的index.html，然后我点击该页面上的“正确路径”选项卡，网址将相应更改http://branch-name.my.example.com/correct-path/及其精细。但是，如果我尝试直接去http://branch-name.my.example.com/correct-path/我只是从s3得到以下错误：

404 Not Found
Code: NoSuchKey
Message: The specified key does not exist.
Key: branch-name/correct-path/index.html
RequestId: 92ADA29566570E8C9
HostId: wT4JdQrkB7KI0+Gnb4+88WNdnX0NXCHB6/KP5RxqJMozAx8z3RlC4T6uefk2LA=
An Error Occurred While Attempting to Retrieve a Custom Error Document
Code: NoSuchKey
Message: The specified key does not exist.
Key: index.html

如果我去http://branch-name.my.example.com/correct-path（注意没有结束斜线），它只是无限期地加载。

请帮忙。谢谢。

Answer 1

试试这个配置

server {
    listen       80;

    location = / {
        proxy_pass http://bucketname-ap-southeast-2.amazonaws.com;
        proxy_intercept_errors on;
        error_page 404 =200 @spa-root;
    }

    location / {
        proxy_pass http://bucketname-ap-southeast-2.amazonaws.com;
        proxy_intercept_errors on;
        error_page 404 =200 @spa-root;
    }

    location @spa-root {
        proxy_pass http://bucketname-ap-southeast-2.amazonaws.com;
    }
}