c#微信開發,使用JS-SDK自定義分享功能,分享朋友圈,分享給朋友等

如果一個後端開發掌握了微信開發,甚至有微信開發上線項目,這在換工作的時候 還是有競爭力的。

微信開發的資料很多,但是用asp.net c#進行微信開發好像比較少,或者資料不夠完整。

使用JS-SDK自定義分享功能,分享朋友圈,分享給朋友,這裏基本上不涉及後端語言。

1、首先要綁定域名,當然域名得備案。

先登錄微信公衆平臺進入“公衆號設置”的“功能設置”裏填寫“JS接口安全域名”。

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

2、引入js文件

在需要調用JS接口的頁面引入如下JS文件http://res.wx.qq.com/open/js/jweixin-1.0.0.js

 

說明:如果頁面啓用了https,務必要引入https://res.wx.qq.com/open/js/jweixin-1.0.0.js ,否則將無法在iOS9.0以上系統中成功使用JSSDK

3、通過config接口注入權限驗證配置

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

wx.config({  
    debug: true, // 開啓調試模式,調用的所有api的返回值會在客戶端alert出來,若要查看傳入的參數,可以在pc端打開,參數信息會通過log打出,僅在pc端時纔會打印。  
    appId: '', // 必填,公衆號的唯一標識  
    timestamp: , // 必填,生成簽名的時間戳  
    nonceStr: '', // 必填,生成簽名的隨機串  
    signature: '',// 必填,簽名,見附錄1  
    jsApiList: [] // 必填,需要使用的JS接口列表,所有JS接口列表見附錄2  
});

4、通過ready接口處理成功驗證

wx.ready(function(){  
// config信息驗證後會執行ready方法,所有接口調用都必須在config接口獲得結果之後,config是一個客戶端的異步操作,所以如果需要在頁面加載時就調用相關接口,則須把相關接口放在ready函數中調用來確保正確執行。對於用戶觸發時才調用的接口,則可以直接調用,不需要放在ready函數中。  
});

5、通過error接口處理失敗驗證

wx.error(function(res){  
// config信息驗證失敗會執行error函數,如簽名過期導致驗證失敗,具體錯誤信息可以打開config的debug模式查看,也可以在返回的res參數中查看,對於SPA可以在這裏更新簽名。  
});

分享接口

1、獲取“分享到朋友圈”按鈕點擊狀態及自定義分享內容接口

wx.onMenuShareAppMessage({  
    title: '', // 分享標題  
    desc: '', // 分享描述  
    link: '', // 分享鏈接  
    imgUrl: '', // 分享圖標  
    type: '', // 分享類型,music、video或link,不填默認爲link  
    dataUrl: '', // 如果type是music或video,則要提供數據鏈接,默認爲空  
    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>

 

C#示例 點此下載

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章