h5 微信分享，使用updateTimelineShareData ，title和图片也不展示问题

关于微信分享，其实我写过一篇类似的文章 h5 微信分享知识点 ，而且本人对微信生态体系（公众号、小程序）经验也很丰富，以为自己不会再 踩微信的坑 。

没想到最近两年没有对接微信，又再一次被坑了，再此记录一下吸取教训。

我们简单串一下流程，方便不太懂的小伙伴理解?， 知道的小伙伴可以跳过，坑点在最下边

授权

关于授权详情，大家可以去 微信公众号 ：h5获取code，授权等问题 了解具体的配置。

//这条链接主要是通过重定向，获取到**code**，然后与后端交互，获取信息方便执行wx.config
https://open.weixin.qq.com/connect/oauth2/authorize?appid=${appid}&redirect_uri=${local}&response_type=code&scope=snsapi_base&state=STATE&connect_redirect=1#wechat_redirect

 wx.config({
      debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
      appId: config.appId, // 必填，企业号的唯一标识，此处填写企业号corpid
      timestamp: config.timestamp, // 必填，生成签名的时间戳
      nonceStr: config.nonceStr, // 必填，生成签名的随机串
      signature: config.signature,// 必填，签名，见附录1
      jsApiList: [
          
          //分享朋友圈
          'updateTimelineShareData',
          //updateAppMessageShareData
          'updateAppMessageShareData',
          // 'onMenuShareTimeline',
          // 'onMenuShareAppMessage',
          'onMenuShareQQ',
          'onMenuShareQZone',
      ]
  });

新分享方法

onMenuShareAppMessage 改为 updateAppMessageShareData
onMenuShareTimeline 改为 updateTimelineShareData

微信sdk1.6.0
微信sdk1.4.0

微信sdk1.2.0

1.2.0以前用onMenuShareAppMessage、onMenuShareTimeline

1.4.0以后用updateAppMessageShareData、updateTimelineShareData

执行wx.ready

执行分享方法

/**
* 变量注释，这几个字段不要改，是微信的规定的，值随便赋值
* title : 标题
* desc：段落描述
* link：打开的地址
* imgUrl：图片（缩略图36kb以下）
*/ 
const {title,desc,link,imgUrl} = this.info

wx.ready(function(){
   wx.updateTimelineShareData({
      title,
      desc,
      link,
      imgUrl,
      trigger: function (res) {
        // alert('用户点击分享到朋友圈');
      },
      success: function (res) {
        // alert('已分享');
      },
      cancel: function (res) {
        // alert('已取消');
      },
      fail: function (res) {
        alert(JSON.stringify(res));
      }
    });
});

分享没有预期效果（坑点）

分享效果（大家应该都知道），我就不截图了，防止侵权之类的。

本来对分享方法进行了调用，按理title、desc和图片应该是自己配置的效果，但是大家会发现只是一个 url地址 ，并没有达到预期效果

打开debug 模式，方法也都是ok，证明都执行成功了，那为啥还是不行呢 （就是在这踩的坑）

后来突然想到自己很久前好像也遇到过这个问题，只是当初很顺利就解决了，就没有留意，这次终于长教训了。

首次开发后，应将该 地址（url）先分享到公众号 （随便哪个都行），然后从此公众号的地址进入， 再分享 就可以达到预期效果了