404 在 NGINX 反向代理后面的 Node.js 應用程序的 POST 和 GET 請求上

Question

我有一個以這種結構運行的 Ubuntu Web 服務器：

Nginx 反向代理 localhost:80，它重定向到'/' （帶有 WordPress 站點的 apache 服務器，位於 localhost:8080），目前有效。

最近，我嘗試在www.site.com/app或在內部添加 Node.js 應用程序localhost:3000 。 我能夠提供 node.js webapp 的 HTML 和 CSS，但是所有內部路由調用都在 404ing，可能是因為 /app/ 的 URL 尋址。

IE。 嘗試點擊/someendpoint和/someendpoint ，因為 Node.js 在技術上運行在localhost:3000 ( www.site.com/app ) 上。 我應該像 ( www.site.com/app/someendpoint ) 這樣的路由參數嗎？

問題：所有來自 NODE.JS 的 POST/GET 調用都是 404ing，因為我對 NGINX 配置的理解不好。 如何將此 GET 調用路由到 Node.js 服務器的實際位置，即 (site.com/app/, localhost:3000)。

這是我來自/etc/nginx/available_sites/. “ default ”配置/etc/nginx/available_sites/.

 server {
     listen 80 default_server;
     listen [::]:80 default_server;

     root /var/www/html;

     index index.php index.html index.htm index.nginx-debian.html;

     server_name www.*site*.name;

     location / {
         proxy_pass http://127.0.0.1:8080$request_uri;
         proxy_buffering on;
         proxy_buffers 12 12k;
         proxy_redirect off;
         proxy_set_header X-Real-IP $remote_addr;
         proxy_set_header X-Forwarded-For $remote_addr;
         proxy_set_header Host $host;
         try_files $uri $uri/ /index.php?q=$uri&$args;
     }

     #Currenly serving HTML, CSS of site, however node routes 404 
     location /app/ {
          proxy_pass http://localhost:3000/;
      }
 }

我如何更新此 NGINX 配置文件以考慮主動嘗試訪問我的 apache 站點的路由而不是節點服務器的/app實際位置的節點端點？

任何幫助或想法都會很棒，作為個人項目的一部分，我已經在這個問題上停留了一段時間。

謝謝！

Answer 1

這是一個示例 app.js 文件，可以讓您深入了解這個問題。

var express = require("express");
var router = require("./lib/routes/index");
var app = express();
var port = 3000;

app.use('/app', router);

app.listen(port, function () {
    console.log("Listening on port " + port);
});

至於 nginx 配置，我會推薦以下內容：

# Sample nginx config with 2 upstream blocks
upstream nodeApp {
        server 127.0.0.1:3000;
}

upstream apacheApp {
        server 127.0.0.1:8080
}

server {
        listen 80;
        listen [::]:80;

        server_name www.domain.com domain.com;

        root /var/www/domain;

        location / {
                proxy_pass http://apacheApp;
        }

        location /app {
                proxy_pass http://nodeApp;
                # OR
                # try_files $uri $uri/ @backend;
        }

        location @backend {
                proxy_pass http://nodeApp;
                proxy_set_header X-Real-IP $remote_addr;
                proxy_set_header Host $host;
                proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
                proxy_http_version 1.1;
                proxy_set_header Upgrade $http_upgrade;
                proxy_set_header Connection "upgrade";
        }
}

關鍵部分是在 app.js 中使用外部路由器，然后使用這一行： app.use('/app', router); 您可能還想設置 nginx 來提供靜態文件，而不是依賴express.static() 。 這也很容易通過設置更多的位置塊來實現，如下所示：

location /app/public {
        try_files $uri $uri/ =404;
}

這應該適用於您的目的。 不要忘記使用nginx -t檢查您的配置。

Answer 2

請刪除位置/塊中的 try_files 語句，您的位置應如下所示.....

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

Answer 3

有關更多故障排除建議，請查看此非常相似的線程： nginx proxy_pass 404 錯誤，不明白為什么

處理我的 404 問題的解決方案是在我的 proxy_pass url 之后添加一個額外的/ 。