需求背景:微信小程序里,需要判斷使用該小程序的用戶是否有關(guān)注該小程序關(guān)聯(lián)的公眾號,如未關(guān)注要引導(dǎo)用戶去關(guān)注公眾號(用于公眾號推送信息)
開發(fā)前配置
1、小程序–設(shè)置–關(guān)注公眾號
2、小程序–開發(fā)管理–開發(fā)設(shè)置–業(yè)務(wù)域名(配置業(yè)務(wù)域名,并將檢驗(yàn)文件放入到域名根目錄下)
3、公眾號管理平臺-公眾號設(shè)置–功能設(shè)置-網(wǎng)頁授權(quán)域名加上和上面小程序業(yè)務(wù)域名一樣的域名地址。
查看是否關(guān)注公眾號:
官網(wǎng):
https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/Wechat_webpage_authorization.html
(1)、用戶同意授權(quán),獲取code
接口(獲取Code):
https://open.weixin.qq.com/connect/oauth2/authorize?appid=${APPID}&redirect_uri=${REDIRECT_URI}&response_type=code&scope=SCOPE&state=STATE#wechat_redirect
參數(shù):APPID:公眾號的唯一標(biāo)識 redirect_uri:授權(quán)后重定向的回調(diào)鏈接地址, 請使用 urlEncode 對鏈接進(jìn)行處理 http://test/test.html
用戶同意授權(quán),頁面將跳轉(zhuǎn)http://test/test.html?code=CODE&state=STATE
代碼:
<view class="list-wrap">
<web-view src="https://open.weixin.qq.com/connect/oauth2/authorize?appid={{appid}}&redirect_uri={{url}}&response_type=code&scope=snsapi_userinfo&state=123#wechat_redirect"></web-view>
</view>
Page({
/**
* 頁面的初始數(shù)據(jù)
*/
data: {
url: 'http://test/test.htm',
appid:'wxfe00000000'
},
})
點(diǎn)擊同意之后會重定向到test.html 的頁面 并攜帶參數(shù) code=CODE&state=STATE。
test.html頁面代碼
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
</body>
</html>
<!-- 引入weixin-js-sdk線上版本 -->
<script charset="utf-8" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
<script type="text/javascript">
function Get() {
let appid = "wxfe00000000"; //公眾號appid
let redirect = encodeURIComponent(window.location.href); //重定向回來的地址
// let redirect =window.location.href //重定向回來的地址
let wx_code = this.getUrlParam("code"); // 截取url中的code
//判斷有沒有code
if (!wx_code) {
console.log('失敗了?')
//獲取code的地址。獲取成功重定向后地址欄中將會帶有code,判斷沒有code的話,就跳轉(zhuǎn)到微信官方鏈接上獲取,獲取成功后會再重定向回來,注意url是需要使用encodeURIComponent處理一下編碼的
window.location.href =`https://open.weixin.qq.com/connect/oauth2/authorizeappid=${appid}&redirect_uri=${redirect}&response_type=code&scope=snsapi_userinfo&state=123#wechat_redirect`;
} else {
console.log('成功了?')
// 獲取到了code
this.toWeChat(wx_code); //把code傳給后臺獲取用戶信息
}
}
//getUrlParam方法就是使用正則截取地址欄里的code
function getUrlParam(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
var r = window.location.search.substr(1).match(reg);
if (r != null) return unescape(r[2]);
return null;
}
function toWeChat(code) {
// 調(diào)整微信的/pages/index/index頁面,并攜帶Code
wx.miniProgram.navigateTo({
url: '/pages/index/index?code=' + code
})
}
Get()
</script>
(2)、獲取ACCESS_TOKEN 以及 OPENID
接口(獲取ACCESS_TOKEN):
https://api.weixin.qq.com/sns/oauth2/access_token?appid=${APPID}&secret=${SECRET}&code=${CODE}&grant_type=authorization_code
參數(shù):APPID:公眾號appID SECRET:應(yīng)用密鑰 AppSecret(不建議直接填寫,最好通過接口獲取) CODE:剛剛獲取的Code值
返回:
{
"access_token":"ACCESS_TOKEN",
"expires_in":7200,
"refresh_token":"REFRESH_TOKEN",
"openid":"OPENID",
"scope":"SCOPE",
"is_snapshotuser": 1,
"unionid": "UNIONID"
}
(3)、接口(是否關(guān)注公眾號):
https://api.weixin.qq.com/cgi-bin/user/info?access_token=${ACCESS_TOKEN}&openid=${OPENID}&lang=zh_CN
參數(shù): ACCESS_TOKEN:調(diào)用接口憑證 (上一步獲取的access_token) OPENID:普通用戶的標(biāo)識在這里插入代碼片,對當(dāng)前公眾號唯一(上一步獲取的openid)
返回:
"subscribe": 1, //用戶是否訂閱該公眾號標(biāo)識,值為0時(shí),代表此用戶沒有關(guān)注該公眾號
"openid": "o6_bmjrPTlm6_2sgVt7hMZOPfL2M", //用戶的標(biāo)識,對當(dāng)前公眾號唯一
"language": "zh_CN",
"subscribe_time": 1382694957,
"unionid": " o6_bmasdasdsad6_2sgVt7hMZOPfL",
"remark": "",
"groupid": 0,
"tagid_list":[128,2],
"subscribe_scene": "ADD_SCENE_QR_CODE",
"qr_scene": 98765,
"qr_scene_str": ""
引導(dǎo)用戶關(guān)注公眾號
小程序跳轉(zhuǎn)公眾號關(guān)注頁面的兩種方法
1、web-view方法(不能使用了)
寫好了發(fā)現(xiàn)換了手機(jī)就提示無法打開該頁面 啊啊啊啊啊誰懂啊,然后查了一下現(xiàn)在不能使用這種方法了文章來源:http://www.zghlxwxcb.cn/news/detail-611285.html
2、official-account方法(場景有限)
文章來源地址http://www.zghlxwxcb.cn/news/detail-611285.html
到了這里,關(guān)于微信小程序引導(dǎo)關(guān)注公眾號(超詳細(xì)),獲取公眾號openID,是否關(guān)注公眾號信息的文章就介紹完了。如果您還想了解更多內(nèi)容,請?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!