javascript - react js 和 redux 在每条路线之前发送一个 api 调用

标签 javascript reactjs redux react-redux react-router

您好,我正在研究 React 和 redux 单页应用程序,但我遇到了一个问题。

在我的应用程序中,管理员可以关闭和打开应用程序然后我们将允许用户访问和查看我们应用程序的页面。

但我面临一个问题,我来自 PHP 和 Laravel 背景,我可以在我的每条 route 添加一个中间件,我可以轻松实现我的目标。

我已经对此做了一些研究,我发现我必须为此创建一个高阶组件并在应用程序启动时调用 api,并且必须将 api 结果存储在本地存储中,但是如果我调用api 并将 api 结果存储在我的本地存储中,然后在接下来的 5 分钟内管理员关闭餐厅然后我如何更新我的客户端本地存储以便我可以限制用户访问查看页面而应用程序从管理员关闭面板。

所以这就是为什么我需要在每个路由之前发送一个 ajax 请求以验证用户是否可以查看该页面。

谁能帮我解决这个问题,我怎样才能实现我的上述目标。

最佳答案

我认为在任何路由之前发送 HTTP 请求并不是您问题的最佳解决方案。

最简单的方法是在餐厅关门时只返回一个 HTTP 错误以响应授权的 HTTP 请求。因此,您可以在客户端设置一些 HTTP 请求拦截器并拦截每个 HTTP 响应 - 如果它包含错误响应 - 然后将用户重定向到错误页面。

检查 this用于 HTTP 拦截器

关于javascript - react js 和 redux 在每条路线之前发送一个 api 调用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54517082/

相关文章:

javascript - 子组件在 Angular 4 中不起作用

javascript - P5js库中如何获取鼠标拖动对象的速度

javascript - 如何在 flex 容器中的每个元素上覆盖文本+图像?

javascript - 授权时无法提取授权码

javascript - 我想通过另一个数组中的 id 过滤出一个对象数组

reactjs - 如何使用函数在 'useState' 中设置初始状态?

javascript - Node (Gulp)process.stdout.write 到文件

javascript - Knockout 中的简单字符串替换

javascript - 功能组件中的 setState 不保留值

typescript - react Redux TS : TypeScript complains about a connect() call