vue項目的H5網站從公眾號分享到好友或朋友圈

1、安裝weixin-js-sdk

npm install -S weixin-js-sdk=

2、在頁面引入

import wx from "weixin-js-sdk";

3、調用

下面這段一般要放在向服務器請求微信參數之后，下面的params就是服務器返回的參數，前端拿到這些數據並正確調用了wx.config之后，才能調用其他wx.*的API。

wx.config({
    debug: false, // 開啟調試模式,調用的所有api的返回值會在客戶端alert出來，若要查看傳入的參數，可以在pc端打開，參數信息會通過log打出，僅在pc端時才會打印。
    appId: params.appId, // 必填，企業號的唯一標識，此處填寫企業號corpid
    timestamp: params.timestamp, // 必填，生成簽名的時間戳
    nonceStr: params.nonceStr, // 必填，生成簽名的隨機串
    signature: params.signature,// 必填，簽名
    jsApiList: [
        'checkJsApi',
        'scanQRCode',
        'chooseImage',
        'previewImage',
        'uploadImage',
        'downloadImage',
        'getLocation'
    ] // 必填，需要使用的JS接口列表
});
wx.ready(function () {
    wx.updateAppMessageShareData({
        title: '分享好友的標題',
        desc: "描述",
        link: window.location.href,
        imgUrl: '', // 縮略圖鏈接
        success: function () {
            console.log('分享成功')
        }
    })
    wx.updateTimelineShareData({
        title: '分享朋友圈的標題',
        desc: "描述",
        link: window.location.href,
        imgUrl: '', // 縮略圖鏈接
        success: function () {
            console.log('分享成功')
        }
    })
})

微信JS-SDK文檔：https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html