使用uniapp+uview ui框架封装的Http请求,怎么做无痛刷新token?

blank
  • 3
新手上路,请多包涵

在写微信小程序,是用uniapp框架,ui框架用的uview,uview有自带的请求拦截。但是token过期时没法看到请求失败接口的cofig,那么等到刷新后就无法再次请求。请问有人遇到过这个问题吗?image.png

回复
阅读 872
2 个回答

wx.login()里含有一些已经登录的状态保留在手机内存中,所以服务器掉线后(或者token失效)实际上小程序内仍然是在线的。

我看到你发的代码中有201的判断,只不过是跳转到了登录页。这里其实可以不需要addInterceptor就可以轻松优雅的做到这一点:

我推荐后端修改一下,参考jwt(package)当token失效时会控制器会返回refresh_token:xxxxxxx 的新token。前端在request封装中添加感知到http code是201并且含有refresh_token,可再次使用refresh_token做为Authorization进行请求来正常访问了。


我补充下用axios请求的节选代码:

const service = axios.create({........})
axios.defaults.headers.common['Accept'] = 'application/json'

service.interceptors.request.use(
config => {
    // 添加Authorization
    config.headers['Authorization'] = 'Bearer ' + Cookie.get(TokenKey)}
)
}



// response interceptor
service.interceptors.response.use(
   function(response) {
   if (response.data.refresh_token !== undefined) { # < --- 这里呀
      // 刷新token
      Cookie.set(response.data.refresh_token)
    }
    return response
   }
)

夜空
  • 2
新手上路,请多包涵

wanjunshijiecom 2021-08-06 at 11.50.52@2x.png
修改一下uview-ui源文件就可以了
重新运行应该就可以获取到config 了

{
    "data": {
        "code": 10041,
        "message": "access token 损坏",
        "request": "POST /v1/collection/list"
    },
    "statusCode": 401,
    "header": {
        "Date": "Fri, 06 Aug 2021 03:48:49 GMT",
        "Keep-Alive": "timeout=5",
        "Content-Length": "83",
        "Connection": "keep-alive",
        "Content-Type": "application/json; charset=utf-8",
        "Vary": "Origin"
    },
    "errMsg": "request:ok",
    "cookies": [],
    "config": {
        "url": "http://localhost:7000/v1/collection/list",
        "method": "POST",
        "header": {
            "Authorization": "Bearer 123",
            "Content-Type": "application/json"
        },
        "data": {
            "pageNum": 1,
            "pageSize": 10
        },
        "dataType": "json",
        "responseType": "text",
        "params": {},
        "complete": "function() { [native code] }"
    }
}
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
你知道吗?

宣传栏