微信小程序之登录

获取用户信息和登录是两码事!

先看一下wx.getUserInfo的用法

看下面的注意部分,如果我们只是单纯的获取用户信息(昵称,性别,国家,省份,城市,头像,语言),那直接调用wx.getUserInfo,把withCredentials设为false就ok了。记住,这只是获取用户的一些基本信息,不涉及登录(登录总得有ID吧)

所以最上面写的“获取用户信息,需要先调用 wx.login 接口。”也只是针对需要有登录态的情况来说的,如果只是获取用户信息,是不需要调用 wx.login 接口的。

代码可以这么写

wx.getUserInfo({
  withCredentials:false,
  success:function(res){
    console.log(res)
  }
})

返回一个数组

errMsg:'getUserInfo:ok',
rawData:'{"nickName":"王三思","gender":2,"language":"zh_CN","city":"Hangzhou","province":"Zhejiang","country":"China","avatarUrl":"https://wx.qlogo.cn/mmopen/vi_32/DYAIOgq83eobM3nKxnbNt7ymMMnkJyXfaiaOyu7nkUfzLo6Hib5IlCTxRXtWTwoDHjJJD9u0kZRaDpzjFv7oe2cA/0"}',
signature:undefined,
userInfo:{
    avatarUrl:"https://wx.qlogo.cn/mmopen/vi_32/DYAIOgq83eobM3nKxnbNt7ymMMnkJyXfaiaOyu7nkUfzLo6Hib5IlCTxRXtWTwoDHjJJD9u0kZRaDpzjFv7oe2cA/0",
    city:"Hangzhou",
    country:"China",
    gender:2
    language:"zh_CN"
    nickName:"王三思"
    province:"Zhejiang"
}

这个过程是会有微信的授权窗口出来的,只有用户授权之后才能够拿到那些基本信息。

但是一般实际开发中,不会像上面这样做的,因为那只是个表象,真正要做到用户登录那就要调用wx.login了。

wx.login(OBJECT):调用接口获取登录凭证(code)进而换取用户登录态信息。

看一下代码

wx.login({
  success: function (res) {
    console.log(res)
  }
});

返回数据

回调内容含有code(有效期五分钟),开发者需要将code发送到开发者服务器后台,使用code换取 session_key api,开发者服务器后台再向微信服务器发请求,将code换成openidsession_key

开发者服务器后台怎么换openidsession_key呢,看下面

我们可以看到除了code外还要带上自己小程序的appid,secret才能去微信后台换取openidsession_key,这也可以想到出于安全考虑前端不能把小程序的appid,secret暴露在代码里,所以要通过开发者服务器来获取openidsession_key

以上的解释再加上微信官方的登录时序图就可以把这个过程捋顺了

Comments
Write a Comment