如何使用ProxyPass通过Express提供静态文件?

Ata*_*v32 7 apache reverse-proxy mod-proxy node.js express

我正在使用Apache mod_proxy与Express一起提供我的Node应用程序,

ProxyPass /nodeapp http://localhost:3000/
ProxyPassReverse /nodeapp http://localhost:3000/
Run Code Online (Sandbox Code Playgroud)

但是从错误的地方请求静态JS和CSS.

例如,我想要CSS

http://homepage/nodeapp/css
Run Code Online (Sandbox Code Playgroud)

但它正在被请求

http://homepage/css
Run Code Online (Sandbox Code Playgroud)

小智 4

我在我的环境中通过在应用程序的index.html 中使用HTML“Base”标记解决了这个问题,然后确保应用程序中的所有链接都是相对的。这将有助于确保浏览器请求适当的路径。

值得注意的是,由于我的应用程序是 SPA(单页应用程序),因此所有资产始终有效,因为实际导航始终位于根目录。

在您的情况下,标签(在<head>元素内)可能如下所示:

<base href="/nodeapp/">
Run Code Online (Sandbox Code Playgroud)

我对应的 Apache 配置很简单:

<Location /nodeapp>
  ProxyPass http://127.0.0.1:9000
  ProxyPassReverse http://127.0.0.1:9000

  # other Apache directives here
</Location>
Run Code Online (Sandbox Code Playgroud)

我的应用程序碰巧使用 AngularJS,我可以使用 # 字符到达应用程序的“根”。例如,如果我想要访问/settings(将/nodeapp/settings在生产中),我将指定#settingshref任何给定链接。您的情况可能会有所不同,如果您使用 AngularJS 并调整设置以查看最适合您的部署的设置,那么绝对值得查看https://docs.angularjs.org/guide/$location 。html5Mode

我不必向 Express 讲述其挂载点,因为浏览器正在使用<base>上面的标签请求适当的资源,并且Apache 指令在将其交给 Express 之前会ProxyPass/ProxyPassReverse适当地进行剥离。/nodeapp

虽然我不必接触 Express 的路由器(如上所述),但理解以下内容可能仍然有用。如果您使用 Express 4.x,“安装”Express 应用程序据称比以前版本的 Express 更容易。这里有一些很好的例子:https ://github.com/visionmedia/express/wiki/New-features-in-4.x

从该页面:

想象一下您的项目中的一个示例routes/people.js。

var people = express.Router();

people.use(function(req, res, next) {
});

people.get('/', function(req, res, next) {
});

module.exports.people = people;
Run Code Online (Sandbox Code Playgroud)

您可以将其安装在 /people 路径下,以便任何对 /people/* 的请求都将路由到 people 路由器。

app.use('/people', require('./routes/people').people);
Run Code Online (Sandbox Code Playgroud)

该页面还会引导您访问 Express 4.x Router API: http://expressjs.com/4x/api.html#router

ProxyPass然而,如果您使用 Apache来重写入站请求,则通常不需要此技术。

如果您的应用程序不是 SPA,您可能会幸运地使用mod_proxy_html. 我在这方面取得的成功有限,但 AngularJS 最终不太喜欢它。但是,我相信它可能适合不同的应用程序。

如果您选择使用,mod_proxy_html您可以在此处查看 StackOverflow 问题和解答以获取更多信息:ProxyHTML to rewrite URL