用c#開發微信 (10) JS-SDK 基本用法- 分享接口「發送到朋友」

微信JS-SDK是微信公衆平臺面向網頁開發者提供的基於微信內的網頁開發工具包。經過使用微信JS-SDK,網頁開發者可藉助微信高效地使用拍照、選圖、語音、位置等手機系統的能力,同時能夠直接使用微信分享、掃一掃、卡券、支付等微信特有的能力,爲微信用戶提供更優質的網頁體驗。html

本文以介紹了分享接口裏的「發送給朋友」事件的基本用法,其它的類推。jquery

JSSDK使用步驟

1:綁定域名

先登陸微信公衆平臺進入「公衆號設置」的「功能設置」裏填寫「JS接口安全域名」。ajax

備註:登陸後可在「開發者中心」查看對應的接口權限。c#

 

2:引入JS文件

在須要調用JS接口的頁面引入以下JS文件,(支持https):http://res.wx.qq.com/open/js/jweixin-1.0.0.jsapi

本例中還用到了jquery,因此還引用了jquery的js。安全

 

3. 經過config接口注入權限驗證配置

JS方法:微信

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

這裏只寫了一個API接口onMenuShareAppMessage, 更多接口請參考官方文檔:微信JS-SDK說明文檔微信開發

debug設爲true,會自動彈出一些提示信息;這裏要注意的是,errmsg xxxx ok 是正常的,只有不是ok時才說明出錯了。app

 

有些參數是從後臺取到的,放在Page_Load裏:微信公衆平臺

string ticket = string.Empty;
timestamp = JSSDKHelper.GetTimestamp();
nonceStr = JSSDKHelper.GetNoncestr();
JSSDKHelper jssdkhelper = new JSSDKHelper();
public readonly string appID = ConfigurationManager.AppSettings["appID"];
ticket = JsApiTicketContainer.TryGetTicket(appID, appSecret);
signature = jssdkhelper.GetSignature(ticket, nonceStr, timestamp, Request.Url.AbsoluteUri.ToString());

官方提供了幾個語言的demo,但就是沒有c#版本的,沒辦法,只能本身動手。這裏的 JSSDKHelper 和 JsApiTicketContainer 都是用的Senparc.Weixin 框架。

 

這些參數都是動態生成的,不能寫死。不然這裏就會出現一堆像什麼 invalid signature 之類的錯誤。

 

4. 經過ready接口處理成功驗證

JS 方法:

wx.ready(function () {
    wx.onMenuShareAppMessage({
        title: '用c#開發微信 系列彙總',
        desc: '網上開發微信開發的教程不少,但c#相對較少。這裏列出了我全部c#開發微信的文章,方便本身隨時查閱。若是可能,我儘可能附上源碼,這樣就能夠直接發佈運行看效果,更好地理解原理。',
        link: url,
        imgUrl: 'http://demo.open.weixin.qq.com/jssdk/images/p2166127561.jpg',
        trigger: function (res) {
        },
        success: function (res) {
            friendcallback(res);
        },
        cancel: function (res) {
        },
        fail: function (res) {
            alert(JSON.stringify(res));
        }
    });
});

 

備註:不要嘗試在trigger中使用ajax異步請求修改本次分享的內容,由於客戶端分享操做是一個同步操做,這時候使用ajax的回包會尚未返回。

 

當分享成功(success)後,能夠調用回調函數 friendcallback(res):

friendcallback = function (res) {
    var shareUrl = "Share.aspx?type=friend&url=" + encodeURIComponent(url) + "&u=" + "<%= ViewState["navOpenId"] as string %>" + "&s=" + "<%= ViewState["shareOpenId"] as string %>";
 
    //AJAX請求
    $.ajax({
        type: "get",
        url: shareUrl,
        beforeSend: function () {
        },
        success: function () {
        },
        complete: function () {
        },
        error: function () {
        }
    });
};

 

這裏是用ajax把此次分享的記錄經過share頁面,保存到DB裏去。固然你能夠在這裏作你想作的事。

 

 

用c#開發微信 系列彙總

相關文章
相關標籤/搜索