点击网页分享按钮,触发微信分享功能

微信公众平台开始支持前端网页,大家可能看到很多网页上都有分享到朋友圈,关注微信等按钮,点击它们都会弹出一个窗口让你分享和关注,这个是怎么实现的呢?今天就给大家讲解下如何在微信公众平台前端网页上添加分享到朋友圈,关注微信号等按钮。

我们可以发现微信内嵌浏览器定义了一个私有 JavaScript 对象:WeixinJSBridge,通过操作这个对象的相关方法可以实现分享到微信朋友圈,和判断一个微信号的关注状态以及实现关注指定微信号等功能。

分享到朋友圈

function weixinShareTimeline(title,desc,link,imgUrl){ WeixinJSBridge.invoke('shareTimeline',{ "img_url":imgUrl, //"img_width":"640", //"img_height":"640", "link":link, "desc": desc, "title":title }); }

发送给好友

function weixinSendAppMessage(title,desc,link,imgUrl){ WeixinJSBridge.invoke('sendAppMessage',{ //"appid":appId, "img_url":imgUrl, //"img_width":"640", //"img_height":"640", "link":link, "desc":desc, "title":title }); }

分享到腾讯微博

function weixinShareWeibo(title,link){ WeixinJSBridge.invoke('shareWeibo',{ "content":title + link, "url":link }); }

关注指定的微信号

function weixinAddContact(name){ WeixinJSBridge.invoke("addContact", {webtype: "1",username: name}, function(e) { WeixinJSBridge.log(e.err_msg); //e.err_msg:add_contact:added 已经添加 //e.err_msg:add_contact:cancel 取消添加 //e.err_msg:add_contact:ok 添加成功         //WeixinJSBridge.log(d.err_msg); if(e.err_msg == 'add_contact:added' || e.err_msg == 'add_contact:ok'){ //关注成功,或者已经关注过 } }) }


function WeiXinShareBtn() {
if (typeof WeixinJSBridge == "undefined") {
alert(" 请先通过微信搜索 wow36kr 添加36氪为好友,通过微信分享文章 :) ");
} else {
WeixinJSBridge.invoke(‘shareTimeline‘, {
"title": "36氪",
"link": "http://www.36kr.com",
"desc": " 关注互联网创业 ",
"img_url": "http://www.36kr.com/assets/images/apple-touch-icon.png"
});
}
}

 

<script>
var imgUrl = "图片地址";
var lineLink = "网址";
var descContent = '爱在五月,\n\n妈咪爱1+1亲子健康之旅开启全国行首站----重庆站妈咪爱活性益生菌';
var shareTitle = '标题';
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);
});
}
// 当微信内置浏览器完成内部初始化后会触发WeixinJSBridgeReady事件。
document.addEventListener('WeixinJSBridgeReady', function onBridgeReady() {
// 发送给好友
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);
</script>



转:http://www.cnblogs.com/grimm/p/5489936.html

  • 1
    点赞
  • 15
    收藏
    觉得还不错? 一键收藏
  • 9
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 9
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值