标签:静默 关注 弹窗 固定 dev ESS ken 相关 hat
微信用户信息
这个功能同样需要公众号认证成功才能使用,获取用户信息就是获取用户的openId和头像和名字,然后存进数据库里,openId是需要绝对保密的,获取用户的信息有两种方式对应两种代码的设计模式
每次都授权弹窗设计模式
// 当用户访问地址url,url不能是hash地址,也就是地址栏不能有【#】
// 前端js判断地址栏url有没有code参数,没有就重定向
// https://open.weixin.qq.com/connect/oauth2/authorize?appid=${appid}&redirect_uri=${url}&response_type=code&scope=snsapi_userinfo#wechat_redirect
// 注意 scope=snsapi_userinfo,还有appid要带上,其他几个值是固定的
// 微信会自动的获取一个code,并跳回redirect_uri后面的地址,并把code接到地址上
// 也就是说虽然打开的页面没变,但是地址栏上多了个code参数,并且页面刷新了两次
// 把code传给后端,后端把code拿去调用接口跟微信换去用户的access_token和openId,跟上一个笔记的access_token不是一样的
// 再拿用户access_token和openId调用接口跟微信换去用户的信息
// 再把数据和openId一起存进数据库
静默授权设计模式
// 当用户访问地址url,url不能是hash地址,也就是地址栏不能有【#】
// 前端js判断地址栏url有没有code参数,没有就重定向
// https://open.weixin.qq.com/connect/oauth2/authorize?appid=${appid}&redirect_uri=${url}&response_type=code&scope=snsapi_base#wechat_redirect
// 注意 scope=snsapi_base,还有appid要带上,其他几个值是固定的
// 微信会自动的获取一个code,并跳回redirect_uri后面的地址,并把code接到地址上
// 也就是说虽然打开的页面没变,但是地址栏上多了个code参数,并且页面刷新了两次
// 把code传给后端,后端把code拿去调用接口跟微信换去用户的openId【没有access_token】
// 因为这种方式没有access_token,所以无法获取用户信息,把openId存进数据库就行
// 我要用户信息怎么办,在需要用户信息的地方,跟后端请求数据,后端查一下数据库表示也没有,前端提示您还没有关注公众号,让用户去关注公众号
// 用户只要关注了公众号,上一个笔记有关注公众号的请求,能够拿到用户的access_token和openId,通过这两个值可以用微信的接口获取用户信息,然后存进对应openId的空数据库里就行
可以看出两种模式区别就是在于access_token的有无,以及第一个是直接授权,但是每次都要授权【用户很反感授权的】,第二是静默授权,但是需要用户关注,我建议第二种,上面的代码后续贴出来,敬请期待....
这两种都是在前后端分离情况下实现的,如果不是前后端分离,页面是有后端服务器返回的,重定向授权页面的操作就是后端做,因为地址栏出现code之后,还是会再请求一次服务器,这一次有code,就不需要前端主动把code传上来了,可以说全程由后端实现
补充
这个笔记和上个笔记的代码可以用几个插件co-wechat
,co-wechat-api
,co-wechat-oauth
代替,相关文章有
微信接通
oAuth鉴权
标签:静默 关注 弹窗 固定 dev ESS ken 相关 hat
原文地址:https://www.cnblogs.com/pengdt/p/12072517.html