微信小程序之登录授权

一、如何获取token

第一步：通过wx.login得到code,调用接口获取登录凭证（code）。通过凭证进而换取用户登录态信息
第二步：通过调用公司后台接口（自动注册/登录接口）获取腾讯用户的匿名信息

  //引入接口
const {authorize}=require('../../http/api')
//登录/注册
goLogin() {
 wx.login({
  success(res) {
    console.log(res);
    let {code}=res;
    authorize(code).then(res=>{
      console.log('我能获取到信息：',res);
      if(res.code===0) {
        //解析出token,uid,但是得到是匿名用户信息
        let {token,uid}=res.data
        if(!wx.getStorageSync('token')) {

          wx.setStorageSync('token', token)
        }
        
      }
    })
  }
 })

}

获取微信详细的用户信息

     
      以前：wx.getUserInfo()
      现在：wx.getUserProfile()
      
      token:是用户的唯一标识，是用户（前端）登录之后，后台对用户名，密码和失效时间加密返回给浏览器的一个字符串，用户（前端）可以利用token写其他业务代码
      
      检测token是否有效:调取公司后台接口来检测是否有效 user/check-token
      检测微信登录态是否有效  wx.checkSession()
      
//检测微信登录状态      
async function checkSession(){
return new Promise((resolve, reject) => {
  wx.checkSession({
    success() {
      return resolve(true)
    },
    fail() {
      return resolve(false)
    }
  })
})
}
      
// 整体检测微信和token是否失效，返回 true / false
async function checkHasLogined() {
const token = wx.getStorageSync('token')
if (!token) {
  return false
}
const loggined = await checkSession()
if (!loggined) {
  wx.removeStorageSync('token')
  return false
}
const checkTokenRes = await WXAPI.checkToken(token)
if (checkTokenRes.code != 0) {
  wx.removeStorageSync('token')
  return false
}
return true
}
      
小程序登录、用户信息相关接口调整说明：
https://developers.weixin.qq.com/community/develop/doc/000cacfa20ce88df04cb468bc52801

二、总结微信登录授权流程

1. 通过wx.login获取code
2. 通过code换取用户的匿名信息,并将获取的token缓存起来

3.通过调取微信wx.getUserProfile()方法来获取用户详细信息

  toLogin() {
    wx.getUserProfile({
      lang:'zh_CN',
      desc:'我要获取信息用户',
      success:(res)=>{
        console.log('用户详情：',res);
        this._updateUser(res.userInfo)
      }
    })
  }

4.再调公司后台修改用户的接口(/user/modify)，来更新用户信息

 /**
    * 修改用户信息
    * @obj {Object} 要接收的对象参数如下：
    * city:所在城市
    * nick:昵称
    * province:省份
    * avataUrl:头像地址
    * gender:性别
    * token
    */

  modifyUser:(obj)=>{
    return request('user/modify','POST',obj,true)
  },
 
 _updateUser(userInfo) {
    let token=wx.getStorageSync('token');
    let {city,nickName,avatarUrl,province,gender}=userInfo;
    let _data={city,nick:nickName,avatarUrl,province,gender,token}
   // console.log(_data);
    modifyUser(_data).then(res=>{
      console.log('修改成功：',res);
    })

5.最后拉取用户信息，将用户信息渲染到视图上

//获取用户信息
  async getUserInfo() {
    let token=wx.getStorageSync('token')
    //调取用户详情的接口
    const res=await getUserDetail(token)
    console.log('调取用户详情:',res);
    let _data={}
    if(res.code===0) {
      let {avatarUrl,id,nick}=res.data.base;
      let n=0;
      if(nick && avatarUrl ) {
        n=2;
      }else {
        n=1;
      }
      _data={avatarUrl,id,nick,isShow:n}
      this.setData(_data)

    }

  }