Javascript实现网页微信分享例子

作者:简简单单 2016-05-21


之前在项目中接触到了微信分享的功能,就自己整理了下,具体代码如下:

由于微信分享与app不同,自带分享功能,但是自带的分享有局限性,不能显示你想要显示的标题、图标、简介,所有微信分享还要接一下接口。

var title = "{{ info.data.intro }}";
var desc = "{{ info.data.intro }}";
var appId = "{{ info.data.string.appi }}";
var timestamp = "{{ info.data.string.timestamp }}";
var signature = "{{ info.data.string.signature }}";
var id = "{{ info.data.id }}";
 
wx.config({
debug: false,
appId: appId,
timestamp: timestamp,
nonceStr: 'Wm3WZYTPz0wzccnW',
signature: signature,
jsApiList: [
'checkJsApi',
'onMenuShareTimeline',
'onMenuShareAppMessage',
'onMenuShareQQ',
'onMenuShareQZone'
]
});
 
// 触发点击事件
wx.ready(function () {
$('.sh-header-share').trigger("click");
});
 
$(".sh-header-share").on("click", shareAction);
function shareAction(){
 
var link = window.location.href;
 
var img = "{% if info.data.banner[0] is defined %}{{ info.data.banner[0] }}{% endif %}";
 
//分享到朋友圈
wx.onMenuShareTimeline({
title: title, // 分享标题
link: link, // 分享链接
imgUrl: img, // 分享图标
success: function () {
// 用户确认分享后执行的回调函数
getGold(id);
},
cancel: function () {
// 用户取消分享后执行的回调函数
alert("已取消分享");
}
});
 
//分享给朋友
wx.onMenuShareAppMessage({
title: title, // 分享标题
desc: desc, // 分享描述
link: link, // 分享链接
imgUrl: img, // 分享图标
type: '', // 分享类型,music、video或link,不填默认为link
dataUrl: '', // 如果type是music或video,则要提供数据链接,默认为空
success: function () {
// 用户确认分享后执行的回调函数
getGold(id);
},
cancel: function () {
// 用户取消分享后执行的回调函数
alert("已取消分享");
}
});
 
//分享到QQ
wx.onMenuShareQQ({
title: title, // 分享标题
desc: desc, // 分享描述
link: link, // 分享链接
imgUrl: img, // 分享图标
success: function () {
// 用户确认分享后执行的回调函数
},
cancel: function () {
// 用户取消分享后执行的回调函数
// alert("已取消分享");
}
});
 
//分享到QQ空间
wx.onMenuShareQZone({
title: title, // 分享标题
desc: desc, // 分享描述
link: link, // 分享链接
imgUrl: img, // 分享图标
success: function () {
// 用户确认分享后执行的回调函数
},
cancel: function () {
// 用户取消分享后执行的回调函数
// alert("已取消分享");
}
});
}
 

相关文章

精彩推荐