Question

这可能更多的是服务器问题，而不是React Router的问题，但这是我遇到的情况：

在我的本地计算机上开发我的应用程序时，请说我希望导航到路由/about。例如，我可以输入localhost:3000/about并按Enter键，页面将加载并显示＆＃34; about＆＃34;零件。

但是在构建应用程序并将其部署到我的服务器上之后，如果用户物理地键入http://example.com/about（假设我的网站为example.com）并点击输入到URL栏，它将返回服务器错误404 - 找不到文件或页面错误。我怎样才能简单地加载about组件而不是尝试导航到＆＃34; about＆＃34;页面不存在？

Answer 1

我不确定您使用的是哪种类型的服务器技术。使用react-router中的BrowserRouter，您需要确保服务器在您要求/关于时发送回index.html。

这是我在快递中使用的一个例子：

app.get('*', function (request, response){
  response.sendFile(path.resolve(__dirname, '../build', 'index.html'));
});

当某人转到/关于它时，它会发回index.html，然后您的路由将由react-router管理。

webpack-dev-server在您使用historyApiFallback时为您执行此操作。 https://webpack.js.org/configuration/dev-server/#devserver-historyapifallback

React Router - 如何处理服务器上不存在的页面？

1 个答案: