微信公众号网页配置自定义分享内容

微信公众号网页配置自定义分享内容

1. step1 在html页面或者在sciprt中引入JSSDK文件
   <script src="http://res.wx.qq.com/open/js/jweixin-1.6.0.js" type="text/javascript" charset="utf-8"></script>或者

<script src="http://res2.wx.qq.com/open/js/jweixin-1.6.0.js" type="text/javascript" charset="utf-8"></script>

2. step2 调取接口获取config参数(找后台要）

   	$.ajax({
   		url: '获取config参数的接口地址',
   		type: "GET",
   		data: {params:{'url':'当前页面的地址'}},
   		success: function(res) {
   		 console.log(res)
   		}
   	})			
   

3.step3 在上面接口中的成功参数配置wx.config

wx.config({
    debug: false, // 是否开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
    appId: data.appId, // 必填，企业号的唯一标识
    timestamp: data.timestamp, // 必填，生成签名的时间戳
    nonceStr: data.nonceStr, // 必填，生成签名的随机串
    signature: data.signature, // 必填，签名，见附录1
    jsApiList: ['updateTimelineShareData', 'updateAppMessageShareData'] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
})

4. 配置失败的可能原因

   4.1:传给后台的地址中的&被浏览器解析成&+（+号是防止转译，原链接无+，下同）amp;了,导致后台生成签名的地址和当前地址不一致,使得签名无效,让后台使用sub_string(php适用)将&+amp;替换为&即可

   4.2:‘timestamp’,‘nonceStr’,'appId’的类型必须为字符串且大小写严格,有的版本appId写成app_id注意即可

   4.3:jsApiList中没有对应的权限----是对应的版本问题,有的方法在新版本已经废弃或者当前版本还没有该功能或权限 前往官网查看对应的版本包含的方法即可 推荐使用最新的API

   官网API地址https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html#62

5. step4 紧接wx.config后面在wx.readey配置自定义分享内容即可

   wx.ready(function() {
       //分享到朋友圈
           wx.updateTimelineShareData({
           title: '分享的标题',
           link: '分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致',
           imgUrl: '分享出去的图片',
           success: function() {
           		// 用户点击了分享后执行的回调函数
           },
           cancel: function() {
           }
       })
       //分享给朋友
       wx.updateAppMessageShareData({
           title: '分享的标题',
           desc: '分享的描述',
           link: '分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致',
           imgUrl: '分享出去的图片',
           type: '分享类型,music、video或link，不填默认为link',
           dataUrl:'如果type是music或video，则要提供数据链接，默认为空',
           success: function() {
            	// 用户点击了分享后执行的回调函数
           },
           cancel: function() {
           }
       })
   })