文章目录
- 1. 用户触发登录操作
- 2. 获取临时登录凭证
- 3. 发送登录凭证到服务器
- 4. 后端使用 code 获取 session_key 和 openid
- 5. 后端保存 session_key 和 openid 返回token
- 6. 前端保存登录态
1. 用户触发登录操作
用户在小程序内部点击登录按钮或进行需要登录权限的操作,触发登录流程。
2. 获取临时登录凭证
当用户点击登录按钮后,小程序调用 wx.login()
获取 code
。
// 小程序页面中的登录按钮点击事件处理函数
login: function() { wx.login({ success: function(res) { if (res.code) { console.log(res.code); // 获取到code} else { console.log('登录失败!' + res.errMsg); } } });
}
3. 发送登录凭证到服务器
将获取到的code
发送至开发者的后台服务器。这个步骤通常是通过HTTP请求完成的,可能还包含其他必要的参数,如小程序的AppID
等。
4. 后端使用 code 获取 session_key 和 openid
后端服务器接收到 code
后,使用自己的 appid
和 appsecret
,结合 code
,请求微信服务器换取 session_key
(本次登录的会话密钥) 和 openid
。
5. 后端保存 session_key 和 openid 返回token
后端服务器保存 session_key 和 openid,并可以生成自定义的登录态 token
给小程序
6. 前端保存登录态
前端接收到登录态 token
后,保存到本地,以便后续的请求中携带(需要携带token
进行身份验证)。
// 小程序页面中的登录按钮点击事件处理函数
login: function() { wx.login({ success: function(res) { if (res.code) { // 发送 res.code 到后台换取 openId, sessionKey, unionId wx.request({ url: 'https://xxxxxx/api/login', // 你的服务器地址 data: { code: res.code,AppID:'xxxxxxxxx' }, method: 'POST', success: function(response) { // 服务器接收 code 并请求微信接口获取 session_key 和 openid,返回登录态 token 给小程序// 登录成功,保存登录态 token 到 storage,并在后续的请求中携带这个token,以便服务器验证用户的身份。wx.setStorageSync('token', response.data.token); // 跳转到其他页面或执行其他操作 }, fail: function(error) { // 登录失败处理 console.error('Login failed:', error); } }); } else { console.log('登录失败!' + res.errMsg); } } });
}