微信二次分享不顯示摘要和圖片的解決方法

微信二次分享不顯示摘要和圖片的解決方法

 解決不顯示摘要和圖片的問題，需要調用微信公眾號的js-sdk的api ,需要前端和後臺的配合，

後臺需要返回 appid (公眾號的appid ) 、 timestamp (生成簽名的時間戳) 、nonceStr (簽名的隨機字元串) 、 signature (簽名* 可能出錯)；

1.綁定功能變數名稱

    先登錄微信公眾平臺進入“公眾號設置”的“功能設置”里填寫“js介面安全功能變數名稱”。（特別提示不需要加上http或者https,吃過虧）

2.首先引入js 文件 http://res.wx.qq.com/open/js/jweixin-1.2.0.js

3.然後在配置wx.config 。

<script>

   $(function(){

          wx.config({

                 debug: true, // 開啟調試模式,調用的所有api的返回值會在客戶端alert出來，若要查看傳入的參數，可以在pc端打開，參數信息會通過log打出，僅在pc端時才會列印。

                 appId: '', // 必填，公眾號的唯一標識

                 timestamp: , // 必填，生成簽名的時間戳

                nonceStr: '', // 必填，生成簽名的隨機串

                signature: '',// 必填，簽名，見附錄1

                jsApiList: [] // 必填，需要使用的JS介面列表，所有JS介面列表見附錄2

          });

   })

</script>

4.通過ready介面處理成功驗證

   wx.ready(function(){

      //詳細代碼

});

5.通過error介面處理失敗驗證

wx.error(function(res){});

詳細頁面代碼

<script src="http://www.ciotimes.com/statics/js/jquery.min.js"></script>
<script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
//js引入錯誤導致wx沒有定義。
<script>
     $(function(){
          //獲取本頁面連接，生成簽名需要
          var url = location.href.split('#')[0];

           $.ajax({
               url: "http://XXX/index.php?m=content&c=wechat_share&a=index&pc_hash=WO1sTv",
               type: "POST",
               async:true,
               data:{'url':url},
               cache: false,
               dataType: "json",
               success: function(data){
                   wx.config({
                      /* debug: true,*/  //調試模式
                       appId: data.appId,
                       timestamp:data.timestamp,
                       nonceStr:data.nonceStr,
                       signature:data.signature,
                       jsApiList: [
                           'checkJsApi',
                           'onMenuShareTimeline',
                           'hideOptionMenu',
                           'onMenuShareAppMessage'
                       ]
                   });

                   wx.ready(function(){
                       wx.checkJsApi({
                           jsApiList: [
                               'getLocation',
                               'onMenuShareTimeline',
                               'onMenuShareAppMessage'
                           ],
                           success: function (res) {
                               //alert(res.errMsg);
                           }
                       });

                       //分享給朋友
                       wx.onMenuShareAppMessage({
                           title: '111',
                           desc: '222',
                           link: 'http://XXX/index.php?m=content&c=index&a=test_show&catid=83&id=134521&from=singlemessage', // 分享鏈接，該鏈接功能變數名稱或路徑必須與當前頁面對應的公眾號JS安全功能變數名稱一致

                           imgUrl: 'http:/XXX/2017/0816/20170816061634987.jpg',
                           success: function () {
                               // 用戶確認分享後執行的回調函數
                           },
                           cancel: function () {
                               // 用戶取消分享後執行的回調函數
                           },
                           fail: function (res) {
                               //alert(res.errMsg);
                              //用戶分享失敗取消的回調函數
                           }
                        });

                   });
               },
               error: function() {
                   alert('ajax request failed!!!!');
                   return;
               }
           });
       });

</script>