这篇文章主要为大家展示了“微信用户访问小程序登录过程的示例分析”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“微信用户访问小程序登录过程的示例分析”这篇文章吧。
创新互联公司作为成都网站建设公司,专注重庆网站建设公司、网站设计,有关企业网站建设方案、改版、费用等问题,行业涉及成都宴会酒店设计等多个领域,已为上千家企业服务,得到了客户的尊重与认可。概述
当你开发完了一个小程序并部署上线后,某个微信用户第一次访问这个小程序的时候,会弹出一个授权界面,用户可以选择是否使用微信登录,如果选择是,则直接进入到小程序。当你第二次进入该小程序的时候,你会发现授权界面不会弹出来了,直接就进入小程序了。
微信提供小程序登录流程图
我们可以从登录流程时序 找到这张图。想完全看懂张图,需要了解很多东西。我们先来看看微信提供的几个接口。
小程序接口介绍
wx.login()
这个方法是小程序端发起的,如果是使用腾讯团队推出的小程序组件化开发框架的wepy的话,伪代码如下:
wepy.login() .then(res => { const code = res.code })
这样子就可以从微信平台获取一个code,这个code是临时登录凭证
,用于获取openid
的。
wx.request()
这个也是小程序端
发起的,用于请求开发者服务器(也即是我们的应用服务器)上的接口,调用的伪代码如下:
wepy.request({ url: `xxurl`, data: { //入参 }, }) .then(res => { //从res中获取应用服务器返回的数据 })
获取openid的接口
当某个开发主体开发了一个小程序后,当用户访问这个小程序的时候,微信平台会为这个用户分配一个openid。如下接口:
https://api.weixin.qq.com/sns/jscode2session?appid=APPID&secret=SECRET&js_code=JSCODE&grant_type=authorization_code
这个微信接口一般是我们的应用服务器发起调用的,而不是小程序端发起的。
wx.getUserInfo
getUserInfo这个接口用于在微信平台获取用户信息。注意,如果微信用户第一次访问小程序,是弹出一个授权界面的。当用户授权后,getUserInfo才能调用并返回用户数据。
这个四个接口在使用微信访问小程序的时候都会用到的。
基于token保持会话和登录认证
小程序虽然不支持cookie的机制,但是支持在header里设置token。
这个token是应用服务器生成的。
header: { 'xxxxtoken': token, }
当小程序调用应用服务器接口的时候,必须带上这个token,应用服务端则对这个token进行解析和认证。当然如果是第一次访问小程序,只能由应用服务器先生成token。
笔者打算用伪代码来表达使用token后,整个登录的过程,因为用文字或者图比较难表达。
const code = wx.login(); if (code ) {//code存在 //从小程序的本地中获取toten const token = wx.getStorageSync('xxxxxtoken') if (token ) {//小程序本地存有token,无需弹出授权界面 //直接传入code字段,调用应用服务器的验证token的方法,如果校验成功,需要返回用户信息。 const userinfo = wx.request(http://xxxxxValidateToken(code )); if (userinfo) { //说明登录成功,直接进入小程序的主界面。 } } else { //说明小程序本地没有token,这个时候需要弹出授权界面,让微信用户决定是否访问小程序,如果用户选择是的话。 const weixinuserinfo = wx.getUserInfo();//会弹出授权界面,微信提供的 if (weixinuserinfo ){ //生成或者验证token const userinfo = wx.request(http://xxxxxValidateToken(code )); const token = userinfo.getToken(); //将token存储到小程序本地 wx.setStorageSync('xxxxxtoken', token ) } } }
上面的伪代码中,会调用应用服务器(我们的应用服务器)的
http://xxxxxValidateToken(code )
方法。这个方法的实现逻辑大概如下:
1、先验证这个微信用户是否存在,可以调用微信提供的jscode2session
方法,该方法会返回一个openid。我们必须在业务代码里,将这个openid保存到数据库,并和userid关联起来。
2、判断是否是新的用户,如果是,则生成token和生成新的一个用户信息存储到数据库。如果不是新的用户,则验证token。
这个流程走完后,小程序就可以通过wx.request
方法,带上token,真正的访问应用服务器的业务方法,获取业务数据。
token的生成和校验
见过有些公司是直接将userid和openid,加密后返回给小程序。也见过用userid和password加密后返回给小程序。如果是选择第二种方式的话,验证token的逻辑大概如下:
先解密,获取userid和password,并根据userid从数据库中获取到用户密码,跟从token中解密出来的password进行比对,如果相等,则校验通过。
以上是“微信用户访问小程序登录过程的示例分析”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注创新互联成都网站设计公司行业资讯频道!
另外有需要云服务器可以了解下创新互联scvps.cn,海内外云服务器15元起步,三天无理由+7*72小时售后在线,公司持有idc许可证,提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案,具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势,专为企业上云打造定制,能够满足用户丰富、多元化的应用场景需求。
网站题目:微信用户访问小程序登录过程的示例分析-创新互联
链接URL:http://lswzjz.com/article/dgespd.html