微信分享的東西目前文檔已經(jīng)很完善了。記錄下做微信分享時(shí)遇到的坑，以及流程。

文檔傳送門(mén): https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141115

配置相關(guān)的就不說(shuō)了， 文檔里很明白。

1：先登錄微信公眾平臺(tái)進(jìn)入“公眾號(hào)設(shè)置”的“功能設(shè)置”里填寫(xiě)“JS接口安全域名”。
2：在需要調(diào)用JS接口的頁(yè)面引入如下JS文件，（支持https）：

http://res.wx.qq.com/open/js/jweixin-1.4.0.js

3：前端需要獲取的是以下配置參數(shù)

wx.config({
        debug: true, 
        // 開(kāi)啟調(diào)試模式,調(diào)用的所有api的返回值會(huì)在客戶(hù)端alert出來(lái)，
        //若要查看傳入的參數(shù)，可以在pc端打開(kāi)，參數(shù)信息會(huì)通過(guò)log打出，僅在pc端時(shí)才會(huì)打印。

        appId: '', // 必填，公眾號(hào)的唯一標(biāo)識(shí)   在公眾號(hào)后臺(tái)找    也可以后端返回

        timestamp: , // 必填，生成簽名的時(shí)間戳  后端返回  示例 : 1566466330

        nonceStr: '', // 必填，生成簽名的隨機(jī)串   后端返回  示例 :  'qcmjlufmkiu6ls3pm9fl6zpw4upaphpu'  

        signature: '',// 必填，簽名   后端返回   示例 : 898c11a276d3ac322ac8fa2a1c9c4478d911bd3f

        jsApiList: [] // 必填，需要使用的JS接口列表

});

其中 重點(diǎn)說(shuō)一下 signature 此簽名是由 后端通過(guò) jsapi_ticket 、noncestr 、 timestamp 、url( 當(dāng)前頁(yè)面 location.href) 來(lái)生成的。 url需要前端傳給后端 盡量別去改變url 否則會(huì)簽名失敗；比如我之前想把微信分享后自帶的form給split掉 結(jié)果就生成簽名失敗了

前端代碼

生成簽名的示例：

jsapi_ticket=LIKLckvwlJT9cWIhEMSwfPQ6i-iF7CzG9MfFdUetFysv2QsIY631ub8-TQbXpqzs-cTloAehPWMRe2ibSsAwEA&noncestr=eb7iuq1o4j1bs4a2ex9yeqjupcw7gi5f&timestamp=1566463922&url=xxxxx

微信簽名校驗(yàn)工具
http://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=jsapisign

配置微信分享內(nèi)容 微信分享內(nèi)容可以是接口請(qǐng)求回來(lái)的 也可以寫(xiě)死。 重點(diǎn)是 在配置link的時(shí)候 可以分享非當(dāng)前頁(yè)面，但必須是在本域名下。

wx.ready(function () { 

    wx.onMenuShareAppMessage({

       title: '送你一張優(yōu)惠券，馬上領(lǐng)取',

       desc: '領(lǐng)取優(yōu)惠券，來(lái)全球歡商城領(lǐng)取即可享優(yōu)惠。僅此一張，先到先得。',

       link: location.href,    // 可以分享別的頁(yè)面 但要在同域名

       imgUrl: shareContent['share_img'],

       trigger: function (res) {},

       success: function (res) {}

    });

// 2.2 監(jiān)聽(tīng)“分享到朋友圈”按鈕點(diǎn)擊、自定義分享內(nèi)容及分享結(jié)果接口

  wx.onMenuShareTimeline({

        title: '送你一張優(yōu)惠券，馬上領(lǐng)取',

        link: location.href,  // 可以分享別的頁(yè)面 但要在同域名

        imgUrl: shareContent['share_img'],

        trigger: function (res) {},

        success: function (res) {}

  });

});

最后 附上配置微信config的報(bào)錯(cuò)碼

微信config的報(bào)錯(cuò)碼