如何为 React 路由设置 apache 服务器？

Question

我的 react 应用程序在我的本地开发服务器上运行良好，但是当我将生产就绪文件直接转储到 Apache 的 htdocs 目录时它不起作用：

这是我所拥有的：

 /var/www/index.html
/var/www/bundle.js

我有

DocumentRoot /var/www

在 /etc/apache2/sites-available/000-default.conf

事实是

1）。当我访问将我路由到登录页面的 http://…com/

2）。在我点击一个链接之后

<Link to="main"><button>Log In</button></Link>

浏览器位置字段中的内容变为：

 http://...com/main

3）。现在，如果我重新加载此网址（ http://…com/main ），我得到了

The requested URL /main was not found on this server

我在 React 中的巡回演出：

     <Router history={browserHistory }>
      <Route path="/" component={TopContainer}>
          <IndexRoute component={Login} />
          <Route path='main' component={MainContainer} />
      </Route>
</Router>

我在 apache 配置中还缺少什么？

谢谢

原文由 Mark Qian 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

通过添加以下 Rewrite* 行更改 VirtualHost 配置（通常在 /etc/httpd/conf.d\vhosts.conf 中找到）：

 <VirtualHost *:8080>
  ServerName example.com
  DocumentRoot /var/www/httpd/example.com

  <Directory "/var/www/httpd/example.com">
    ...

    RewriteEngine On
    # Don't rewrite files or directories
    RewriteCond %{REQUEST_FILENAME} -f [OR]
    RewriteCond %{REQUEST_FILENAME} -d
    RewriteRule ^ - [L]
    # Rewrite everything else to index.html to allow html5 state links
    RewriteRule ^ index.html [L]
  </Directory>
</VirtualHost>

这告诉 Apache 提供任何存在的文件，但如果它们不存在，则只提供 /index.html 而不是 404: not found 。

• Apache 参考： 配置 Apache 虚拟主机

• react-router 历史参考： 配置你的服务器

感激地从 这里 偷走了完整的答案

编辑：’On’ 在当前的 apache 版本中需要大写

原文由 Hinrich 发布，翻译遵循 CC BY-SA 4.0 许可协议