reactjs - 使用地址栏在单页应用程序中路由用户

Question

我有一个后端使用 express 为静态目录提供服务，指向路径 /，其中包含一个页面前端。此后端还提供 API REST。

前端是用 React 构建的，并使用 react-router 从 Web 应用程序的不同 View 路由用户。

如果我的 react-router 有两个条目，比如 /app 和 /config，

如果用户直接在 Web 浏览器的地址栏中输入 URL，我如何才能将客户端重定向到该应用程序 View ？

现在，如果我这样做，Express 会收到请求并显然返回 404 消息，因为单个页面被提供给 / 路径。

Answer 1

解决这个问题的一个简单方法是始终(即使在 404 上)在您的快速路由处理程序中向用户发送 index.html。

参见:https://stackoverflow.com/a/25499007/2624575

但是，您需要注意一些事情:

1) 你的 React Router 代码应该开始处理 404:https://stackoverflow.com/a/37491381/2624575

2) 你需要正确处理资源路径(图标、css、js 等)，否则你将向这些资源发送相同的 index.html(这将使您的页面呈现不正确)

3) 确保react-router 正在使用browserHistory(不使用散列的历史#)，这样React将能够正确呈现您的路线

希望对您有所帮助!