经验分享
vue3中引入wxsdk,实现微信分享
安装依赖npm i weixin-js-sdk 在main.js中使用// main.js import jweixin from "weixin-js-sdk"; const URL = loca
2023-05-16 19:57:47
21

安装依赖

npm i weixin-js-sdk

在main.js中使用

// main.js
import jweixin from "weixin-js-sdk";
const URL = location.href.split("#")[0];
// 调接口拿到公众号数据,url记得需要encode
GetWxConfig(encodeURIComponent(URL)).then(res => {
  jweixin.config({
    debug: false,
    appId: res.data.appid, // 必填,公众号的唯一标识
    timestamp: String(res.data.timestamp), // 必填,生成签名的时间戳
    nonceStr: res.data.nonceStr, // 必填,生成签名的随机串
    signature: res.data.signature,// 必填,签名
    jsApiList: ["updateAppMessageShareData", "updateTimelineShareData","onMenuShareAppMessage","onMenuShareTimeline","hideMenuItems","showAllNonBaseMenuItem"] // 必填,需要使用的JS接口列表
  });
  jweixin.ready(function () {   //需在用户可能点击分享按钮前就先调用
    jweixin.updateAppMessageShareData({ 
      title: "", // 分享标题
      // desc: '', // 分享描述
      link:location.href, // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
      imgUrl:``, // 分享图标,可访问的线上图片地址
      success: function () {}
    })
  }); 
})