如何为React路由设置Apache服务器?

本文介绍了如何为React路由设置Apache服务器?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

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

I have my react app running great on my local dev server but it did not work when I dump my production ready files straight into Apache's htdocs directory:

这就是我所拥有的:

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

我有

DocumentRoot /var/www

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

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

事实是， 1).当我访问 ../时，将我引导到登录页面 2).单击链接后

The fact is that 1). when I access ../ that routed me to Login page 2). After I clicked a link

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

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

the content in the browser location field become:

../main

3).现在，如果我重新加载此URL( ../main )，我就得到了

3). Now if I reload this url (../main), I got

The requested URL /main was not found on this server

我在React中的困扰

My rounting in React:

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

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

What else I am missing in the apache configuration?

谢谢

推荐答案

通过添加以下Rewrite *行来更改 VirtualHost配置(通常在/etc/httpd/conf.d\vhosts.conf中找到):

Change the VirtualHost configuration (typically found in /etc/httpd/conf.d\vhosts.conf) by adding the following Rewrite* lines:

<VirtualHost *:8080> ServerName example DocumentRoot /var/www/httpd/example <Directory "/var/www/httpd/example"> ... 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.

This tells Apache to serve any files that exist, but if they don't exist, just serve /index.html rather than a 404: not found.

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

react-router历史记录参考:配置服务器

从此处