我想要的:
我有一个私有路由(/dashboard),它只能在用户登录时才能访问。因此,我的条件是,只有当用户通过身份验证并加载为false (已完成)时,才会加载仪表板。如果用户未通过身份验证,请将其重定向到登录页。
问题
如果我单击导航栏中的仪表板链接,我的代码运行良好。如果我登录了,它会将我重定向到仪表板,但是当我试图通过直接键入localhost:3000/仪表板来手动转到仪表板时,问题就出现了。即使我刷新仪表板,它也会将我重定向到登录页面。
原因
因此,造成这个问题的原因是,这两种状态(身份验证和加载)都在Redux中,所以如果我直接访问仪表板,那么redux就需要一些时间来登录用户并更改我返回主页的状态,即使我已经登录了。

这需要一些时间,因为我在本地存储中有一个令牌,并且通过向后端发送post请求来检查令牌是否有效,在有效令牌上,我会让用户恢复到redux状态。
代码
在App.js
<Switch>
<Route exact path="/register" component={Register} />
<Route exact path="/login" component={Login} />
<PrivateRoute exact path="/dashboard" component={
</Switch>PrivateRoute.js
const PrivateRoute = props => {
let route = <Route {...props} component={props.component} />;
if (!props.isLoading && !props.isAuthenticated) {
route = <Redirect to="/login" />;
}
return <React.Fragment>{route}</React.Fragment>;
}您可以看到,在私有路由中立即检查条件,因为如果用户手动转到/dashboard,用户将被重定向到主页。
我怎样才能解决这个问题?
问题解决了:,我有一个小错误,由于这个错误,isLoading总是没有定义。通过修复它,它可以正常工作
发布于 2019-09-15 11:27:44
您可以通过让SPA服务器重定向到React的登陆页面来解决这个问题。它可以是/login/,但通常是/。此时页面被重新加载,React应用程序开始重新执行,React代码确定(检查是否有cookie,而不是查看刚刚重新创建的Redux存储)用户没有登录,并在内部从'/‘重定向到`/login/’。
SPA服务器不会意识到这个内部重定向,它是SPA内部的。但是如果用户在导航栏输入URL并点击Enter (我理解这就是问题所在),那么the服务器就会知道。
如果您使用webpack-dev服务器,那么SPA所需的重定向类型可以通过将historyApiFallback设置为true并指定重定向URL来实现。
https://stackoverflow.com/questions/57943567
复制相似问题