微信网页授权和小程序授权

2,073 阅读2分钟

总结并记录一下关于微信授权这块

授权的目的:获取openId(用户身份标识)和获取用户的信息

网页授权

1.分类

  • 静默授权(用户无感知)

  • 用户需要手动同意授权

    一般根据业务场景来使用对应的类型

2.流程

网页授权流程分为四步:

1、引导用户进入授权页面同意授权,获取code;

2、通过code换取网页授权access_token

3、如果需要,开发者可以刷新网页授权access_token,避免过期

4、通过网页授权access_token和openid获取用户基本信息

  • 如果后台做处理的情况,在前台所需要做的为:访问后台接口返回的url(参数为授权后需要重定向的业务url);在这个过程中后台会给微信传入授权回调的地址,拿到code,换取access_token,openid

  • 如果后台没做处理的情况,在前台所需要做的为:访问后台接口返回的url(传一个微信授权后回调的地址)—>微信授权后访问传过去的回调地址并将code加在上面—>将code传到后台—>后台像微信发请求获取到access_token,openid。敲黑板注意:这一种方式会有一个大坑!使用vue网页授权时,授权后回调的地址上code会加在#/之前,如果不做处理,他会一直带着code跳转,会报错造成有些莫名其妙的问题,我们之前的问题是所有的手机图片不能选中上传,如果出现找不到错误但又涉及使用vue做了微信网页授权,可以往这个方向考虑一下

小程序授权

这里说获取用户信息的授权

小程序规定获取用户信息时必须用户同意,用户主动去授权 ,所以要使用

<button open-type="getUserInfo"></button>

用户点击授权后,e.target.userInfo里面就返回的为用户的信息

小程序用户登录

附上小程序判断用户是否登录得逻辑

export function _login(that,callback) {
  wx.login({
    success: function (res) {
      if (res.code) {
      	//自己的接口判断用户是否注册(请求使用的flyio)
        that.$fly.get('/v1/login/xxx', {
            code: res.code
          })
          .then(resp => {
            if (resp.Success) {
              let res = resp.Result
              if (res.Id < 1) {
                //取userInfo
                //未登录,未注册,存oppenid,userInfo
                wx.setStorageSync('_openid', res.OpenId)
                // 查看是否授权
                wx.getSetting({
                  success: function (res) {
                    if (res.authSetting['scope.userInfo']) {
                      // 已经授权,可以直接调用 getUserInfo 获取头像昵称
                      wx.getUserInfo({
                        success: function (res) {
                          console.log(res, '已授权获取信息');
                          wx.setStorageSync('_userInfo', res.userInfo)
                          wx.redirectTo({
                            url: '/pages/bind-tel/main'
                          })
                        }
                      })
                    } else {
                      ('未授权');
                      wx.redirectTo({
                        url: '../authorize/main'
                      })
                    }
                  }
                })
              } else {
                //已注册,登录成功,存memberid
                wx.setStorageSync('_Info', res)
                wx.setStorageSync('_memberId', res.Id)
                callback(res)
              }
            }
          })
      } else {
        ('登录失败!' + res.errMsg)
      }
    }
  })
}