微信分享图文链接

新建H5页面，给H5页面授权
网页授权文档

2. 使用微信JS-SDK配置给H5页面注入权限
#### 微信 JS 接口签名校验工具用来测试签名是否正确

wx.config({
  debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
  appId: 'wx5*****4cac9e', // 必填，公众号的唯一标识
  timestamp: 1648093192, // 必填，生成签名的时间戳
  nonceStr: '1648093192', // 必填，生成签名的随机串
  signature: '04bb225123************167d41bd291',// 必填，签名
  jsApiList: [
    'onMenuShareAppMessage',
    'onMenuShareTimeline',
     'updateAppMessageShareData',
     'updateTimelineShareData' ]
});

可用户授权获取openID

const currentUrl = window.location.href
 const isCallback = /^code=/.test(currentUrl.split('?')[1])
 if (!isCallback) {
 const redirect_uri = 'http://demo.ws865.com/'
 location.href=`https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx537a6791a14cac9e&redirect_uri=${redirect_uri}&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect`
 }
 const code = currentUrl.match(/code=.*&state/g)[0].replace('code=','').replace('&state','')
 console.log('========',code)

可使用微信开发者工具开发H5页面, 配置成功后可添加自定义分享代码

      wx.ready(function () {   //需在用户可能点击分享按钮前就先调用
    wx.updateAppMessageShareData({ 
      title: '这是一个PDF', // 分享标题
      desc: '3.2M', // 分享描述
      link: 'http://demo.******.com/', // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
      imgUrl: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-8dc116bd-312c-4e61-82b1-4774a3d57966/d89a47b2-3dfb-44dd-928c-052761d9c127.jpg', // 分享图标
      success: function () {
        // 设置成功
      }
    })
    wx.updateTimelineShareData({ 
      title: '这是一个PDF', // 分享标题
      desc: '3.2M', // 分享描述
      link: 'http://demo.*****.com/', // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
      imgUrl: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-8dc116bd-312c-4e61-82b1-4774a3d57966/d89a47b2-3dfb-44dd-928c-052761d9c127.jpg', // 分享图标
      success: function () {
        // 设置成功
      }
    })
  });
  wx.error(function(res){
// config信息验证失败会执行error函数，如签名过期导致验证失败，具体错误信息可以打开config的debug模式查看，也可以在返回的res参数中查看，对于SPA可以在这里更新签名。
      console.log('fail', res)
  });

将H5页面放置服务器，并在公众号配置服务器的白名单，并配置公众号JS安全域名
实现分享
在微信端输入H5链接，然后收藏，再在收藏里面分享链接，即可

常见错误

# wx.config {"errMsg": "config:invalid signature"} ?
使用js签名校验工具检测签名是否有问题，如果签名一致，则去检查公众号配置的ip白名单是否添加
页面授权域名，和jsAPI域名是否和wx.config配置的一致
参考文档