如何使用多个 Express 应用程序 + NGINX 作为反向代理服务器来提供静态文件（CSS，...）答案

【问题标题】：How to serve static files (CSS, ...) with multiples Express app + NGINX as reverse proxy server如何使用多个 Express 应用程序 + NGINX 作为反向代理服务器来提供静态文件（CSS，...）
【发布时间】：2020-08-18 05:41:43
【问题描述】：

上下文
我在具有相同 IP 地址的同一台服务器上运行多个节点JS/Express 应用程序。我使用 Nginx 反向代理这些应用程序并将其重定向到子文件夹地址（而不是子域，我不想这样做）。
例如：http://123.0.0.1:8000 => http://monsite.com/Site1

问题
我的资产文件（css，图像，...）没有加载，当页面加载时，这些静态文件出现 404 错误。仅当我通过代理重定向 http://monsite.com/Site1 访问站点时才会发生这种情况，而不是当我使用 IP 地址时：http://123.0.0.1:8000

如果在 nginx conf 中从根目录使用反向代理位置，我没有这个问题： location / { 但我想从子文件夹地址访问该网站

我的集成
树文件：

var/www/html
          |Site1/
          |   |server.js
          |   |Views/
          |   |   |index.pug
          |   |Public/
          |   |   |Css/
          |   |   |   |Style.css
          |Site2/
          |....

nodejs 服务器代码

const PORT = 8000;
const HOSTNAME = 'www.monsite.com';

// Dependencies.
const express = require('express');
const http = require('http');

// Initialization.
var app = express();
var server = http.Server(app);

app.set('port', PORT);
app.set('view engine', 'pug');
app.set('views','Views');

app.use(express.static('Public'));

app.use('/', (request, response) => {
    response.render('index');
});

server.listen(PORT, HOSTNAME, function() {
    console.log(`STARTING SERVER ON PORT ${PORT}`);
});

索引哈巴狗代码

doctype html

html
  head
    title Site 1
    link(rel="stylesheet" href="/Css/style.css")

  body
    p Hello

nginx 配置

server {
        listen 80;
        listen [::]:80;
        root /var/www/html;
        index index.html index.htm index.nginx-debian.html index.php;
        server_name www.monsite.com;

        location / {
                #Reserved for another site
        }

        location /Site1/ {
                proxy_set_header X-Real-IP $remote_addr;
                proxy_set_header HOST $http_host;
                proxy_set_header X-NginX-Proxy true;

                proxy_redirect off;
                proxy_pass http://123.0.0.1:8000/;
        }
}

PS：我尝试了几乎所有在搜索此问题时发现的解决方案和代码，但没有任何效果，这就是我直接在这里询问的原因。谢谢。

【问题讨论】：

标签： node.js express nginx web reverse-proxy

【解决方案1】：

我认为问题在于链接标签中加载css的url，url无效，因为url实际上是/Site1/Css/style.css。

【讨论】：