1. 程式人生 > >微信自定義分享功能;分享朋友,分享到朋友圈

微信自定義分享功能;分享朋友,分享到朋友圈

要先在你們的微信公眾號開發平臺上  配置引入東西

經常在微信朋友圈分享一些好的文章或者讓人哭或笑的段子,就在手機右上角的三個豎點一鍵分享就ok了,那麼對於分享到朋友圈是怎麼實現的呢?對於那種活動分享送流量是怎麼定位分享者的呢?而想要將文章傳送給朋友又是怎麼獲取到的朋友列表的呢?

 
         微信JS-SDK是微信公眾平臺面向網頁開發者提供的基於微信內的網頁開發工具包。

JSSDK使用步驟

1、繫結域名

           先登入微信公眾平臺進入“公眾號設定”的“功能設定”裡填寫“JS介面安全域名”。

說明:設定此安全域名目的是為了當發現此公眾平臺發現誘導分享行為時,可以根據此域名追溯到所有分享出去的連結,以及通過這些連結增加的粉絲。

2、引入js檔案

3、通過config介面注入許可權驗證配置

            在微信公眾平臺JSSDK說明文件是這樣解釋的:

wx.config({  
    debug: true, // 開啟除錯模式,呼叫的所有api的返回值會在客戶端alert出來,若要檢視傳入的引數,可以在pc端開啟,引數資訊會通過log打出,僅在pc端時才會列印。  
    appId: '', // 必填,公眾號的唯一標識  
    timestamp: , // 必填,生成簽名的時間戳  
    nonceStr: '', // 必填,生成簽名的隨機串  
    signature: '',// 必填,簽名,見附錄1  
    jsApiList: [] // 必填,需要使用的JS介面列表,所有JS介面列表見附錄2  
})

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

wx.error(function(res){  
// config資訊驗證失敗會執行error函式,如簽名過期導致驗證失敗,具體錯誤資訊可以開啟config的debug模式檢視,也可以在返回的res引數中檢視,對於SPA可以在這裡更新簽名。  
}); 

分享介面:

1、獲取“分享到朋友圈”按鈕點選狀態及自定義分享內容介面

wx.onMenuShareTimeline({  
    title: '', // 分享標題  
    link: '', // 分享連結  
    imgUrl: '', // 分享圖示  
    success: function () {   
        // 使用者確認分享後執行的回撥函式  
    },  
    cancel: function () {   
        // 使用者取消分享後執行的回撥函式  
    }  
});

2、獲取“分享給朋友”按鈕點選狀態及自定義分享內容介面


wx.onMenuShareAppMessage({  
    title: '', // 分享標題  
    desc: '', // 分享描述  
    link: '', // 分享連結  
    imgUrl: '', // 分享圖示  
    type: '', // 分享型別,music、video或link,不填預設為link  
    dataUrl: '', // 如果type是music或video,則要提供資料鏈接,預設為空  
    success: function () {   
        // 使用者確認分享後執行的回撥函式  
    },  
    cancel: function () {   
        // 使用者取消分享後執行的回撥函式  
    }  
}); 

之前做過一個微信搖一搖的頁面,當然這個頁面需要自定義分享功能,

頁面原始碼:

<%--引入js檔案--%>  
 <script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>  
<%--通過config介面注入許可權驗證配置--%>  
     <script>  
        wx.config({  
            debug: false,  
            appId: '${shakeMap.appId}',  
            timestamp: '${shakeMap.timestamp}',  
            nonceStr: '${shakeMap.nonceStr}',  
            signature: '${shakeMap.signature}',  
            jsApiList: [  
                'checkJsApi',  
                'onMenuShareTimeline',  
                'onMenuShareAppMessage'  
            ]  
        });  
        wx.ready(function () {  
                <%--公共方法--%>  
            var shareData = {  
                title: '${title}',  
                desc: '${description}',  
                link: '${url}',  
                imgUrl: '${headImgUrl}',  
                success: function (res) {  
                    //alert('已分享');  
                },  
                cancel: function (res) {  
                }  
            };  
                <%--分享給朋友介面--%>  
            wx.onMenuShareAppMessage({  
                title: '${title}',  
                desc: '${description}',  
                link: '${url}',  
                imgUrl: '${headImgUrl}',  
                trigger: function (res) {  
                          //  alert('使用者點擊發送給朋友');  
                },  
                success: function (res) {  
                    //alert('已分享');  
                },  
                cancel: function (res) {  
                    //alert('已取消');  
                },  
                fail: function (res) {  
                    alert(JSON.stringify(res));  
                }  
            });  
                <%--分享到朋友圈介面--%>  
            wx.onMenuShareTimeline(shareData);  
        });  
          <%--處理失敗驗證--%>  
        wx.error(function (res) {  
            alert("error: " + res.errMsg);  
        });  
    </script>  

一定要在公眾號進行安全 域名的配置,這樣,微信就可以 牢牢控制你的微信平臺了,一旦發現 違規,讓分 享連結失敗,刪 除掉誘導行為增加 的粉絲,是瞬間就可以 完成的。因此,微信平臺 的開發者,一定要合理來使用 分享功能,不要因小失大。等到你的微信平臺被 封,估計哭都 來不及了。 

           客戶非要做一個紅包的活動,就是嵌在微信公眾號上的,我們瘋狂的做完了勢必要在 春節前上線,但是 測試的時候就被微信沉重的打擊到了。誰都知道春節期間微信的 紅包是如火如荼的撩了億萬群眾,為此還差點 整垮了紅包後臺,紅包二字丫的成了敏感字元,我們分 享到朋友圈,微信就秒刪 我們的東西,這個時候急壞了項 目組長和產品經理。沒 有辦法,我們不能和微信硬碰硬,所以將紅包二字改 成了個人紅包……小編也是醉 了,微信也太小 氣了些。不過微信還 是非常給力的,這麼多 的介面免費給我們 用也是慈 悲為懷了。