1.准备工作
APPID公众号id、申请好友分享接口、ip白名单、js接口安全域名设置(必须是通过备案)。要先登录微信公众平台进入“公众号设置”的功能设置里填写“JS接口域名”
2.引入js
注意:支持使用AMD/CMD标准加载方法
1 | <script src= "http://res.wx.qq.com/open/js/jweixin-1.2.0.js" ></script>
|
3.通过config接口注入权限验证配置
所有需要使用JS-SDK的页面必须先注入配置信息,否则将无法调用(同一个url仅需要调用一次,对于变化url的SPA的web app可在每次url变化时进行调用,目前Android微信客户端不支持pushShate的H5新特性,所以使用pushState来实现web app的页面会导致签名失败,此问题在Android6.2修复)
1 2 3 4 5 6 7 8 9 10 11 12 13 | wx.config({
debug: true ,
appId: & #39;', //必填,公账号的唯一标识
timestamp: & #39;', //必填,生成签名的时间戳
nonceStr: & #39;', //必填,生成签名的随机串
signature: & #39;', //必填,签名
jsApiList: [
& #39;onMenuShareTimeline', //朋友圈
& #39;onMenuShareAppMessage', //朋友
& #39;onMenuShareQQ', //QQ
& #39;onMenuShareWeibo', //QQ空间
]
})
|
4.通过ready接口处理成功验证
5.通过error接口处理失败验证
js代码
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 | var data = {
title: & #39;',
summary: & #39;',
pic: & #39;',
url: & #39;',
success: function (){
getWeixin() ;
},
cancel: function (){
}
}
wx.config({
swapTitleInWX: true ,
appId: "<?php echo $weixin_package['appid'];?>" ,
timestamp: "<?php echo $weixin_package['timestamp'];?>" ,
nonceStr: "<?php echo $weixin_package['noncestr'];?>" ,
signature: "<?php echo $weixin_package['signature'];?>" ,
jsApiList: [
& #39;onMenuShareTimeline',
& #39;onMenuShareAppMessage',
& #39;onMenuShareQQ',
& #39;onMenuShareWeibo',
]
})
wx.ready( function () {
wx.onMenuShareTimeline(data);
wx.onMenuShareAppMessage(data);
wx.onMenuShareQQ(data)
wx.onMenuShareWeibo(data)
})
|
注意点:
title,建议在14个字以内
图片尺寸: 300*300像素;图片格式:大小不超过10kB,不支持GIF格式;会取当前页面body内最前面的一张符合条件的图片
对标题简要解读,建议20字以内
link:'', //分享链接,改链接域名或路径必须与当前页面对应的公账号JS安全域名一致
二、QQ分享
QQ是通过head里面的标签来识别分享的图标和标题,涉及到h5微数据的一个属性itemprop,
1 2 3 | <meta itemprop= "name" content= "标题" />
<meta itemprop= "description" name= "description" content= "描述" />
<meta itemprop= "image" content= "缩列图地址" />
|
版权声明:本文内容由网络用户投稿,版权归原作者所有,本站不拥有其著作权,亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容,请联系我们jiasou666@gmail.com 处理,核实后本网站将在24小时内删除侵权内容。
暂时没有评论,来抢沙发吧~