微信小程序授权登录

45 阅读 0 评论 30 点赞

我是靠谱客的博主知性可乐，最近开发中收集的这篇文章主要介绍微信小程序授权登录，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

今天来说一下关于微信授权登录的部分。

需要的材料

1：一个可以测试的微信小程序

2：此微信小程序的appId和appSecret

流程

微信用户对应一个小程序都有一个唯一的openid，微信授权登录，微信授权登录的核心就是获取这个openid并存在数据库作为用户存在的唯一标识。微信授权登录的流程大体分为两步

1.微信小程序前端获取code并发送到后台

在微信小程序的前端调用wx.login()获取一个code，这个code就像是我们去微信后台服务器获取用户信息的一个钥匙，微信通过获取这个code的过程给用户一个选择是否授权的选择，如果用户选择了授权就会返回一个code。这个code是一次性的，也是有时限的，代码如下。


//请求code
wx.login({
success(res) {
if (res.code) {
//把获取到的code通过一个request的请求发给java服务器
wx.request({
url:你的url地址,
data: {
code: res.code
},
method: 'POST',
dataType: 'json',
success: function (res) {
//请求成功的处理
}
}
},
fail: function () {
console.log("发送code失败：", res.data);
}
})

2.后台接收code并通过code拉取用户的openid

后台接受了code以后通过建立一个http请求去访问微信后台服务器拉取这个用户的openid，如果一切正常就会得到这个用户对应这个小程序的openid和用户个人的Access_token（和微信小程序的Access_Token不一样）。

请求的地址：

https://api.weixin.qq.com/sns/jscode2session?appid=APPID&secret=SECRET&js_code=JSCODE&grant_type=authorization_code

通过GET方式访问，其中的参数分别是：

appid：小程序的appid

secret：小程序的appsecret

js：小程序前端传来的code

grant_type：这个不用修改，表示授权的类型，固定为：authorization_code

响应：

{"session_key":"DGcpmTrV1WjcIBeuI5ZfPA==","openid":"onw6-4mJtJbVr-72SWEehKRxNKsM"}

注册的过程

这里我只用到了openid，在业务代码中将json字符串改为jsonObject，从中获取openid，如果成功获取就通过这个openid查询数据库，如果没有找到相应的记录，就说明这个用户第一次登录，我就为他创建一个新账户，并把账户的userid和这个openi做一个关联存到另外一张表中，为什么不把openid也存到账户的信息表中呢？把openid和用户信息分开保存，以后如果项目做平台移植时更方便。存完表之后把这个openid对应的账户标记为登录状态，然后把相应的用户信息和sessionid（或者token，根据你具体的实现方式）返回。

登录的过程

如果从jsonObject中得到的openid已经在数据库中有记录的话，说明此用户已经注册过了，这时就把openid对应的用户信息和sessionid返回并把这个用户标记为登录状态就ok了。

此次授权是是登录还是注册，我通过一个建立一个标识位给前端判断，前端如果通过这个标识位判断这次是注册，就继续通过wx.getUserInfo()方法拉取用户头像昵称等信息，然后通过修改用户信息的接口传到后端进行一个修改的操作。建议不要每次获取code之后就调用getUserInfo方法拉取信息然后一次性把code和用户信息传到后端，一来是用户如果进行的登录操作，微信个人信息时没有用的，增加了获取数据时间和传输时间。二是我们如果每次获取到用户信息就给他设置个人信息，这样就会覆盖用户之前的操作（比如用户之前已经修改一次头像，这时微信头像和小程序内部头像是不同的，然后用户重新登录了一下，两者的头像又一样了，这样是错误的），如果不想得到这样的结果就得再进行一次判断，增加了代码耦合度。所以登录注册应该只传code，用户的信息设置应该用另外一个接口。

微信官方文档：https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/login.html

代码文档：https://gitee.com/jfinal/jfinal-weixin/wikis/%E5%B0%8F%E7%A8%8B%E5%BA%8F%E7%99%BB%E9%99%86%E6%8E%A5%E5%8F%A3?sort_id=10047