Question

我正在尝试在Apache中设置反向代理以提供React / Redux / webpack捆绑包。我有一个Express服务器文件，用于提供我的静态文件和index.html，如下所示：

const express = require('express');
const path = require('path');

const app = express();
const port = process.env.PORT || 3000;

app.use(express.static('./dist'));
app.get('/', (req, res) => {
  res.sendFile(path.join(__dirname, 'dist', 'index.html'));
});

app.listen(port, () => {
  console.log(`Server running on port ${port}`);
});

我的apache配置如下所示：

<VirtualHost *:80>
  ProxyRequests off
  ProxyPass "/foo/" "http://localhost:8777/"
  ProxyPassReverse "/foo/" "http://localhost:8777/"
</VirtualHost>

现在，当导航到example.com/foo时，我的index.html和webpack包已正确提供，但React路由器抛出错误，指出/foo/与任何路由都不匹配。显然，这是因为/foo是该应用程序的代理位置，并且路由器不会（也不应该）考虑生产中使用的代理路径。

如何设置Apache，以便在将请求发送到localhost:8777时，apache不会传递/foo路径？换句话说，如何设置proxypass以便将对example.com/foo/bar的请求转换为对服务器上的localhost:8777/bar的请求，然后返回到客户端，就好像它来自example.com/foo /酒吧？

Answer 1

我的团队有一个类似的问题，他们解决此问题的方法是在允许Apache Proxy通过之前使用带有强制重定向[R]的RewriteRule。所以也许您可以尝试一下：

<VirtualHost *:80> ProxyRequests off RewriteRule ^/foo/bar/& /bar/ [R] ProxyPass "/bar/" "http://localhost:8777/" ProxyPassReverse "/bar/" "http://localhost:8777/" </VirtualHost>

我不是Apache配置方面的专家，因此您可能必须自己动手使用RewriteRule（https://httpd.apache.org/docs/2.4/mod/mod_rewrite.html#rewriterule）。但是，我相信以上内容可能只是对您问题的一部分的回答：

如何设置proxypass，以便将对example.com/foo/bar的请求转换为对服务器上的localhost：8777 / bar的请求

但是我对此不太确定，对不起：

然后返回客户端，就像它来自example.com/foo/bar吗？

希望其中一些会有所帮助。

Answer 2

更改nginx服务器更灵活，更容易配置

server { 
  listen 80 default_server;
  listen [::]:80 default_server;
  root /usr/share/nginx/html/web;
  location / {
  try_files $uri /index.html;
}
}

使用Apache反向代理

2 个答案: