主机参考:VPS测评参考推荐/专注分享VPS服务器优惠信息!若您是商家可以在本站进行投稿,查看详情!此外我们还提供软文收录、PayPal代付、广告赞助等服务,查看详情! |
我们发布的部分优惠活动文章可能存在时效性,购买时建议在本站搜索商家名称可查看相关文章充分了解该商家!若非中文页面可使用Edge浏览器同步翻译!PayPal代付/收录合作 |
提供用户登录并维护用户的登录状态是具有用户系统的软件应用程序通常必须做的事情。 以微信这样的社交平台为例,在创建小程序应用时,可能很少会创建完全分离并放弃用户信息联动的纯工具软件。
让用户登录、识别和检索用户信息、提供以用户为中心的服务是大多数小程序的任务。 今天我们将学习如何使用小程序登录用户以及登录后如何维护会话状态。
微信小程序通常需要三种登录方式:
使用自己的账号注册并登录 使用其他第三方平台账号登录 使用自己的微信账号登录(即小程序用户登录必须直接使用自己的微信账号登录)有)
第一种和第二种方法是目前Web应用程序最流行的两种方法。 这些也可以用在微信小程序中,但一定要有价值。 请注意,小程序没有 cookie 机制。 因此,在使用这两种方法之前,请检查您的API或第三方API是否需要依赖cookie。 ;另外,小程序不支持HTML页面,也不支持需要使用页面重新加载的页面。 用于登录的第三方 API 可能需要更改或可能不再可用。
今天我们主要讲第三种方法,即如何使用微信账号登录。 这种方式与微信平台结合最紧密,提供了更好的用户体验。
登录流程
引用小程序官方文档的登录流程图,整个登录流程基本是这样的:
图中,“小程序”指的是使用小程序框架创建的一段代码,“第三方服务器”通常指专有的后台服务程序。 “微信服务器”是指微信官方API服务器。
让我们逐步浏览一下这个流程图。
第一步:获取客户端当前登录的微信用户的登录凭证(code)
登录小程序的第一步就是获取登录凭证。 您可以使用 wx.login() 方法检索登录凭据。
您可以使用小程序AP登录凭证的请求可以用p代码或者其他页面代码发起,主要根据小程序的实际需要。
App({ onLaunch: function() { wx.login({ success: function(res) { var code = res.code; if (code) { console.log('获取用户的登录凭据。:' + code );} Else {console.log('获取用户登录失败:'+res.errmsg);}}});}) 步骤2:将登录凭据发送到服务器和服务端Masu。 使用此凭证,您可以为微信用户的唯一标识符(openid)和会话密钥(session_key)创建微信服务器。首先,使用wx.request()方法创建您自己实现的后台并提交您的登录凭证。 (代码)。 例如,在之前的代码基础上,添加:
App({ onLaunch: function() { wx.login({ success: function(res) { var code = res.code; if ( code) { console .log('获取用户的登录凭据:' + code); // --------- 发送凭证 [ k3]- ]-[k3 ]- ------------ -。/www.my-domain.com/wx/onlogin', ]----------- ----------------[k3 ] ] } else { Console.log('获取用户登录状态失败:' + res.errMsg); }})
后台服务(/wx/onlogin),需要调用微信界面使用传递的登录凭据来交换 openid 和 session_key。 接口地址的格式为:
https://api.weixin.qq.com/sns/jscode2session?appid=APPID&secret=SECRET&js_code=JSCODE&grant_type=authorization_code
这是后台服务一的代码。 使用 Node.js Express 构建。 仅供参考:
router.get('/wx/onlogin', function (req, res, next) { let code = req.query.code request.get({ uri: 'https://api . weixin.qq.com/sns/jscode2session', json: true, qs: {grant_type: '授权码',appid: '小程序APPID', Secret: '小程序秘密', js_code: code } }, (err, response, data) => { if (response.statusCode === 200) { console.log(" [openid ]", data.openid) console.log("[session_key]", data.session_key) //TODO: 生成唯一的字符串sessionid作为key,使用openid和session_key作为值,并将它们添加到Redis中,设置超时时间到2小时 //伪代码: redisStore.set(sessionid, openid + session_key, 7200) res.json({ sessionid: sessionid }) } else { console.log("[ error]", err) res.json (err) } })})
如果此后台代码运行成功,您将获得openid和session_key。 该信息是您的微信账号当前在微信服务器上的登录状态。
但是,出于安全考虑,您不应该直接使用该信息作为小程序用户ID和会话ID发送回小程序客户端。 您需要在服务器端创建自己的层。 创建Session时,需要根据该微信账号的登录状态生成一个Session ID,并在自己的Session机制中维护,并将该Session ID分发给小程序客户端作为Session ID使用。
目前服务器端一般是如何实现这个session机制的使用Redis等键值存储工具。 为每个会话生成一个唯一的字符串作为密钥,并将session_key和openid作为值存储在Redis中。 为了安全起见,保存时必须设置超时时间。
第三步:在客户端存储Session ID
开发Web应用程序时,客户端(浏览器)通常将Session ID存储在Cookie中,但Applet没有Cookie机制; 。 虽然可以使用cookie,但是小程序有本地存储,可以用来保存会话ID以供后续后台API调用。
稍后,当调用需要登录权限的后台服务时,您可以检索存储在存储中的会话 ID 并将其包含在请求中(在标头中或作为查询字符串)(您也可以)。将它们放入列中。) 将其放入正文中并根据需要使用)并将其传递给后台服务。 后台代码获取到Session ID后,检查Redis中是否存在该Session ID,如果存在则检查。 会话有效。 后续代码继续执行,但否则执行错误处理。
这是需要会话验证的后台服务的示例。 我的会话ID是在标头中传递的,因此在本例中会话ID是从请求标头中获取的:
get('/wx/products/list', function (req, res, next) { let sessionid = req.header("sessionid") let sessionVal = redisStore.get(sessionid) if (sessionVal) { // 其他业务执行code } else { // 执行错误处理 }})
好的。这是通过微信账号登录小程序并维护状态的简单过程。 了解这些知识会让后续的开发变得更加容易。
此外,腾讯前端团队还开源了相关的封装库Wafer,供大家参考使用。
服务器 SDK:Wafer-Node-Session Applet SDK:Wafer-Client-sdk
感谢您阅读本文。 如果您有任何疑问或错误,请随时发表评论。 如果您需要建议,请留言。
推荐教程:《推荐Vue.js教程:5个最新vue.js视频教程》
下载微信小程序
微信是一款移动通讯软件,是一款发送音频消息、视频的软件、照片和文本通过互联网。 微信带来了全新的移动通信体验,您可以单独或群组聊天,还可以根据您的地理位置查找附近的人。 有需要的朋友,请快来保存您的下载体验吧!
这几篇文章你可能也喜欢:
- 微信小程序省市合作功能(微信小程序省市三级合作)
- 可以转发微信小程序给好友(微信小程序可以转发分享到朋友圈吗?)
- 如何在电脑上将微信小程序设置为全屏?(如何在电脑上将微信小程序设置为全屏)
- 小程序支付及退款流程详解(通过小程序订购的商品如何退款)
- 微信小程序深色模式
本文由主机参考刊发,转载请注明:微信小程序用户登录和保持登录(微信小程序用户登录和保持登录的区别) https://zhujicankao.com/123688.html
评论前必须登录!
注册