微信小程序之无感知刷新token - 新闻资讯 - 云南小程序开发|云南软件开发|云南网站建设-昆明葵宇信息科技有限公司

159-8711-8523

云南网建设/小程序开发/软件开发

知识

不管是网站,软件还是小程序,都要直接或间接能为您产生价值,我们在追求其视觉表现的同时,更侧重于功能的便捷,营销的便利,运营的高效,让网站成为营销工具,让软件能切实提升企业内部管理水平和效率。优秀的程序为后期升级提供便捷的支持!

您当前位置>首页 » 新闻资讯 » 小程序相关 >

微信小程序之无感知刷新token

发表时间:2021-1-4

发布人:葵宇科技

浏览次数:147

一.接口调用凭证token

微信小程序授权登录之后,会成生成token返回给客户端,客户端取得token之后,作为后续一系列接口的调用凭证,然后,服务器返回给客户端的token会有一个有效期,token一但过期,就会导致客户端后续的接口调用失败,因此,在调用接口之前,我们需要保证token是有效的,这样才能保证客户端的功能不会因为token过期而导致异常


二.微信授权登录、token合法性及有效性校验

token合法性及有效性校验

const Router = require('koa-router')
const router = new Router()
const { verifyToken } = require('../../../../utils/utils')
const User = require('../../../../model/user')

router.post('/api/v1/member/verify', async (ctx, next) => {
    const token = ctx.request.header.token
    //验证token是否过期
    const decoded = verifyToken(token)
    
    const res = await User.findByOpenID(decoded.openid)
    if(!res) {
        //用户不存在
        throw new global.errors.UserNotFoundException()
    }

    ctx.body = {
        code: 0,
        msg: "token有效"
    }
})

module.exports = router
const jwt = require('jsonwebtoken');
const verifyToken = function(token, secret) {
    let decoded
    try {
        decoded = jwt.verify(token, 'com_aykj_gale');
    } catch(error) {
        let err = new global.errors.ForbiddenException()
        if(error.name == 'TokenExpiredError') {
            err.msg = 'token已过期'
            err.errorCode = 10006
        } else {
            err.msg = 'token不合法'
            err.errorCode = 10005
        }
        throw err
    }
    
    return decoded
}
/api/v1/member/code2token: 登录获取token
/api/v1/member/register: 注册
/api/v1/member/verify: token合法性及有效性校验
/api/v1/member/member_index: 获取用户信息,后续会基于此接口,实现token的无感知刷新
三.微信小程序中请求接口

// /project_directory/config.js
const serverUrl = 'http://192.168.1.111:3000'

const config = {
  code2token: `${serverUrl}/api/v1/member/code2token`,
  register: `${serverUrl}/api/v1/member/register`,
  verify: `${serverUrl}/api/v1/member/verify`,
  memberIndex: `${serverUrl}/api/v1/member/member_index`
}

module.exports = config
// /project_directory/utils/http-service.js
class HttpService {
  constructor(){}

  get(url, params, headers) {
    if(!headers) {
      headers = {}
    }
    return this._request(url, 'GET', params, headers)
  }

  postJson(url, params, headers) {
    if(!headers) {
      headers = {}
    }
    headers['content-type'] = 'application/json'
    return this._request(url, 'POST', params, headers)
  }

  postForm(url, params, headers) {
    if(!headers) {
      headers = {}
    }
    headers['content-type'] = 'application/x-www-form-urlencoded'
    return this._request(url, 'POST', params, headers)
  }

  _request(url, method, params, headers) {
    return new Promise((resolve, reject) => {
      wx.request({
        url: url,
        method: method,
        data: params,
        header: headers,
        complete: function(res) {
          var errMsg = res.errMsg //request:ok;request:fail
          if(errMsg != "request:ok") {
            var reason = {
              code: -1,
              msg: "请求超时"
            } 
            reject(reason)
          } else {
            var resData = res.data
            var resDataCode = resData.code
            if(resDataCode != undefined) {
              if(resDataCode == 0) {
                resolve(resData)
              } else {
                reject(resData)
              }
            } else {
              var reason = {
                code: -1,
                msg: resData
              }
              reject(reason)
            }
          }
        }
      })
    })
  }
}

module.exports = HttpService
// /project_directory/http/request-center.js
import HttpService from "../utils/http-service"
import config from "../config"
const tokenKey = "token"
class RequestCenter {
  constructor() {
    this.httpService = new HttpService()
  }
  register(params, headers) {
    return this.httpService.postJson(config.register, params, headers)
  }
  code2token(params, headers) {
    return this.httpService.postJson(config.code2token, params, headers)
  }
  verifyToken(params, headers) {
    return this.httpService.postJson(config.verify, params, headers)
  } 

  memberIndex(params, headers) {
    return this.httpService.postJson(config.memberIndex, params, headers)
  }

  wxLogin() {
    return new Promise((resolve, reject) => {
      wx.login({
        complete: function(res) {
          if(res && res.code) {
            resolve(res.code)
          } else {
            reject({
              code: -1,
              msg: "wx.login 失败"
            })
          }
        }
      })
    })
  }
  
}

const requestCenter = new RequestCenter()
module.exports = requestCenter
// /project_directory/pages/index/index.js
const app = getApp()

Page({
  data: {
    
  },

  onLoad: async function(res) {
    var token = wx.getStorageSync('token')
    if(!token) {
      wx.reLaunch({
        url: '/pages/auth/auth',
      })
    } else {
      var headers = {}
      headers["token"] = wx.getStorageSync('token')
      await getApp().global.requestCenter.memberIndex({}, headers)
    }
  }
})

四.无感知刷新token

// /project_directory/http/request-center.js
import HttpService from "../utils/http-service"
import config from "../config"

const tokenKey = "token"

class RequestCenter {

  ...

  memberIndex(params, headers) {
   return this._verify(params, headers, () => {
      return this.httpService.postJson(config.memberIndex, params, headers)
    })
  }

  wxLogin() {
    return new Promise((resolve, reject) => {
      wx.login({
        complete: function(res) {
          if(res && res.code) {
            resolve(res.code)
          } else {
            reject({
              code: -1,
              msg: "wx.login 失败"
            })
          }
        }
      })
    })
  }
  
  _verify(params, headers, fun) {
    if(headers && headers[tokenKey]) {
      return new Promise((resolve, reject) => {
        //验证token是否过期
        this.verifyToken(params, headers).then((res) => {
          //token未过期,继续上一次请求
          fun().then((res) => {
            resolve(res)
          }, (reason) => {
            reject(reason)
          })
        }, (reason) => {
          var code = reason.code
          if(code == 10006) {
            //token过期,刷新token,继续上一次请求
            this.wxLogin().then((res) => {
              this.code2token({code:res}, {}).then((res) => {
                var token = res.token
                wx.setStorageSync('token', token)
                headers[tokenKey] = token
                fun().then((res) => {
                  resolve(res)
                }, (reason) => {
                  reject(reason)
                })
              }, (reason) => {
                reject(reason)
              })
            }, (reason) => {
              reject(reason)
            })
          } else {
            reject(reason)
          }
        })
      })
    } else {
      return fun()
    }
  }
  
}
const requestCenter = new RequestCenter()
module.exports = requestCenter

相关案例查看更多