mpvue开发微信小程序用户登录功能的实现过程

资料预习:

2.永久授权 在不必要使用用户公开信息(头像,昵称等)时,不调取授权登录接口,只有在必要的时候再去判断调取授权登录接口并把获取到的用户公开信息存入数据库,这样在每次登录时直接先运行指定函数从数据库索取需要的用户公开信息(头像,昵称等)即可,此方法在删除小程序后不用再次去授权登录(因为在用户第一次授权登录时已经把用户的公开信息存入数据库了以后直接向数据库索取即可),建议使用;

所有,我们的前端处理时,就不是获取用户的用户信息了,而是只需要获取用户的手机号就行。

具体操作:

step1: 进入登录页面,就调用wx.login拿到code后,立马去请求后台接口,换取一个authorToken, 本质是和openId关联的一个东西。

// 调用wx.login获取code后去后台换取auhortoken保存在本地
    wxLogin () {
          
   
      wx.login({
          
   
        success (res) {
          
   
          wxloginForCode({
          
   code: res.code, appId: AppId}).then(res => {
          
   
            let {
          
   authToken} = res.data
            wx.setStorageSync(authToken, authToken)
          }).catch(err => {
          
   
            console.log(err)
          })
        },
        fail (e) {
          
   }
      })
    },

setp2:

注意:vant-bottn 是先触发click方法后,才会触发getphonenumber这个事件的。

经验分享 程序员 微信小程序 职场和发展