共计 1043 个字符，预计需要花费 3 分钟才能阅读完成。
后端：
用户附带 Bearer auth 认证 token 去申请接口，而后后端判断接口是否过期？如果过期了，那么在返回信息的响应头 authorization 中增加一个新 token，并容许了过期 token 的最初一个申请，之后再用这个过期 token 拜访接口就不会再返回新 token 了，因为新 token 曾经返回过一次了。
为了更好的测试，咱们将后端 jwt 的过期工夫设置为 1 分钟，则一分钟过期一次，而后刷新 token，直到 24 小时后刷新工夫过期，须要从新登录。
前端：
步骤：- 登录时，咱们申请 login 接口，而后接口返回给咱们登录胜利，以及 token
- 而后将 token 保留在 vuex 与 LocalStorage，进入后盾首页
- 进入后盾首页之后，咱们首先须要获取的是用户信息（在后盾首页 index 组件中申请），还有对应的用户权限菜单（在 router 拦截器中申请）、以及后盾首页须要显示的数据（在后盾首页 index 组件中申请）
测试：因为 token 1 分钟 过期，咱们将在登录胜利进入后盾首页之后进行操作期待 1 分钟
这个时候咱们刷新页面。
过程：他会同时执行 3 个申请，因为是异步申请，再者因为是不同组件，没有应用 async/await，所以这 3 个申请中，任意一个第一工夫发出请求的，会在响应头中失去新的 token，而后还没有来得及在 vuex 及 LocalStorage 中保留，第二个申请就带着 Vuex/LocalStorage 中的就 token 拜访了，而后失去后端返回的 token 生效及谬误状态码
后果：申请回来之后响应拦截器发现此 token 生效了，而后就间接跳转到登录页面，删除了 vuex/LocalStorage 中的所有信息，实际上在第一个申请收回的时候，新的 token 曾经返回了，只不过是还没有保留呢，第二个申请就带着旧 token 拜访了。
要害代码截图：axios 封装：
路由拦截器：
index.vue
刷新页面时申请：
发问：这种状况我尝试过很多办法，其中很多人都提出来应用监听，监听什么呢？token 始终都是存在的，不会为空，如果监听 token 时候无效，那么又多了一次申请。
如果说去别的页面也会遇到这种问题，比方在用户核心页面，刷新页面会同时收回用户列表申请和我的信息申请及菜单申请，也会呈现这种问题。
如果解决这种问题，是前端解决还是后端解决？后端这样设计 api 是因为要实现 token 的单点登录，一个 token 只能一个人应用，过期的 token 也不会再刷新。
我切实想不到一个好的解决办法，心愿帅气的前端大佬们帮我指点迷津，我将感激不尽。