微信分享功能、微信分享不是卡片，没有小图（缩略图）

1.关于开发分享

--- 封装为 wxShare.js  （这里考虑到可能有的伙伴想直接用，所以直接代码贴上来，复制就行）

import axios from 'axios'
/* eslint-disable */
// 分享配置

let returnAppid = null

window.hiddenShare = function (){
  const onBridgeReady = function () {
    WeixinJSBridge.call('hideOptionMenu');
  }
  if (typeof WeixinJSBridge == "undefined") {
    if (document.addEventListener) {
      document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);
    } else if (document.attachEvent) {
      document.attachEvent('WeixinJSBridgeReady', onBridgeReady);
      document.attachEvent('onWeixinJSBridgeReady', onBridgeReady);
    }
  } else {
    onBridgeReady();
  }
}
console.log('wxShare文件')
// 标题、描述、链接、图标、
window.shareConfig = function (title, desc, link, imgUrl, wxShareParam, callBack) {
 console.log(title, desc, link, imgUrl, '分享');
 const uploadImageParam = {
    参数:''
  }
  if (!returnAppid) {
    axios({
      method: 'GET',
      url: '', // 获取验签的接口
      params: {
	      pageUrl:location.href.split('#')[0] // 参数
	  },
      // 两种方式 ↓
      // method: 'POST',
      // url: '',
      // data: JSON.stringify(uploadImageParam),
      // headers: {
      //   'Content-Type': 'application/json'
      // }
    }).then(dataJson => {
      returnAppid = dataJson.data.data
      wx.config({
        debug: false,
        appId: returnAppid.app_id,
        timestamp: returnAppid.timestamp,
        nonceStr: returnAppid.nonceStr,
        signature: returnAppid.signature,
        jsApiList: ['updateTimelineShareData','updateAppMessageShareData','onMenuShareAppMessage', 'hideOptionMenu', 'showMenuItems', 'onMenuShareTimeline']
      })
      wx.ready(function () {
        wx.hideOptionMenu()
        wx.checkJsApi({
          jsApiList: ['updateTimelineShareData','updateAppMessageShareData','onMenuShareAppMessage', 'hideOptionMenu', 'showMenuItems', 'onMenuShareTimeline'],
          success: function (res) { }
        })
        wx.showMenuItems({
          menuList: ['menuItem:share:timeline', 'menuItem:share:appMessage'] // 要显示的菜单项，所有menu项见附录3
        })
        wx.onMenuShareTimeline({  // 分享到朋友圈
          title: title, // 分享标题
          desc: desc, // 分享描述
          link: link, // 分享链接
          imgUrl: imgUrl, // 分享图标
          success: function () {
            // 分享成功回调 0：好友   1：朋友圈
            if(callBack) {callBack(1)}
          },
          cancel: function () {
          }
        })
        wx.onMenuShareAppMessage({// 分享给朋友
          title: title, // 分享标题
          desc: desc, // 分享描述
          link: link, // 分享链接
          imgUrl: imgUrl, // 分享图标
          success: function () {
            // 分享成功回调 0：好友   1：朋友圈
            if(callBack) {callBack(0)}
          },
          cancel: function () {
          }
        })
        wx.updateTimelineShareData({  // 分享到朋友圈
          title: title, // 分享标题
          desc: desc, // 分享描述
          link: link, // 分享链接
          imgUrl: imgUrl, // 分享图标
          success: function () {
            // 分享成功回调 0：好友   1：朋友圈
            if(callBack) {callBack(1)}
          },
          cancel: function () {
          }
        })
        wx.updateAppMessageShareData({  // 分享到朋友
          title: title, // 分享标题
          desc: desc, // 分享描述
          link: link, // 分享链接
          imgUrl: imgUrl, // 分享图标
          success: function () {
            // 分享成功回调 0：好友   1：朋友圈
            if(callBack) {callBack(1)}
          },
          cancel: function () {
          }
        })
      })
    }).catch(error =>{
      // console.log('分享请求错误：', error)
    })
  } else {
    // console.log('已有data：',returnAppid)
    wx.config({
      debug: false,
      appId: returnAppid.appId,
      timestamp: returnAppid.timestamp,
      nonceStr: returnAppid.nonceStr,
      signature: returnAppid.signature,
      jsApiList: ['updateTimelineShareData','updateAppMessageShareData','onMenuShareAppMessage', 'hideOptionMenu', 'showMenuItems', 'onMenuShareTimeline']
    })
    wx.ready(function () {
      wx.hideOptionMenu()
      wx.checkJsApi({
        jsApiList: ['updateTimelineShareData','updateAppMessageShareData','onMenuShareAppMessage', 'hideOptionMenu', 'showMenuItems', 'onMenuShareTimeline'],
        success: function (res) { }
      })
      wx.showMenuItems({
        menuList: ['menuItem:share:timeline', 'menuItem:share:appMessage'] // 要显示的菜单项，所有menu项见附录3
      })
      wx.onMenuShareTimeline({
        title: title, // 分享标题
        desc: desc, // 分享描述
        link: link, // 分享链接
        imgUrl: imgUrl, // 分享图标
        success: function () {
          // 分享成功回调 0：好友   1：朋友圈
          if(callBack) {callBack(1)}
        },
        cancel: function () {
        }
      })
      wx.onMenuShareAppMessage({// 分享朋友
        title: title, // 分享标题
        desc: desc, // 分享描述
        link: link, // 分享链接
        imgUrl: imgUrl, // 分享图标
        success: function () {
          // 分享成功回调 0：好友   1：朋友圈
          if(callBack) {callBack(0)}
        },
        cancel: function () {
        }
      })
      wx.updateTimelineShareData({
        title: title, // 分享标题
        desc: desc, // 分享描述
        link: link, // 分享链接
        imgUrl: imgUrl, // 分享图标
        success: function () {
          // 分享成功回调 0：好友   1：朋友圈
          if(callBack) {callBack(1)}
        },
        cancel: function () {
        }
      })
      wx.updateAppMessageShareData({
        title: title, // 分享标题
        desc: desc, // 分享描述
        link: link, // 分享链接
        imgUrl: imgUrl, // 分享图标
        success: function () {
          // 分享成功回调 0：好友   1：朋友圈
          if(callBack) {callBack(1)}
        },
        cancel: function () {
        }
      })
    })
  }
}
/* eslint-disable no-new */

