Question

我有一个在端口3000上运行的NodeJS + ExpressJS应用程序，它有一条路径：

router.get('/getHello', function(req, res) {
    res.send('Hello, world!');
});

和在此路线上执行GET的HTML页面

<a href="/getHello">
    <input type="button" value="Visit Helo World page" />
</a>

此独立应用按预期工作。按下按钮时显示Hello, world!。

现在，问题出在此处：

我已使用nginx在此应用上设置了反向代理。这是来自sites-available的配置文件（与sites-enabled链接）

server {
    listen 80;
    server_name localhost;

    location /routetest/ {
        proxy_pass http://127.0.0.1:3000/;
        proxy_http_version 1.1;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-NginX-Proxy true;
        proxy_set_header Host $host;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
        proxy_set_header X-Forwarded-Proto $scheme;
        proxy_redirect off;
        proxy_cache_bypass $http_upgrade;
    }
}

当我访问http://localhost/routetest时，该应用程序正常打开，但当我点击该按钮时，它会打开http://localhost/getHello，而我希望它打开http://localhost/routetest/getHello。由于未定义http://localhost/getHello，因此我最终得到404.（另一方面，http://localhost/routetest/getHello正确返回Hello, world消息）

现在，我的问题是：

我的前端是用/作为基本路径编写的（用于发出所有GET和POST请求），例如<a href="/getHello">，我觉得手动追加 {{1}在我的HTML中的所有URL之前不是一个好习惯（因为我可能想稍后更改此基本路径，然后我将不得不在任何地方更新它）。那么，/routetest/或某些NGINX中间件是否有办法为使用express作为基本路径编写的网址添加/routetest/，而无需在我的基础路径中进行更改HTML手动？

Answer 1

从长远来看，最简单的解决方案是使用没有前导/的相对路径，如果这是您可以使用的选项。

在一般情况下，重写响应中的URL介于棘手和不可能之间。如果您认为自己可以成功识别内容中的相关网址，则可以使用nginx标题为ngx_http_sub_module的标题：

https://momentjs.com/docs/#/query/is-before/

有各种Express中间件实现做类似的事情，但我找不到一个看起来足够可靠的推荐。如果您想要自己动手，那么基本方法将类似于compression中间件。同样，一般来说这很困难，但根据你提供HTML的具体细节，它可能不会太糟糕。

NGINX + ExpressJS - HTML中URL的反向代理

1 个答案: