前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >微信小程序接口请求token过期用户无感应获取token重新调用接口

微信小程序接口请求token过期用户无感应获取token重新调用接口

作者头像
安德玛
发布2022-03-08 17:55:58
1.8K0
发布2022-03-08 17:55:58
举报
文章被收录于专栏:Cordova封装H5 APPCordova封装H5 APP

封装接口请求,我们的业务需要在header上加token和openid,可以根据自己的业务逻辑进行项目改变。

代码语言:javascript
复制
const baseUrl = "xxx";
const http = ({
  url = '',
  param = {},
  type = 'json',
  callback = '',
  ...other
} = {}) => {
  wx.showLoading({
      title:'请求中...',
  })
  let timeStart = Date.now();
  return new Promise((resolve, reject) => {
    wx.request({
      url: baseUrl + url,
      data:param,
      header: {
        'content-type': type == 'json' ? 'application/json' : 'application/x-www-form-urlencoded',
        'token':getToken(),
        'openid': getOpenid() || getCouldOpenid().then(openid => openid)
      },
      ...other,
      complete: res => {
        wx.hideLoading();
        console.log(`耗时${Date.now() - timeStart}`);
       //重新请求完token,再次执行后的请求在这里拦截
        if(callback) { callback(res.data); return }      
        if(res.statusCode >=200 && res.statusCode < 300) {
        /**
         * 这是我们自定义的接口状态判断参数
         * status_code == 401 为token过期状态需要重新获取token
         * status_code == 403 为用户未登陆状态,需要走登录逻辑
         */
        
          if (res.data.status_code == 401 || res.data.status_code == 403) {
            if (res.data.status_code == 403) { //用户登陆并获取token
              wx.navigateTo({
                url: '/pages/loginIn/loginIn',
              })
            } else if (res.data.status_code == 401) { //token过期
              getNewToken(url, param).then(() => {
                http({
                  url,
                  param,
                  method: 'post',
                  callback: resolve
                })
              })
            }
          } else {
            resolve(res.data)
          }
      } else {
        reject(res);
    }
    })
  })
}

//获取新token
const getNewToken = (url, param) => {
  return new Promise((resolve, reject) => {
    wx.request({
      url: baseUrl + 'user!appLogin.action',
      data: {
        openid: getOpenid(),
      },
      header: {
        'content-type': 'application/x-www-form-urlencoded'
      },
      method: 'post',
      success: function (res) {
        console.log(res);
        if (res.data.success) {
          wx.setStorageSync('token', res.data.data.token);
          wx.setStorageSync('personal', res.data);
          resolve(res)
        } else {
          if (res.data.status_code == 403) {
            wx.navigateTo({
              url: '/pages/loginIn/loginIn',
            })
          }
        }
      },
    })
  })
}

//获取token
const getToken = () => {
  let token = wx.getStorageSync('token') || '';
  return token;
}

//获取openid
const getOpenid = () => {
  let openid = wx.getStorageSync('openid') || null
  return openid;
}

获取openid的方法, 我是使用的小程序云开发获取openid ,也可以使用code跟后台换取openid

代码语言:javascript
复制
//获取openID
const getCouldOpenid = () => {
  return new Promise((resolve, reject) => {
    wx.cloud.callFunction({
      name: 'login',
      data: {},
      success: res => {
        console.log('[云函数] [login] user openid: ', res.result.openid)
        resolve(res.result.openid);
        wx.setStorageSync('openid', res.result.openid)
      },
      fail: err => {
        console.error('[云函数] [login] 调用失败', err)
      }
    })
  })
}

本文系转载,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文系转载前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 封装接口请求,我们的业务需要在header上加token和openid,可以根据自己的业务逻辑进行项目改变。
  • 获取openid的方法, 我是使用的小程序云开发获取openid ,也可以使用code跟后台换取openid
相关产品与服务
访问管理
访问管理(Cloud Access Management,CAM)可以帮助您安全、便捷地管理对腾讯云服务和资源的访问。您可以使用CAM创建子用户、用户组和角色,并通过策略控制其访问范围。CAM支持用户和角色SSO能力,您可以根据具体管理场景针对性设置企业内用户和腾讯云的互通能力。
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档