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

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

1. step1 在html页面或者在sciprt中引入JSSDK文件

或者

 

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:传给后台的地址中的&被浏览器解析成&了,导致后台生成签名的地址和当前地址不一致,使得签名无效,让后台使用sub_string(php适用)将&替换为&即可

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

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

  官网API地址(点击前往)

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() {

          }

      })

  })