當為 REST api 定義多個埠時，nginx 反向代理不起作用

我有一個下一個 js 應用程序，我部署在埠 3000 上並在 nginx 上設置代理 3000。

現在我有我想要在不同埠 5000 上的同一伺服器上執行的自定義 Node js 後端伺服器。

我像這樣設置nginx

location / {
       proxy_http_version 1.1;
       proxy_cache_bypass $http_upgrade;
       proxy_set_header Upgrade $http_upgrade;
       proxy_set_header Connection 'upgrade';
       proxy_set_header Host $host;
       proxy_set_header X-Real-IP $remote_addr;
       proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
       proxy_set_header X-Forwarded-Proto $scheme;
       proxy_pass http://localhost:3000;
   }
location ^~ /api {
       proxy_http_version 1.1;
       proxy_cache_bypass $http_upgrade;
       proxy_set_header Upgrade $http_upgrade;
       proxy_set_header Connection 'upgrade';
       proxy_set_header Host $host;
       proxy_set_header X-Real-IP $remote_addr;
       proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
       proxy_set_header X-Forwarded-Proto $scheme;
       proxy_pass    http://localhost:5000;
           
       }

我在 example.com 上訪問該應用程序沒有問題。我設置了位置 /api 用於連接 server.js / api 獲取。

當我這樣取

axios.get(example.com/api)

其返回錯誤——無法獲取 /api/

但是當我像這樣設置 nginx 位置代理時

proxy_pass    http://localhost:5000/;

使用正斜杠，它的工作和 axios 正在成功獲取數據。

但是每當我嘗試從 server.js 文件中獲取另一條路由時，例如

axios.get(example.com/api/credential)

它再次像這樣顯示錯誤

Cannot GET //credential

以雙斜線返回 // 憑證

通過獲取 example.com/api 從 server.js 工作的唯一“/”路由

沒有代理上的正斜杠，它的返回錯誤。無法獲取 /api 或無法獲取 api/憑據

請幫忙。提前致謝。

更新

我修復了伊万的答案。現在我對該配置有新問題。我在 axios 旁邊使用 socket.io。因此，每當我嘗試通過 socket.io 連接時，我的客戶端套接字程式碼都是..

import io from "socket.io-client";
const socket = io("https://example.com/api");

並且伺服器套接字配置是..

const io = require("socket.io")(server, {
 cors: {
   origin: "*",
 },
});

現在當頁面載入時，控制台正在記錄..

GET https://example.com/socket.io?EIO=4&transport=polling&t=O4UTf4l 404 (Not Found)

請幫忙。

一般來說，你應該總是喜歡

location /prefix/ {
   ...
}

超過

location /prefix {
   ...
}

除非您代理單個 API 端點而不是整個 API（或另一個 Web 應用程序）。當您在指令中使用 URI 前綴時proxy_pass（也就是說，proxy_pass http://localhost:5000/;這裡proxy_pass http://localhost:5000;的尾部斜杠算作 URI 前綴），nginxlocation將從您的請求 URI 中去除指令中指定的前綴，並在其前面加上proxy_pass. 利用

location ^~ /api/ {
   ...
   proxy_pass http://localhost:5000/;
}

並且您的/api/credential請求 URI 將作為/credential.

引用自：https://serverfault.com/questions/1102199