微信公眾平臺(tái)開(kāi)始支持前端網(wǎng)頁(yè)并鸵,大家可能看到很多網(wǎng)頁(yè)上都有分享到朋友圈苇倡,關(guān)注微信等按鈕,點(diǎn)擊它們都會(huì)彈出一個(gè)窗口讓你分享和關(guān)注审姓,這個(gè)是怎么實(shí)現(xiàn)的呢珍特?
今天就給大家講解下如何在微信公眾平臺(tái)前端網(wǎng)頁(yè)上添加分享到朋友圈,關(guān)注微信號(hào)等按鈕魔吐。
通過(guò) Mac 遠(yuǎn)程調(diào)試 iPhone 上微信自己的網(wǎng)頁(yè)次坡,我們可以發(fā)現(xiàn)微信內(nèi)嵌瀏覽器定義了一個(gè)私有 JavaScript 對(duì)象:WeixinJSBridge,通過(guò)操作這個(gè)對(duì)象的相關(guān)方法可以實(shí)現(xiàn)分享到微信朋友圈画畅,和判斷一個(gè)微信號(hào)的關(guān)注狀態(tài)以及實(shí)現(xiàn)關(guān)注指定微信號(hào)等功能。
function WeiXinShareBtn() {
if (typeof WeixinJSBridge == "undefined") {
alert(" 請(qǐng)先通過(guò)微信搜索 青團(tuán)社app 關(guān)注青團(tuán)社公眾號(hào)宋距,通過(guò)微信分享文章 :) ");
} else {
WeixinJSBridge.invoke(‘shareTimeline‘, {
"title": "青團(tuán)社兼職",
"link": "https://www.qtshe.com",
"desc": " 做中國(guó)最純凈的大學(xué)生兼職平臺(tái)",
"img_url": "https://ojlf2aayk.qnssl.com/logo.jpeg"
});
}
}
或者這種
var imgUrl = "圖片地址";
var lineLink = "網(wǎng)址";
var descContent = '愛(ài)在五月轴踱,\n\n媽咪愛(ài)1+1親子健康之旅開(kāi)啟全國(guó)行首站----重慶站媽咪愛(ài)活性益生菌';
var shareTitle = '標(biāo)題';
var appid = '';
function shareFriend() {
WeixinJSBridge.invoke('sendAppMessage',{
"appid": appid,
"img_url": imgUrl,
"img_width": "200",
"img_height": "200",
"link": lineLink,
"desc": descContent,
"title": shareTitle
}, function(res) {
//_report('send_msg', res.err_msg);
})
}
function shareTimeline() {
WeixinJSBridge.invoke('shareTimeline',{
"img_url": imgUrl,
"img_width": "200",
"img_height": "200",
"link": lineLink,
"desc": descContent,
"title": shareTitle
}, function(res) {
//_report('timeline', res.err_msg);
});
}
function shareWeibo() {
WeixinJSBridge.invoke('shareWeibo',{
"content": descContent,
"url": lineLink,
}, function(res) {
//_report('weibo', res.err_msg);
});
}
// 當(dāng)微信內(nèi)置瀏覽器完成內(nèi)部初始化后會(huì)觸發(fā)WeixinJSBridgeReady事件。
document.addEventListener('WeixinJSBridgeReady', function onBridgeReady() {
// 發(fā)送給好友
WeixinJSBridge.on('menu:share:appmessage', function(argv){
shareFriend();
});
// 分享到朋友圈
WeixinJSBridge.on('menu:share:timeline', function(argv){
shareTimeline();
});
// 分享到微博
WeixinJSBridge.on('menu:share:weibo', function(argv){
shareWeibo();
});
}, false);