首页 > 解决方案 > 启动时反应检查身份验证

问题描述

我现在有一个需要登录的 React 网站。当您加载页面时,react 需要检查您是否已登录(通过调用网络服务器)。

如果用户已登录 ( isAuthenticated = true),则会向用户显示网站,如果 ( isAuthenticated = false),则会显示登录页面。

isAuthenticated = false默认情况下,如果用户已登录,则用户会在检查用户登录之前简要查看登录页面。

其他网站如何处理这个问题?看起来 Facebook 能够在启动时知道您是否已登录。

标签: reactjs

解决方案


听起来您已经设置了身份验证,您只是想阻止经过身份验证的用户在初始加载时看到登录页面在屏幕上闪烁。

如果是这种情况,您可以最初设置isAuthenticated为非布尔值(nullundefined),在进行身份验证时显示加载组件,并仅在准备好时呈现应用程序。

例如,在您的主 App 文件中,您可以使用以下内容:

render() {
   // use strict equality check
   return isAuthenticated === null ? <IsLoading /> : <App />
}

<IsLoading />加载微调器在哪里,并且<App />是您当前从一开始就渲染的组件。


推荐阅读