使用服务器路由响应路由器浏览器历史记录

React router browser history with server routing

本文关键字：浏览器 历史 记录 路由器 响应 服务器 路由      更新时间：2023-09-26

我正在编写一个Web应用程序，使用客户端的react和服务器端的express。
我正在使用react-router（链接）路由客户端页面。
使用hashHistory它很简单并且工作正常，但现在我想使用browserHistory.

如react-router教程中所述，我需要告诉我的服务器期待客户端请求，因此当我们呈现客户端页面时，它将服务器index.html。
我找不到一种方法来处理来自客户端的页面请求和服务器处理请求。

例如，我在路径/product中有一个页面，但我还有一个用于服务器处理/authenticate的端点。

在react-router教程中，它说要使用以下方法：

// server.js
// ...
// add path.join here
app.use(express.static(path.join(__dirname, 'public')))
// ...
app.get('*', function (req, res) {
  // and drop 'public' in the middle of here
  res.sendFile(path.join(__dirname, 'public', 'index.html'))
})

但是这种方式将导致每个请求（包括/authenticate）将其发送回index.html。如何合并这两者？

你必须在

*之前定义/authenticate（这基本上是一个包罗万象，必须排在最后）

app.use(express.static(path.join(__dirname, 'public')))
ap.get('/authenticate', function (req, res) {
  res.sendStatus(200)
});
// ...
app.get('*', function (req, res) {
  // and drop 'public' in the middle of here
  res.sendFile(path.join(__dirname, 'public', 'index.html'))
})
相关文章：