Question

我正在试图弄清楚如何让nginx提供静态资产，回退到index.html，然后转发到API。目前，我所有工作的是根路由/和API转发。

这是我追求的行为：

GET /          -> nginx sends s3/index.html (current)
* /api         -> nginx proxies to the puma server (current)

# Yet to figure out (and the reason for this question)
GET /sub-route    -> nginx sends s3/index.html, and routing is handled by the js framework
GET *.css|.js|etc -> nginx forwards to the s3 bucket (all relative to index.html)

这是我的nginx.conf（它有一些模板内容，因为（作为部署过程的一部分）我做了：

envsubst '$S3_BUCKET:$NGINX_PORT' < /app/deployment/nginx.template.conf > /app/deployment/nginx.conf

pid        /app/tmp/nginx.pid;

events {  }
http {
  upstream puma {
    server unix:///app/sockets/puma.sock;
  }

  server {
    listen ${NGINX_PORT} default_server deferred;
    server_name aeonvera.com;

    gzip on;
    gzip_disable "msie6";

    gzip_vary on;
    gzip_proxied any;
    gzip_comp_level 6;
    gzip_buffers 16 8k;
    gzip_http_version 1.1;
    gzip_types text/plain text/css application/json application/x-javascript text/xml application/xml application/xml+rss text/javascript;

    root /app/public;
    access_log /app/log/nginx.access.log;
    error_log /app/log/nginx.error.log info;

    client_max_body_size 20M;
    keepalive_timeout 5;


    location ~ ^/api {
      proxy_set_header X-Real-IP $remote_addr;
      proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
      proxy_set_header Host $http_host;
      proxy_set_header X-NginX-Proxy true;

      proxy_pass http://puma;
    }

    # Send all other requests to the index.html
    # stored up on s3
    location / {
      # tell all URLs to go to the index.html
      # I got an error with this about having proxy_pass within a location...?
      # location ~* \.(?:ico|css|js|gif|jpe?g|png|woff2|woff|ttf)$ {
      #   proxy_pass "https://s3.amazonaws.com/${S3_BUCKET}/ember/"
      #
      #   gzip_static on;
      #   expires max;
      #   add_header Cache-Control public;
      # }

      # Don't know what this does
      rewrite ^([^.]*[^/])$ $1/ permanent;

      # only ever GET these resources
      limit_except GET {
        deny all;
      }


      # use google as dns
      resolver 8.8.8.8;

      proxy_http_version     1.1;
      proxy_set_header       Host 's3.amazonaws.com';
      proxy_set_header       Authorization '';

      # avoid passing along amazon headers
      proxy_hide_header      x-amz-id-2;
      proxy_hide_header      x-amz-request-id;
      proxy_hide_header      x-amz-delete-marker;
      proxy_hide_header      x-amz-version-id;

      # cookies are useless on these static, public resources
      proxy_hide_header      Set-Cookie;
      proxy_ignore_headers   "Set-Cookie";
      proxy_set_header cookie "";

      proxy_buffering        off;

      # s3 replies with 403 if an object is inaccessible; essentially not found
      proxy_intercept_errors on;
      # error_page 500 502 503 504 /500.html;

      # the actual static files
      proxy_pass             "https://s3.amazonaws.com/${S3_BUCKET}/ember/index.html";
    }

  }
}

更新1

我在location /

上面添加了这个

location ~ ^/(assets|fonts) {
  rewrite (.*) $1 break;
  proxy_pass "https://s3.amazonaws.com/${S3_BUCKET}/ember";

  gzip_static on;
  expires max;
  add_header Cache-Control public;
}

但它会出错：

nginx: [emerg] "proxy_pass" cannot have URI part in location given by regular expression, or inside named location, or inside "if" statement, or inside "limit_except" block in /app/deployment/nginx.conf:53

此更改背后的想法是，由于我的所有资产都位于已知位置，因此我可以告诉nginx代理该位置，然后为rewrite (.*) / permanent;

设置location /

更新2

我想也许我可以重新编写/dashboard的网址，所以nginx会proxy_pass index.html。没有成功。

  rewrite ^/(.*) / break;
  proxy_pass             "https://s3.amazonaws.com/${S3_BUCKET}/ember/index.html";

这只是重定向到s3的营销页面

Content-Length:0
Content-Type:text/plain; charset=utf-8
Date:Thu, 08 Feb 2018 13:22:49 GMT
Location:https://aws.amazon.com/s3/
Server:nginx/1.12.0

响应标题^

Answer 1

我想我想出来了，但是如果有人可以验证它会非常有帮助，因为我对nginx还是比较新的。

location / {
  # ...

  proxy_set_header       Host 's3.amazonaws.com';

  # ...

  rewrite ^/(.*) /${S3_BUCKET}/ember/index.html break;
  proxy_pass             "https://s3.amazonaws.com/${S3_BUCKET}/ember/index.html";
}

拥有Host标头非常重要，因为没有它，重写会更改用户浏览器中的网址（我们不想这样做，因此很可能混乱了SPA的路线。

使用nginx

更新1

更新2

1 个答案: