React-router url与Apache反向代理不匹配

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是该应用程序的代理位置，并且React Router不（也不应该）考虑生产中使用的代理路径。

[如何设置Apache，以便将请求发送到localhost:8777时，apache不传递/foo路径？换句话说，如何设置proxypass，以便将对example.com/foo/bar的请求转换为对服务器上的localhost:8777/bar的请求，然后像从example.com/foo/bar一样返回给客户端？] >

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

Answer 1

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