如何解决使用中的功能效果挂钩未运行
过去两天,我一直在努力解决页面重新加载reactJS / NodeJS应用进入登录页面的问题。我使用jwt身份验证。在每个页面上,我在loadUser
中具有useEffect
功能
有功能:
const loadUser = async () => {
if (localStorage.token) {
setAuthToken(localStorage.token);
}
try {
const res = await axios.get("/api/auth");
dispatch({ type: USER_LOADED,payload: res.data });
} catch (err) {
dispatch({ type: AUTH_ERROR });
}
};
// USER_LOADED
case USER_LOADED:
return {
...state,isAuthenticated: true,loading: false,user: action.payload,loaded: true,};
页面重新加载应用程序进入登录页面并设置初始状态。似乎该功能未运行,我不明白为什么?
有什么想法吗?
解决方法
您的代码似乎未同步。您能否在本地显示挂钩以及auth状态的重定向和存储。
我个人使用cookie来在本地存储令牌。我用凭证“:include”调用了我的api。但是并不是在每个页面上,而是在主页上将其作为一个React应用程序,因此最终所有组件都合并并显示在一个仪表盘上。 而且很简单,如果api返回true,则将本地授权状态变量设置为true。 在呈现的仪表盘下方,else语句表示api仍在被调用(互联网运行缓慢等)。
{
fetch(${pusherConfig.API_URL}/admin/api/dashboard
,{
方法:“ GET”,
凭据:“包括”,
})
.then((res)=> res.text())
.then((res)=> setAuthState({authorized:1}));
}
{授权? (DashboardComponent />):(
受保护的路由!正在验证... / p>)}
以及在主登录页面上的设置也与上述相同。 (因为它是整个不同的页面)
{已登录? LoginComponent />:DashboardComponent />}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。