静态内容nodejs应用反向代理的NgInx禁止错误

Question

我正在为我的 expressjs 网站使用 NgInx 反向代理和 HTTPS。使用 https 访问网站没有任何问题，并且请求在 Nodejs 服务器上获取，但问题在于静态内容。

所有静态内容（JS、CSS、图像、字体等）都抛出 403 禁止错误。

下面是我的ngInx配置文件内容：

server {
    listen  80;
    listen 443 ssl;
    ssl on;
    ssl_certificate /home/ec2-user/certs/myapp.bundle.crt; 
    ssl_certificate_key /home/ec2-user/certs/myapp.key;

    root /home/ec2-user/myapp;

    server_name example.com;
    access_log /var/log/nginx/nginx.vhost.access.log;
    error_log /var/log/nginx/nginx.vhost.error.log;

    location / {
       #try_files $uri $uri/ /index.php?$args ;
       #try_files $uri $uri/ =404;
        proxy_pass https://example.com:3000;
        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;
    }
}

我正在使用亚马逊 EC2 和 CentOS。 请帮忙。提前致谢。

Answer 1

location / {
        proxy_pass https://example.com:3000;
        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;
    }

您正在将所有流量重定向到 nodejs。这意味着 expressjs 将提供静态内容。

要提供静态文件，请使用 Express 中的 express.static 内置中间件函数。

将包含静态资产的目录的名称传递给 express.static 中间件函数以开始直接提供文件。例如，使用以下代码在名为 public 的目录中提供静态文件：

app.use(express.static('public'))

更多信息在这里：https://expressjs.com/en/starter/static-files.html

Answer 2

您正在尝试从您的 NodeJS 应用程序中提供静态文件，这是不正确的方法，因为您使用的是 Nginx。在您的配置中添加以下类型的块

location ~ \.(css|gif|png|jpe?g|ico|js|swf|ttf|woff) {
    expires 30d;
    root /home/ec2-user/myapp;
    try_files $uri =404;
}

您可能需要根据您使用资产的方式调整根文件夹。但是如果你和/home/ec2-user/myapp一样使用它，那么你可以跳过添加这一行