react-router:动态内容未找到(404)?

Tom*_*rez 11 universal reactjs react-router isomorphic-javascript

如何react-router在通用应用程序中正确处理动态内容的404页面?

假设我要显示一个包含类似路径的用户页面'/user/:userId'.我会有这样的配置:

<Route path="/">
    <Route path="user/:userId" component={UserPage} />
    <Route path="*" component={NotFound}  status={404} />
</Route>
Run Code Online (Sandbox Code Playgroud)

如果我要求/user/valid-user-id,我会收到用户页面.

如果我要求/foo,我会得到一个合适的404.

但如果我要求怎么办/user/invalid-user-id?当为用户获取数据时,我将意识到该用户不存在.所以,做接缝的正确方法是:

  • 显示404页面
  • 返回404 http代码(用于服务器端呈现)
  • 保持网址不变(我不想重定向)

我怎么做??它接缝像一个非常标准的行为.我很惊讶没有找到任何例子......

编辑:
像我这样的接缝不是唯一一个与之斗争的人.这样的事情会有很大的帮助:https://github.com/ReactTraining/react-router/pull/3098
由于我的应用程序不会很快上线,我决定等待下一步的反应路由器版本必须提供......

Yan*_*Tay 0

如果您不使用服务器端渲染,则不可能在页面渲染之前返回 404。您需要以任何一种方式(在服务器上或通过客户端上的 AJAX)检查用户是否存在。如果没有服务器端渲染,第一个是不可能实现的。

一种可行的方法是在 Promise 错误时显示 404 页面。