uniapp 微信小程序 实现请求业务接口发现token过期自动重新获取且再重新请求业务接口

编程入门 行业动态 更新时间:2024-10-14 22:22:07

uniapp 微信小程序 实现请求业务<a href=https://www.elefans.com/category/jswz/34/1771365.html style=接口发现token过期自动重新获取且再重新请求业务接口"/>

uniapp 微信小程序 实现请求业务接口发现token过期自动重新获取且再重新请求业务接口

小程序官方给出的小程序登录流程:
点击进入小程序登录官方文档

官方给登录流程图:

本文所提到的token对应官方说的自定义登录态,token一般都是有时效性,按照此流程,当token失效的时候,页面在请求接口的时候服务端肯定会认为token是非法的,此时就需要小程序端重新获取新的token,然后继续接着后面的流程走。一般服务端都会给一个特定的状态码标记需要重新获取token,后面的场景我们都以服务端返回code码401认为需要去登录。

场景1:token失效之后直接跳转到特定的一个授权登录页面
由于getUserInfo接口变动的缘故,必须用户手动去触发一个按钮,一般都会做一个特定的授权登录页面或者弹窗,那此时在接口返回401的时候那我们直接就跳转到那个授权页面或者弹起授权登录弹窗即可,相当于是走了用户第一次进入该小程序的流程。

这种方案是最简单的解决方案,但是缺点也很明显:打断了用户的操作流程,重复了第一次授权登录的流程,很繁琐。

场景2:token失效之后无感知获取新token并继续之前的操作
分2步来解决这个问题,无感知获取token

这个其实很简单,调wx.login()获取code之后再调服务端新的接口,此接口只需要接受code返回当前登录账户最新的信息(token以及其他),拿到最新token。

具体代码实现如下:

config/request.js

import base from '@/config/baseUrl'
const baseUrl = base.baseUrl
// 不需要显示loading的接口
const whiteList = ['/wechat/user/file/list','/wechat/user/file/uploadFile/','/wechat/user/file/handlerFile/',
]
let flag = false
// 全局请求封装
function request(url, method, params, callback = '') {
const token = uni.getStorageSync('user_token')whiteList.forEach(item => {if(url.indexOf(item) > -1){// 不需要loadingflag = true}})if(whiteList.indexOf(url)>-1 || flag) {// 不需要显示loading} else {uni.showLoading({ title: '加载中' })}if(!token ){// 执行没有登录的逻辑uni.hideLoading()// 如果没有登录权限就停止往下执行// return}return new Promise((resolve, reject) => {wx.request({url: baseUrl + url,method: method,header: { 'Authorization': 'Bearer ' + token },data: params,success:res => {if (callback){return callback(res.data)}if (res.data.code === 401) {console.log('401执行removeStorageSync')getNewToken().then(() => {request

更多推荐

uniapp 微信小程序 实现请求业务接口发现token过期自动重新获取且再重新请求业务接口

本文发布于:2024-02-14 15:26:56,感谢您对本站的认可!
本文链接:https://www.elefans.com/category/jswz/34/1764064.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:接口   业务   再重新   发现   程序

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!