有关于微信公众号网页开发的流程(自己的看法)

有关于微信公众号网页开发的流程(自己的看法)微信官方文档(真的很详细)第一步:网页授权回调域名网页服务内容这个网页回调域名是非常关键的,后面会讲解这个回调的域名的使用,回调字面意思就是会跳转的。第二步:使用微信官方的api进行code获取这个就是获取code进行页面跳转,给跳转的页面传递code参数,你可以在自己的页面进行获取,将code传给后端参考链接(请在微信客户端中打开此链接体验):scope为sns…

大家好,又见面了,我是你们的朋友全栈君。

微信官方文档
(真的很详细)

第一步: 网页授权回调域名

在这里插入图片描述
网页服务内容
在这里插入图片描述
在这里插入图片描述
这个网页回调域名是非常关键的,后面会讲解这个回调的域名的使用,回调字面意思就是会跳转的。

第二步: 使用微信官方的api进行code获取

这个就是获取code进行页面跳转,给跳转的页面传递code参数,你可以在自己的页面进行获取,将code传给后端

参考链接(请在微信客户端中打开此链接体验):
scope为snsapi_base
https://open.weixin.qq.com/connect/oauth2/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_userinfo
https://open.weixin.qq.com/connect/oauth2/authorize?appid=wxf0e81c3bee622d60&redirect_uri=http%3A%2F%2Fnba.bluewebgame.com%2Foauth_response.php&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect

在这里插入图片描述
这里是请求参数的说明,这里的就要用到上面,配置的回调域名redirect_uri,可以利用这个回调可以传递页面参数http://my.huidaoyuming.com?username=iwen&age=10,这个地方可以灵活运用的(后面分享一个需要用户信息的页面是非常重要的)。
在这里插入图片描述

第三步 通过code换取网页授权access_token,openid

  1. 这个建议在后台运行获取,考虑到信息泄露的问题,以下的参数在微信公众号后台都是有,

  2. 需要注意一个请求参数就是——grant_type=client_credential,字面意思就是客户端凭据,这个参数一般都是这个。

  3. 获取网页授权的access_token,openid。这里讲一下openid是用户的微信号唯一标识,unionid是身份唯一标识,如果有俩个微信号,unionid是相同的。

获取code后,请求以下链接获取access_token,openid:  https://api.weixin.qq.com/sns/oauth2/access_token?appid=APPID&secret=SECRET&code=CODE&grant_type=authorization_code

在这里插入图片描述
官方的解释已经非常清晰啦(请求得到的参数分析)
在这里插入图片描述

第四步 通过openid获取用户信息

接口调用请求说明
http请求方式: GET
https://api.weixin.qq.com/cgi-bin/user/info?access_token=ACCESS_TOKEN&openid=OPENID&lang=zh_CN

请求参数
在这里插入图片描述
得到数据
在这里插入图片描述

到这里基本上一个交互的微信网页开发就结束了,至于微信公众号页面分享见下面的步骤

第一步 还是绑定域名

绑定 js接口安全域名
意思就是你页面js代码在哪个服务器域名上运行的你就配置js安全域名
在这里插入图片描述
这里还需要再页面引入js文件,这样才能写微信的代码进行分享配置了

  • 到这里我当时也很懵了,然后干什么呢?
  • 这时候就是需要获取签名,获取的签名用再wx.config配置,wx.config所需要的东西最好是后台请求,和创建随机36位字符串,时间戳。
  • jsApiList——你需要分享到哪里就行入一个官方提供的JS接口列表,比如
  •  updateAppMessageShareData,分享给朋友和qq好友
    
  •  updateTimelineShareData分享到朋友圈,qq空间
    
  •   jsApiList:["updateTimelineShareData","updateAppMessageShareData"]
    
https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token="+accessToken+"&type=jsapi

在这里插入图片描述

接下来就是很简单了

wx.ready会在分享时自动调用
在这里插入图片描述

这里需要注意的就是 link 这个属性,就是分享的页面链接 可以进行传参的,分享的页面做一个判断,如果用户没用登录,就去拉起登录的那个获取code的回调接口,再通过code获取openid,openid获取用户信息,这样可以对分享出去,点击了分享链接人的信息获取
在这里插入图片描述
这就是上面说的 灵活运用

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/134865.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(1)
blank

相关推荐

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号