本次项目做到一个点赞功能,即分享出去一个页面给微信好友,微信好友点开并点赞,需要将点赞用户的微信昵称,微信头像以及微信openid,微信unionid(这个需要关注公众号才会有该字段)传给后端,记录点赞人的相关信息
微信网页授权
1、微信公众号网页授权配置,详见官网
2、关于网页授权的两种scope的区别说明 (详细见官网)
-scope=snsapi_base 获取微信用户openid,获取后直接跳转业务页面,不需要用户操作
-scope=snsapi_userinfo 获取微信用户详细信息(昵称,头像等),需要用户手动点击授权,当点击允许时,会跳转业务页面(类似于关闭弹窗),点击拒绝时会推出页面,授权如图:
"text-align: left">3、用户管理类接口中的“获取用户基本信息接口”,是在用户和公众号产生消息交互或关注后事件推送后,才能根据用户OpenID来获取用户基本信息。这个接口,包括其他微信接口,都是需要该用户(即openid)关注了公众号后,才能调用成功的。
4、分享页面的实际链接:
"htmlcode">
https://open.weixin.qq.com/connect/oauth2/authorize"_blank" href="https://open.weixin.qq.com" rel="external nofollow" >https://open.weixin.qq.com),新用户点击则不会进行授权,但是微信的二次分享会在当前链接加上 &from= ,可以在vue created的生命周期里进行参数获取并判断,如果有from参数,则跳转https://open.weixin.qq.com/co... 链接,让用户授权
"_blank" href="https://www.jb51.net/article/158163.htm">vue + 微信二次分享/自定义分享代码如下
// created 周期 if(this.$route.query.from) { // 判断链接中是否有from参数,下面的studentId,activityId项目需要 let _nowUrl = window.location.href.split('"htmlcode">// 处理微信用户信息 handleWechatMsg(code) { // 调取 获取微信用户信息的接口(后端参考微信官方文档进行封装) code--参数 api.getWechatInfo(code).then((res)=>{ if(res.data.code == 200) { // 返回的是json字符串 let _data = res.data.content let _personMsg = JSON.parse(_data) this.wechatMsg = _personMsg // 本地存储微信用户信息,防止页面被刷新,code失效 window.localStorage.setItem('wechatMesssage', _data) } else if (res.data.code == 400) { // 400-code失效,400是后端返回,具体看后端返回哪个码 let msgs = window.localStorage.getItem('wechatMesssage') this.wechatMsg = JSON.parse(msgs) } else { this.$Message.message(res.data.message); } }) },如果需要获取微信unionid,则需要引导用户关注公众号,可以在返回的用户信息中判断是否含有unionid,如果没有,可以展示微信公众号的二维码,供用户识别关注
⚠️--------------------
- 当前页面的域名,需要在公众号后台配置添加(详见官网)
- 如果页面存在#,可能会出问题,可以使用nginx进行配置
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
最新资源
- 陈美玲.1987-孤单的心【EMI百代】【WAV+CUE】
- 黄乙玲.2005-甲你作伴【亚律音乐】【WAV+CUE】
- 张雨生.1997-口是心非【丰华】【WAV+CUE】
- 群星《右耳·聆听私语》星文唱片[WAV+CUE]
- VitoCadonau-ramur-encasaveglia(2024)[24-44,1
- Mozart--ArthurGrumiaux(2024)[24BT]WAV
- 国风大师纯音系列《付娜广粤古筝》1CD[MP3][364
- 国风大师纯音系列《罗晶-古筝情缘》1CD[MP3][75
- 国风大师纯音系列《民乐琴王童丽-与古筝的约会》
- 刘美君.1993-被你纵坏【SONY】【WAV+CUE】