Javascript 反应路由和专用路由

我试图通过检查我的express服务器来阻止对私有路径的访问，如果用户在允许访问它之前已登录，则重定向到登录

我创建了一个与服务器进行检查的私有路由函数。问题是，我不知道如何让它在决定路由到哪个组件（私有页面vs登录）之前等待响应

const isAuthed=（）=>{
获取（“/api/checkLogin”{
方法：“GET”，
凭据：“包括”
})
。然后（响应=>{
console.log（response.status==200）；
返回response.status==200；
});
}
const privaterout=（{component:component，…rest}）=>{
返回(
isAuthed（）==真(
) : (
)
}
/>
);
}

用户每次访问站点时，不应通过服务器进行身份验证

react路由器

的条件路由只有在可以同步检查条件的情况下才有效

当用户第一次成功通过身份验证时，您会将一个指示身份验证状态的变量（如果需要，还带有到期日期）存储到

localStorage

---

当用户再次访问网站时，您可以通过从

localStorage

获取身份验证状态来重定向（这是一个同步操作）。

是。IsAuthed未返回true。如果等待回迁并返回响应，IsAuthed将返回true（如果用户获得授权）@FabbIsAuthed（）是一个异步调用，在作为普通方法调用时将返回undefined，因此

IsAuthed（）==true

将始终为false。理想的方法是在父组件中进行异步调用，并将

isAuthenticated

作为道具传递给PrivateRoute组件。是的，有点感觉我不能每次访问都检查服务器。我可能会将身份验证状态存储在sessionStorage中。您是否知道用服务器身份验证状态更新sessionStorage的最佳方法？例如：用户登录…转到另一台计算机，注销，回到第一台计算机，访问一个私有站点…会话存储仍然会说它已被授权。您可以执行异步身份验证（在

PrivateRoute

呈现后），所以用户在重定向之前仍会短暂地看到私有页面（当API调用返回时）。另一种方法是呈现加载页面（例如，使用微调器）直到异步身份验证完成，但这通常不是一个好的UX。因此，如果我在localStorage中添加tomato，这将允许我访问受保护的页面！？@HasanDaghash是的，但用户将无法获取更新的数据，因为AJAX调用将失败，验证cookie无效，因此页面将只包含空/过时的数据。这是h现代SPA是如何工作的，因为客户端无论如何都会拥有页面视图的（缩小的）源代码。我怀疑angular是否能够激活并正确处理这一部分，但在react中，我仍在探索最佳实践