Question

在为React应用程序和Node Web服务器设置Nginx反向代理时，它似乎在后端损坏了Express，尽管我可以通过接收“无法获取XX”告诉我正在浏览器中访问它添加第二个位置块后的错误消息将很快出现在下面（以前，访问API端点时浏览器只是白色，因为React Router试图抓住它们）。

这是配置的样子，其中端口3000是我的React应用程序，端口4000是我的Express服务器，两者均由pm2管理：

server {
        root /var/www/html;

        index index.html index.htm index.nginx-debian.html;
         server_name www.mywebsite.com; # managed by Certbot


        location / {
                proxy_pass http://127.0.0.1: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;
        }

        location /api/ {
                proxy_pass http://127.0.0.1:4000/;
                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;
        }

}

无法使用的简单Express路线（“无法获取/”）：

app.get('/', (req, res) => {
        res.send('Hello, world!');
});

为SSL生成了一些其他certbot东西，但我不确定它是否相关。 React应用程序可以完美运行，但是无论它是“ location / api /”还是“ location / api”，无论我在Express中如何命名路线，尽管它们之前都运行良好，但它们都无法解析。预先感谢您的指导！

编辑：我将服务器配置更改为至少将/ api /映射到服务器的根目录，并带有反斜杠，因此我不必在每个路由处理程序之前添加/ api，但问题仍然存在（“无法获取/ “）。

Answer 1

为什么要使用以下标题？

            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection 'upgrade';

如果您使用的是TLS / https，则可能不需要，如果存在升级标头，则可能导致express问题。尝试删除它。

这些标头通常用于WebSockets。有关更多详细信息，请参见the nginx docs。

使用Nginx反向代理React + Node + PM2无法获取等

1 个答案: