微信公众号开发中网页授权怎么实现简化用户绑定-创新互联

今天就跟大家聊聊有关微信公众号开发中网页授权怎么实现简化用户绑定,可能很多人都不太了解,为了让大家更加了解,小编给大家总结了以下内容,希望大家根据这篇文章可以有所收获。

创新互联主营魏都网站建设的网络公司,主营网站建设方案,手机APP定制开发,魏都h5成都小程序开发搭建,魏都网站营销推广欢迎魏都等地区企业咨询

首先我们要明确绑定微信用户和系统用户,其目的是为了用户在一次绑定以后,再次通过微信访问系统时可以由系统自动为其登录,避免用户反复登录操作,使用户操作体验更流畅。

微信绑定用户的核心逻辑其实就是把微信用户的 OpenID 和本系统的用户 UserId 建立关联关系。目前可以获得微信用户的 OpenID 的方法有 2 种:

1 从用户交互的 xml 中获取:

获取不需要授权页面,但是需要用户主动和公众号互动,常见的方式是使用公众号菜单,设置为回复消息,在用户点击菜单事件推送到服务器接口的 XML 中获取 OpenId ,然后组织一个与 OpenId 相关的链接放到回复内容里,用户点击此链接再跳转到绑定页面。

2 使用网页授权获取用户基本信息

这是利用微信提供的 OAuth3.0 接口,不需要用户额外点击菜单项和回复消息中的,可以直接从微信公众号里的移动站点任何页面发起。尤其是绑定用户时只需要知道 OpenId,不需要完善的用户信息,还可以使用微信提供的静默授权模式,这时连用户授权的页面都不用出现,获取 OpenId 的过程对用户几乎是透明的,这种流程更流畅。

本文重点介绍第 2 种方式。对应的微信官方文档在 网页授权获取用户基本信息

先看一下整体流程图。

用户已登录的判断是通过本系统自行判断的。检测出用户未登录时,程序跳转到微信 OAuth 授权页,比如

https://open.weixin.qq.com/connect/oauth3/authorize?appid=wx520c15f417810387&redirect_uri=https%3A%2F%2Fchong.qq.com%2Fphp%2Findex.php%3Fd%3D%26c%3DwxAdapter%26m%3DmobileDeal%26showwxpaytitle%3D1%26vb2ctag%3D4_2030_5_1194_60&response_type=code&scope=snsapi_base&state=123#wechat_redirect

注意我们使用的静默授权方式,scope 参数要取值 snsapi_base。redirect_uri 参数值是要跳回我系统的 URL 地址,这里要进行 URL 编码。

跳转到微信授权页时,不需要用户点击授权,所以不会停,直接跳回到本系统的 URI,并且在其后再加上 code 参数,如上例中的 

https://chong.qq.com/php/index.php?d=&c=wxAdapter&m=mobileDeal&showwxpaytitle=1&vb2ctag=4_2030_5_1194_60&code=xxxx

而这个跳回的页面,就是获取 OpenId 的程序所在。这页程序里使用跳回时得到的 code 参数值,再去调用微信服务器 access_token 接口即可得到 OpenId,即这个接口在返回 access_token 的同时也会返回 OpenId:

/tupian/20230522/access_token URL 前边是 /tupian/20230522/oauth3,和其它微信接口 https://api.weixin.qq.com/cgi-bin/ 是不同的!

到此我们已经得到了微信用户的 OpenId,此时再输出一个登录表单给用户,让用户填写用户名/密码,或者使用现在更流利的用户登录方式,填写手机号获取短信验证码,POST 提交后,即可查到用户在本系统的 UserId,我们在服务器端记录关联关系,整个绑定过程就完成了。

OpenId 作为微信用户标识字符串,出于完全考虑,原则上不能以明文方式出现在表单里以及在表单中提交上来。OpenId 防伪造防重复等等,网上已有不少研讨。我在实际开发中,发现比较简明的方式是直接使用有效期 5 分钟的 session 存储 OpenId,此 session 使用时立即失效,然后把 session 的 key 作为参数输出给用户端。

看完上述内容,你们对微信公众号开发中网页授权怎么实现简化用户绑定有进一步的了解吗?如果还想了解更多知识或者相关内容,请关注创新互联-成都网站建设公司行业资讯频道,感谢大家的支持。


分享文章:微信公众号开发中网页授权怎么实现简化用户绑定-创新互联
文章地址:http://scyanting.com/article/phpgc.html