reactjs - 在reactjs中重新加载页面时如何修复404

Question

我在生产中遇到 reactjs 问题，在我的开发机器中，我可以轻松刷新/重新加载而无需重定向到 404(未找到页面)，但在生产期间每次我重新加载或刷新 http://example.com/subdirectory/dashboard它将始终转到 http://example.com 的 404 页但是当我在开发机器上时 http://localhost:3000/subdirectory/dashboard当我刷新/重新加载页面时，它将按预期重新加载。

注意:在生产中，我将静态数据上传到子目录中，因此我在路由中使用 basename。

Answer 1

如果您在标准网络服务器上服务您的应用程序，您可以添加 .htaccess使用以下启用重写规则的方法:

Options -MultiViews
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^ index.html [QSA,L]

您所面临的 404 问题很可能只需将上述内容与项目的根一起提供即可解决。

或者，您也可以使用以下内容作为节点服务器:

const express = require('express');
const path = require('path');
const app = express();

app.use(express.static(path.join(__dirname, 'build')));

app.get('/', function(req, res) {
  res.sendFile(path.join(__dirname, 'build', 'index.html'));
});

app.listen(9000);

以上可以与 .htaccess一起使用.

创建 react 应用程序的家伙也促进服务，你可以找到 here和官方 react 部署文档 here

1: https://github.com/zeit/serve

2: https://create-react-app.dev/docs/deployment#docsNav