React 路由器 404 错误（Litespeed Web 服务器）

Question

我正在构建电影应用程序，使用 create-react-app 进行初始化。我正在使用

react-router@5

。在生产环境中（在 Litespeed 网络服务器上）路由 url 时，我收到 404 错误，但它在本地计算机上工作。

示例网址：

www.example.com/tv/detail/131959 

我正在研究问题并发现

.htaccess

文件配置，但配置为apache或tomcat，并且我使用litespeed Web服务器。

AppRouter.js

const AppRouter = () => {
  return (
    <BrowserRouter >
      <Navbar />
      <ScrollToTop />
      <Switch>
        <Route exact path="/" component={App} />
        <Route exact path="/:type/detail/:id" component={DetailPage} />
      </Switch>
    </BrowserRouter>
  )
};

要检查，请访问 github 存储库：https://github.com/egecanyldrm/movie_app

.htaccess 配置

<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteBase /
  RewriteRule ^index\.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteCond %{REQUEST_FILENAME} !-l
  RewriteRule . /index.html [L]
</IfModule>

Answer 1

您的 .htaccess 是正确的， 您应该在 HTML 文件中编辑脚本和 css src，为此请按照以下步骤操作

1. 转到您的项目文件目录，看起来就像这样

   /var/www/html/

2. 运行此命令

   nano index.html

3. 从此编辑脚本路径

   ./static/js/main.123.js

   到

   /static/js/main.123.js

4. 以及从

   ./static/css/main.12345.css

   到

   /static/css/main.12345.css

的样式表路径
5. 然后按

   ^s

   保存文件，然后按

   ^x

关闭它

，，，，它会起作用，您可以更改脚本路径 py 打开文件，并在没有

nano

的情况下更改它（如果您可能的话）。

Answer 2

我遇到了同样的问题，并且您的 .htaccess 规则确实是正确的。但是，我怀疑 OpenLiteSpeed 没有正确处理您的 .htaccess 文件。我通过复制您的规则并将其添加到虚拟主机的“重写规则”下的上下文“静态”中解决了该问题。希望这个解决方案能让将来遇到类似问题的其他人受益。

Answer 3

使用以下脚本更新您的 .htaccess

RewriteRule ^index\.html$ – [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.html [L]

我正在使用 LiteSpeed 并且它有效