前端如何实现token的无感刷新？

前端如何实现token的无感刷新？这是一道非常高频的场景题，一般是为了解决频繁登录造成的用户体验问题，所以需要前端定时去刷新token，以帮助用户静默登录，大多数同学应该都对这个问题只能回答出大概，老规矩，点赞收藏支持一下，给我一分钟，理想哥教大家该怎么满分回答这个问题。如果我是求职者，我会这么回答：

前端实现token的无感刷新，一般有以下三种方案：

第一种，由后端同学来返回过期时间，前端在每次请求的时候，判断token的过期时间，如果快到过期时间，就去调用刷新token接口。不过，这种方案不仅需要后端额外提供一个token过期时间，而且当前端用本地时间判断，本地时间又被修改的情况下，就会造成判断不准确，所以不推荐。

第二种，前端写个setInterval定时器，定时去检查距离用户登录时间是否超过某个时间段，然后去刷新token接口，这种方案比较浪费资源，所以不建议使用。

第三种，可以在axios请求响应拦截器中拦截，当判断token过期后，调用刷新token的接口，这种方案不需要后端额外返回字段，也不会浪费资源，是比较推荐的，不过，这种方案实现的时候，需要注意几点，

第一点就是需要防止多次刷新token。我们可以在请求刷新token接口前，新增一个字段用来判断此时是否刷新token中，如果不是，那就走刷新token逻辑，如果是，那就绕过刷新token逻辑

第二点，如何处理并发请求的场景，比如，用户使用promise.all同时发起多个请求，导致这几个请求都进入到判断token刷新的逻辑中了，该怎么解决？我们可以先把这些请求都存储到一个promise数组中，等token刷新结束后，再统一执行这个数据，把存储的接口都统一再请求一次。

以上就是这个问题的回答了，大家可以下次面试时试试这么回答看看效果。

如果大家想要第三种方案的实现源码，也欢迎在评论区扣个1.

最后，欢迎关注理想哥，每天学点前端面试小技巧。