JSSDK使用步驟

綁定域名

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

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

引入js文件

在須要調用JS接口的頁面引入以下JS文件，（支持https）：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

經過config接口注入權限驗證信息

全部須要使用JS-SDK的頁面必須先注入配置信息，不然將沒法調用（同一個url僅需調用一次，對於變化url的SPA的web app可在每次url變化時進行調用,目前Android微信客戶端不支持pushState的H5新特性，因此使用pushState來實現web app的頁面會致使簽名失敗，此問題會在Android6.2中修復）。

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

appId:在微信公衆號中查看信息

timestamp:時間戳，能夠經過js獲取 Date.parse(new Date())獲取當前時間的毫秒值

nonceStr 經過uuid生成隨機字符串（永遠不會重複）

signature 簽名的獲取：

1 經過 appId和appSecret 獲取:access_token 

1. 發送請求

$.ajax({
    type: "GET",
    async:false,
    url: 'https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=APPID&secret=APPSECRET',
    success: function(data){
        config=data;
        console.log(config);
    }
})

2 經過access_token獲取signature 簽名

簽名算法

簽名生成規則以下：參與簽名的字段包括noncestr（隨機字符串）, 有效的jsapi_ticket, timestamp（時間戳）, url（當前網頁的URL，不包含#及其後面部分） 。對全部待簽名參數按照字段名的ASCII 碼從小到大排序（字典序）後，使用URL鍵值對的格式（即key1=value1&key2=value2…）拼接成字符串string1。這裏須要注意的是全部參數名均爲小寫字符。對string1做sha1加密，字段名和字段值都採用原始值，不進行URL 轉義。

即signature=sha1(string1)

demo:

• noncestr=Wm3WZYTPz0wzccnW
• jsapi_ticket=sM4AOVdWfPE4DxkXGEs8VMCPGGVi4C3VM0P37wVUCFvkVAy_90u5h9nbSlYy3-Sl-HhTdfl2fzFy1AOcHKP7qg
• timestamp=1414587457
• url=http://mp.weixin.qq.com?params=value

步驟1. 對全部待簽名參數按照字段名的ASCII 碼從小到大排序（字典序）後，使用URL鍵值對的格式（即key1=value1&key2=value2…）拼接成字符串string1：

jsapi_ticket=sM4AOVdWfPE4DxkXGEs8VMCPGGVi4C3VM0P37wVUCFvkVAy_90u5h9nbSlYy3-Sl-HhTdfl2fzFy1AOcHKP7qg&noncestr=Wm3WZYTPz0wzccnW&timestamp=1414587457&url=http://mp.weixin.qq.com?params=value

步驟2. 對string1進行sha1簽名，獲得signature：

0f9de62fce790f9a083d5c99e95740ceb90c27ed

注意事項

1. 簽名用的noncestr和timestamp必須與wx.config中的nonceStr和timestamp相同。
2. 簽名用的url必須是調用JS接口頁面的完整URL。
3. 出於安全考慮，開發者必須在服務器端實現簽名的邏輯。

配置信息獲取完以後：

經過ready接口處理成功驗證

wx.ready(function(){
    // config信息驗證後會執行ready方法，全部接口調用都必須在config接口得到結果以後，config是一個客戶端的異步操做，因此若是須要在頁面加載時就調用相關接口，
    //則須把相關接口放在ready函數中調用來確保正確執行。對於用戶觸發時才調用的接口，則能夠直接調用，不須要放在ready函數中。
});

經過error接口處理失敗驗證

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

 //轉發到朋友圈
            wx.onMenuShareTimeline({
                title: 'JSSDK朋友圈轉發測試',
                link: link,
                imgUrl: imgUrl,
                success: function () {
                    alert('轉發成功！');
                },
                cancel: function () {
                    alert('轉發失敗！');
                }
            });
           

 

 //轉發給朋友
            wx.onMenuShareAppMessage({
                title: 'JSSDK朋友圈轉發測試',
                desc: '轉發給朋友',
                link: link,
                imgUrl: imgUrl,
                type: 'link',
                dataUrl: '',
                success: function () {
                    alert('轉發成功！');
                },
                cancel: function () {
                    alert('轉發失敗！');
                }
            });

 

微信JS-SDK說明文檔------微信網頁開發