亲身实践流程:微信自定义分享 jssdk
微信官方开发者文档地址:https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141115
1.微信服务号相关操作
(1)查看AppId,AppSecret:开发->基本配置->公众号开发信息
(2)绑定域名:设置->公众号设置->功能设置->js域名
2.代码
(1)调用JSSDK [eg.TP框架],微信自己下载demo
<?php
Vendor('Aop.AopClient','','.class.php');
Vendor('Aop.jssdk','','.class.php');
$jssdk = new \JSSDK("wxec***********baf","d775************************dd7b");
$signPackage = $jssdk->GetSignPackage();
?>
(2)引入js文件,注意http or https
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
(3)调用JSSDK [eg.TP框架]
<script>
wx.config({
debug: false,
appId: '<?php echo $signPackage["appId"];?>',
timestamp:<?php echo $signPackage["timestamp"];?>,
nonceStr: '<?php echo $signPackage["nonceStr"];?>',
signature: '<?php echo $signPackage["signature"];?>',
jsApiList: [
'checkJsApi',
'onMenuShareTimeline',
'onMenuShareAppMessage',
'onMenuShareQQ',
'onMenuShareWeibo',
]
});
</script>
<script src="__PUBLIC__/Home/text/js/wechatdemo.js"> </script>//如下
(4) 分享的wechatdemo.js
wx.ready(function () {
var title = "梦想";
var keywords = "热爱生活的人";
var description = "脸上总是挂着笑意";
var href = window.location.href;
// 2. 分享接口
// 2.1 监听“分享给朋友”,按钮点击、自定义分享内容及分享结果接口
wx.onMenuShareAppMessage({
title:title,
desc:description ,
link: href,
imgUrl: "http://www.**.com/Public/Home/mengba/images/mengba37.jpg",
trigger: function (res) {
// 不要尝试在trigger中使用ajax异步请求修改本次分享的内容,因为客户端分享操作是一个同步操作,这时候使用ajax的回包会还没有返回
alert('用户点击发送给朋友');
},
success: function (res) {
alert('已分享');
},
cancel: function (res) {
alert('已取消');
},
fail: function (res) {
alert(JSON.stringify(res));
}
});
// 2.2 监听“分享到朋友圈”按钮点击、自定义分享内容及分享结果接口
wx.onMenuShareTimeline({
title:title,
desc:description ,
link: href,
imgUrl: "http://www.**.com/Public/Home/mengba/images/mengba37.jpg",
trigger: function (res) {
// 不要尝试在trigger中使用ajax异步请求修改本次分享的内容,因为客户端分享操作是一个同步操作,这时候使用ajax的回包会还没有返回
alert('用户点击分享到朋友圈');
},
success: function (res) {
alert('已分享');
},
cancel: function (res) {
alert('已取消');
},
fail: function (res) {
alert(JSON.stringify(res));
}
});
// 2.3 监听“分享到QQ”按钮点击、自定义分享内容及分享结果接口
wx.onMenuShareQQ({
title:title,
desc:description ,
link: href,
imgUrl: "http://www.**.com/Public/Home/mengba/images/mengba37.jpg",
trigger: function (res) {
alert('用户点击分享到QQ');
},
complete: function (res) {
alert(JSON.stringify(res));
},
success: function (res) {
alert('已分享');
},
cancel: function (res) {
alert('已取消');
},
fail: function (res) {
alert(JSON.stringify(res));
}
});
// 2.4 监听“分享到微博”按钮点击、自定义分享内容及分享结果接口
wx.onMenuShareWeibo({
title:title,
desc:description ,
link: href,
imgUrl: "http://www.**.com/Public/Home/mengba/images/mengba37.jpg",
trigger: function (res) {
alert('用户点击分享到微博');
},
complete: function (res) {
alert(JSON.stringify(res));
},
succr54ess: function (res) {
alert('已分享');
},
cancel: function (res) {
alert('已取消');
},
fail: function (res) {
alert(JSON.stringify(res));
}
});
});