微信分享链接自定义标题、描述信息和图片

在微信分享之后，默认的样子是如下：



默认样式

我们希望得到的样子是这样：



希望样式

那么如何实现，现在记录一下。
1.绑定安全域名先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”，这里的安全域名是你的要分享的H5的域名。
备注：登录后可在“开发者中心”查看对应的接口权限。
2.引入微信JS文件在需要调用JS接口的页面引入如下JS文件，（支持https）：http://res.wx.qq.com/open/js/jweixin-1.6.0.js
如需进一步提升服务稳定性，当上述资源不可访问时，可改访问：http://res2.wx.qq.com/open/js/jweixin-1.6.0.js

3.在需要被分享的地方调用wx.config方法，将配置传过去
wx.config({  debug:true,// 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。  appId:'',// 必填，公众号的唯一标识  timestamp:,// 必填，生成签名的时间戳  nonceStr:'',// 必填，生成签名的随机串  signature:'',// 必填，签名  jsApiList:[]// 必填，需要使用的JS接口列表});
其中jsApiList一般为：
const wxJsApiList = [ // 需要使用的JS接口列表    "onMenuShareTimeline", //朋友圈    "onMenuShareAppMessage", //微信朋友    "onMenuShareQQ", // QQ    "onMenuShareWeibo", //微博    "onMenuShareQZone" //QQ空间  ];

4.获取权限数据那么其他配置参数如何获取呢，接下来就是最重要的获取微信签名、随机串之类的数据了
具体方法微信也给了指南，贴链接
https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html#61

5.设置分享内容接着就可以自定义你的分享标题和描述信息、图片之类的了，首先定义一下你要自定义的分享信息：
var shareAppMessage = {    title:"分享标题",    desc: "分享描述",    link: "分享的H5链接",    imgUrl: "分享的图片链接",    success() {      console.log("分享成功")    }  }

6.接下来调用wx.ready：wx.ready(function () {      wx.checkJsApi({        jsApiList: wxJsApiList,        success(res) {          console.log("checkJsApi: " + JSON.stringify(res));        }      })      wx.onMenuShareTimeline(shareAppMessage);      wx.onMenuShareAppMessage(shareAppMessage);      wx.onMenuShareQQ(shareAppMessage);      wx.onMenuShareWeibo(shareAppMessage);      wx.onMenuShareQZone(shareAppMessage);    })

再分享你的链接试试看，就大功告成了