--- index.html 中引用微信 jsdk

--- 用  可能需要在用的地方引用一下也可能不需要，我这里两个项目，一个有引用一个没有都引用

let wxShareParam = { 参数:'' }

// 参数东西 标题、描述、链接、图标、
window.shareConfig(title, desc, url, shareImg, wxShareParam, function (tpyeNum) { console.log(tpyeNum, 'typeNum') })    

然后就是关于坑了，挺难受的问题，有比较多的坑存在我这里只写我遇到的，别的问题可以去微信开发社区里找找解决方式 

=== 下方图片百度中随便找的例子图

1.微信现在直接在聊天框点击链接进入H5页面，分享没有卡片形式只有链接 例如：

在微信收藏中去点击链接打开，然后再去转发就可以出现卡片形式 例如：

然后就会出现自定义标题 内容 图片的显示问题，首先要确认，分享链接是不是配置过安全域名，打开debug:true 会有这个报错 ，找后端配置安全域名就可以

继续 如果都可以，要确定你自定义的内容 在用的时候是不是都传值了，然后再去手机上测试就可以出现自定义的卡片了 例如：

最后也算一个坑吧，搞的时候遇到的 ==》 使用 这俩即将废弃的onMenuShareAppMessage onMenuShareTimeline debug: true的时候可能不报错 所以可以把新的 updateTimelineShareData updateAppMessageShareData 这俩加上 

就这些，后续遇到问题更新。