微信小程序开发笔记(二)微信授权

微信小程序官方示例

https://devework.com/weixin-weapp-auth-failed.html

一、小程序 用户唯一性

通过微信开发工具,新建项目,默认index页面就是获取微信授权的信息,获取的微信用户信息如下:


userinfo.png

wxml

<button wx:if="{{!hasUserInfo && canIUse}}" open-type="getUserInfo" bindgetuserinfo="getUserInfo" class='login-btn'>微信登录</button>

js

  onLoad: function () {

    if (app.globalData.isBind) {
      //如果已经绑定 直接返回上一级
     wx.navigateBack({
       
     })
    }

    if (app.globalData.userInfo) {
      this.setData({
        userInfo: app.globalData.userInfo,
        hasUserInfo: false
      })
    } else if (this.data.canIUse){
      // 由于 getUserInfo 是网络请求,可能会在 Page.onLoad 之后才返回
      // 所以此处加入 callback 以防止这种情况
      app.userInfoReadyCallback = res => {
        this.setData({
          userInfo: res.userInfo,
          hasUserInfo: false
        })
      }
    } else {
      // 在没有 open-type=getUserInfo 版本的兼容处理
      wx.getUserInfo({
        success: res => {
          app.globalData.userInfo = res.userInfo
          this.setData({
            userInfo: res.userInfo,
            hasUserInfo: false
          })
        }
      })
    }
  },

 getUserInfo: function(e) {
    console.log(e)
    if (e.detail.errMsg == "getUserInfo:ok") {
      app.globalData.userInfo = e.detail.userInfo

      console.log('userinfo e >>>',e)
      
// =======================此处是绑定用户接口=======================
      let params = {
        userId: app.globalData.userId,
        wxname: e.detail.userInfo.nickName,
        headimg: e.detail.userInfo.avatarUrl
      }
      // 绑定账户
      webRequest.postReq('/login/bindwx.do', params, function (res) {
        console.log(res)
        if(res.code == 200){
          app.globalData.isBind = true
          wx.navigateBack({

          })
//==================此处是绑定用户接口=============================
        }else{
          //绑定失败 请重新绑定
          app.globalData.isBind = false
        }

      })
    
    }else{
      wx.showToast({
        title: '请授权',
        icon:'none'
      })
    }  
  }

微信授权一般处理方式,在app.js中调用登录方法wx.login()中获取code,把获取的code发送到服务器,服务器端根据appid, secret,code 来获取openid, 每个用户的openid在小程序中都是独一无二的,根据openid来确定用户的唯一性,可以在
GET https://api.weixin.qq.com/sns/jscode2session?appid=APPID&secret=SECRET&js_code=JSCODE&grant_type=authorization_code获取openid和session_key(appid 和 secret可以在开发配置中找到, js_code是登录时获取的code,grant_type=authorization_code不用设置)

image.png

  1. 调用 wx.login() 获取 临时登录凭证code ,并回传到开发者服务器。
  2. 调用 auth.code2Session 接口,换取 用户唯一标识 OpenID会话密钥 session_key
    之后开发者服务器可以根据用户标识来生成自定义登录态,用于后续业务逻辑中前后端交互时识别用户身份

code不需要微信授权可以取到,也就是说,你不需要微信授权依然可以保证用户的唯一性。如果需要微信头像和昵称的话,需要用户授权才可以取到,一般情况下都会获取用户信息来作为用户的基本信息。

官方文档

二、小程序关联公众号 唯一性

如果你的应用不仅仅有小程序,还有公众号,希望公众号和小程序都能唯一确定这个用户,那就需要使用UnionID

官方说明:同一个微信开放平台帐号下的移动应用、网站应用和公众帐号(包括小程序),用户的 UnionID 是唯一的

使用UnionID必须是微信认证过的才可以,所以一个账号在多个微信平台使用的话(包括微信小程序和微信公众号),保证唯一性就需要使用UnionID。一定注意的是,公众号和小程序的主体认证必须是同一主体,如果公众号和小程序的主体不是同一家公司,那么即便认证了也无法获得UnionID

获取UnionID:

  1. 调用接口 wx.getUserInfo,从解密数据中获取 UnionID。注意本接口需要用户授权,请开发者妥善处理用户拒绝授权后的情况。
image.png

这种方式是通过wx.getUserInfo()的encryptedData,需要服务端去解密获取对应的数据。这样的好处是 不需要用户关注公众号就可以取到

  1. 如果开发者帐号下存在同主体的公众号,并且该用户已经关注了该公众号。开发者可以直接通过 wx.login + code2Session 获取到该用户 UnionID,无须用户再次授权。
  2. 如果开发者帐号下存在同主体的公众号或移动应用,并且该用户已经授权登录过该公众号或移动应用。开发者也可以直接通过 wx.login + code2Session 获取到该用户 UnionID ,无须用户再次授权。

这种方式通过code2Session GET https://api.weixin.qq.com/sns/jscode2session?appid=APPID&secret=SECRET&js_code=JSCODE&grant_type=authorization_code去获取,但是需要用户关注公众号后再进入小程序的时候获取,只需要用户授权一次即可,

  1. 用户在小程序(暂不支持小游戏)中支付完成后,开发者可以直接通过getPaidUnionId接口获取该用户的 UnionID,无需用户授权。注意:本接口仅在用户支付完成后的5分钟内有效,请开发者妥善处理。

好了 大概就是这个样子了,其实更多的还是自己去尝试,根据场景,自己决定是用什么就好。愿一直如年少模样,不忘初心。

微信小程序开发系列笔记:
微信小程序开发笔记(二)
微信小程序开发笔记(一)

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 216,919评论 6 502
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 92,567评论 3 392
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 163,316评论 0 353
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,294评论 1 292
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,318评论 6 390
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,245评论 1 299
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,120评论 3 418
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,964评论 0 275
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,376评论 1 313
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,592评论 2 333
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,764评论 1 348
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,460评论 5 344
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,070评论 3 327
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,697评论 0 22
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,846评论 1 269
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,819评论 2 370
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,665评论 2 354

推荐阅读更多精彩内容