Question

我确实有一个使用ReactJS和React Router V4构建的应用程序，我正在尝试将其发布到生产环境。

在生产环境中，我的Apache具有以下配置：

$ cat /etc/apache2/sites-available/000-default.conf

<VirtualHost *:80>
    ServerName myapp.localhost
    ServerAdmin webmaster@localhost
    DocumentRoot /var/www/html
    SetEnv APP_HOME /usr/local/bin/myapp
    <Directory "/var/www/html">
        AllowOverride All
    # Don't rewrite files or subdirectories
        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>

在浏览时，我这样做：

http://192.168.0.100

它将加载我的目标网页。但是从那里我无法访问其他任何网址：

http://192.168.0.100/login
http://192.168.0.100/status
http://192.168.0.100/detail/1
http://192.168.0.100/dashboard

所有页面我都从Apache得到以下错误：

<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 2.0//EN">
<html><head>
<title>404 Not Found</title>
</head><body>
<h1>Not Found</h1>
<p>The requested URL /status was not found on this server.</p>
<hr>
<address>Apache/2.4.10 (Debian) Server at 192.168.0.100 Port 80</address>
</body></html>

我很确定我的配置有问题（可能是我的RewriteCond / RewriteRule），但不知道如何解决。

Answer 1

我知道这已经晚了一年，但是我想分享这个解决方案，假设使用了Ubuntu OS，以防任何人与您有同样的担忧：

从post from Reddit开始，我已经执行了某些步骤，我可以证明此方法可以使SPA通过正确的路由在Apache Web服务器中运行。

引用：

1）在apache2.conf中的etc/apache2/中，我将AllowOverride变成了All。我还在文件中添加了服务器名localhost。（我不知何故跳过了最后一句话，但最后还是很好用）

<Directory /var/www/>
    Options Indexes FollowSymLinks
    AllowOverride All
    Require all granted
</Directory>

2）在hosts.debian.tmpl中找到的/etc/cloud/templates文件中，我在文件中添加了127.0.0.1 <yourdomain.com>相似之处。

127.0.0.1 yourdomain.com

3）我跑了sudo a2enmod rewrite。然后，我通过service apache2 restart重新启动了apache服务器。这将打开mod_rewrite。

几乎在我的项目文件夹/var/www/html中，在我的index.html文件旁边，我创建了一个.htaccess文件，并添加了以下内容：

RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-l
RewriteRule ^.*$ / [L,QSA]

结束报价

假设您已经运行npm run build，然后将build文件夹中的所有内容复制到了公共目录，则应该可以。

当我第一次开始Web开发时，我真的不确定我是否正确配置了VirtualHost，因此通常要做的是首先创建一个虚拟的index.html，例如Hello World示例。当我确认可以在浏览器中看到Hello World时（这意味着我正确配置了VirtualHost），我将build文件夹的内容转储到虚拟index.html所在的位置。 / p>

希望现在对您的帮助与对我一样多！

使用React Router V4的ReactJS的Apache配置

1 个答案: