微信二次分享

這幾天做一個微信公眾號的需求，有個分享功能。發現分享從公眾號分享到微信是正常的，可以看到縮略圖、名稱、描述，但是直接轉發該分享或者點開該分享再次通過微信分享時，就只出現了鏈接地址，也沒有縮略圖。如下圖所示：

原因：當用戶通過分享鏈接點開頁面並分享該頁面，由於該頁面並未通過config接口注入權限驗證配置和分享信息配置（縮略圖、名稱、描述），所以會出現這種情況。

解決方案：在分享的目標頁面通過config接口注入權限驗證配置和調用微信分享接口配置分享信息（縮略圖、名稱、描述）即可。

微信JS-SDK說明文檔

 

分享功能如下：
在頁面引入js文件：

<script src="//res.wx.qq.com/open/js/jweixin-1.4.0.js" charset="utf-8" async="async"></script>

　　

function getWeChatAuthorizationAndShare(){ //也可以用立即執行函數
     $.ajax({
         url: '/api/getJsAPI',//獲取簽名的接口
         data: {url: location.href},
         type: 'post',
         success: function (json) {
             if (wx) {
                 wx.config({
	                 debug:false,
                     appId: json.appid,// 必填，公眾號的唯一標識
                     timestamp: json.timestamp,// 必填，生成簽名的時間戳
                     nonceStr: json.nonce,// 必填，生成簽名的隨機串
                     signature: json.signature,// 必填，簽名，見附錄1
                     jsApiList: [
                         'onMenuShareAppMessage', //1.0 分享到朋友
                         'onMenuShareTimeline', //1.0分享到朋友圈
                         'updateAppMessageShareData', //1.4 分享到朋友
                         'updateTimelineShareData', //1.4分享到朋友圈
                     ] // 必填，需要使用的JS接口列表，所有JS接口列表見附錄2
                 });
                 wx.ready(function () {
                     var imgUrl = $('.card-item').find('.card-img')[0].src,//縮略圖
                         link = '/card/toCardSharePage?cid=' + id + '&giveUid=' + giveUid;//分享頁面鏈接
                     var shareData = {
                         title: '某某用戶專享優惠卡券贈予',
                         desc: '好的東西我都想與你一起分享~',//這里請特別注意是要去除html
                         link: link,
                         imgUrl: imgUrl
                     };
                     if(wx.onMenuShareAppMessage){ //微信文檔中提到這兩個接口即將棄用，故判斷
                         wx.onMenuShareAppMessage(shareData);//1.0 分享到朋友
                         wx.onMenuShareTimeline(shareData);//1.0分享到朋友圈
                     }else{
                         wx.updateAppMessageShareData(shareData);//1.4 分享到朋友
                         wx.updateTimelineShareData(shareData);//1.4分享到朋友圈
                     }
                     
                 });
             }
             
         }
         
     });
 }

　　

注意：

1、原有的 wx.onMenuShareTimeline、wx.onMenuShareAppMessage、wx.onMenuShareQQ、wx.onMenuShareQZone 接口，即將廢棄。請盡快遷移使用客戶端6.7.2及JSSDK 1.4.0以上版本支持的 wx.updateAppMessageShareData、wx.updateTimelineShareData接口

2、獲取簽名的接口一定得加到公眾號的ip白名單里 要不然會出現簽名驗證錯誤（這個官方文檔沒有寫，太坑了）

3、基礎的就是 登錄微信公眾平台進入“公眾號設置”的“功能設置”里填寫“JS接口安全域名