微信JS-SDK說明文檔

2019-03-14 12:04 更新

微信JS-SDK說明文檔

微信JS-SDK功能

概述

微信JS-SDK是微信公眾平臺面向網(wǎng)頁開發(fā)者提供的基于微信內(nèi)的網(wǎng)頁開發(fā)工具包。

通過使用微信JS-SDK,網(wǎng)頁開發(fā)者可借助微信高效地使用拍照、選圖、語音、位置等手機(jī)系統(tǒng)的能力,同時(shí)可以直接使用微信分享、掃一掃、卡券、支付等微信特有的能力,為微信用戶提供更優(yōu)質(zhì)的網(wǎng)頁體驗(yàn)。

此文檔面向網(wǎng)頁開發(fā)者介紹微信JS-SDK如何使用及相關(guān)注意事項(xiàng)。

JSSDK使用步驟

步驟一:綁定域名

先登錄微信公眾平臺進(jìn)入“公眾號設(shè)置”的“功能設(shè)置”里填寫“JS接口安全域名”。

備注:登錄后可在“開發(fā)者中心”查看對應(yīng)的接口權(quán)限。

步驟二:引入JS文件

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

如需使用搖一搖周邊功能,請引入 http://res.wx.qq.com/open/js/jweixin-1.1.0.js

備注:支持使用 AMD/CMD 標(biāo)準(zhǔn)模塊加載方法加載

步驟三:通過config接口注入權(quán)限驗(yàn)證配置

所有需要使用JS-SDK的頁面必須先注入配置信息,否則將無法調(diào)用(同一個(gè)url僅需調(diào)用一次,對于變化url的SPA的web app可在每次url變化時(shí)進(jìn)行調(diào)用,目前Android微信客戶端不支持pushState的H5新特性,所以使用pushState來實(shí)現(xiàn)web app的頁面會(huì)導(dǎo)致簽名失敗,此問題會(huì)在Android6.2中修復(fù))。

wx.config({

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

    appId: '', // 必填,公眾號的唯一標(biāo)識

    timestamp: , // 必填,生成簽名的時(shí)間戳

    nonceStr: '', // 必填,生成簽名的隨機(jī)串

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

    jsApiList: [] // 必填,需要使用的JS接口列表,所有JS接口列表見附錄2

});

步驟四:通過ready接口處理成功驗(yàn)證

wx.ready(function(){

    // config信息驗(yàn)證后會(huì)執(zhí)行ready方法,所有接口調(diào)用都必須在config接口獲得結(jié)果之后,config是一個(gè)客戶端的異步操作,所以如果需要在頁面加載時(shí)就調(diào)用相關(guān)接口,則須把相關(guān)接口放在ready函數(shù)中調(diào)用來確保正確執(zhí)行。對于用戶觸發(fā)時(shí)才調(diào)用的接口,則可以直接調(diào)用,不需要放在ready函數(shù)中。

});

步驟五:通過error接口處理失敗驗(yàn)證

wx.error(function(res){

    // config信息驗(yàn)證失敗會(huì)執(zhí)行error函數(shù),如簽名過期導(dǎo)致驗(yàn)證失敗,具體錯(cuò)誤信息可以打開config的debug模式查看,也可以在返回的res參數(shù)中查看,對于SPA可以在這里更新簽名。

});

接口調(diào)用說明

所有接口通過wx對象(也可使用jWeixin對象)來調(diào)用,參數(shù)是一個(gè)對象,除了每個(gè)接口本身需要傳的參數(shù)之外,還有以下通用參數(shù):

1.success:接口調(diào)用成功時(shí)執(zhí)行的回調(diào)函數(shù)。

2.fail:接口調(diào)用失敗時(shí)執(zhí)行的回調(diào)函數(shù)。

3.complete:接口調(diào)用完成時(shí)執(zhí)行的回調(diào)函數(shù),無論成功或失敗都會(huì)執(zhí)行。

4.cancel:用戶點(diǎn)擊取消時(shí)的回調(diào)函數(shù),僅部分有用戶取消操作的api才會(huì)用到。

5.trigger: 監(jiān)聽Menu中的按鈕點(diǎn)擊時(shí)觸發(fā)的方法,該方法僅支持Menu中的相關(guān)接口。

備注:不要嘗試在trigger中使用ajax異步請求修改本次分享的內(nèi)容,因?yàn)榭蛻舳朔窒聿僮魇且粋€(gè)同步操作,這時(shí)候使用ajax的回包會(huì)還沒有返回。

以上幾個(gè)函數(shù)都帶有一個(gè)參數(shù),類型為對象,其中除了每個(gè)接口本身返回的數(shù)據(jù)之外,還有一個(gè)通用屬性errMsg,其值格式如下:

調(diào)用成功時(shí):"xxx:ok" ,其中xxx為調(diào)用的接口名

用戶取消時(shí):"xxx:cancel",其中xxx為調(diào)用的接口名

調(diào)用失敗時(shí):其值為具體錯(cuò)誤信息

基礎(chǔ)接口

判斷當(dāng)前客戶端版本是否支持指定JS接口

wx.checkJsApi({

    jsApiList: ['chooseImage'], // 需要檢測的JS接口列表,所有JS接口列表見附錄2,

    success: function(res) {

        // 以鍵值對的形式返回,可用的api值true,不可用為false

        // 如:{"checkResult":{"chooseImage":true},"errMsg":"checkJsApi:ok"}

    }

});

備注:checkJsApi接口是客戶端6.0.2新引入的一個(gè)預(yù)留接口,第一期開放的接口均可不使用checkJsApi來檢測。

分享接口

請注意不要有誘導(dǎo)分享等違規(guī)行為,對于誘導(dǎo)分享行為將永久回收公眾號接口權(quán)限,詳細(xì)規(guī)則請查看:朋友圈管理常見問題 。

獲取“分享到朋友圈”按鈕點(diǎn)擊狀態(tài)及自定義分享內(nèi)容接口

wx.onMenuShareTimeline({

    title: '', // 分享標(biāo)題

    link: '', // 分享鏈接

    imgUrl: '', // 分享圖標(biāo)

    success: function () { 

        // 用戶確認(rèn)分享后執(zhí)行的回調(diào)函數(shù)

    },

    cancel: function () { 

        // 用戶取消分享后執(zhí)行的回調(diào)函數(shù)

    }

});

獲取“分享給朋友”按鈕點(diǎn)擊狀態(tài)及自定義分享內(nèi)容接口

wx.onMenuShareAppMessage({

    title: '', // 分享標(biāo)題

    desc: '', // 分享描述

    link: '', // 分享鏈接

    imgUrl: '', // 分享圖標(biāo)

    type: '', // 分享類型,music、video或link,不填默認(rèn)為link

    dataUrl: '', // 如果type是music或video,則要提供數(shù)據(jù)鏈接,默認(rèn)為空

    success: function () { 

        // 用戶確認(rèn)分享后執(zhí)行的回調(diào)函數(shù)

    },

    cancel: function () { 

        // 用戶取消分享后執(zhí)行的回調(diào)函數(shù)

    }

});

獲取“分享到QQ”按鈕點(diǎn)擊狀態(tài)及自定義分享內(nèi)容接口

wx.onMenuShareQQ({

    title: '', // 分享標(biāo)題

    desc: '', // 分享描述

    link: '', // 分享鏈接

    imgUrl: '', // 分享圖標(biāo)

    success: function () { 

       // 用戶確認(rèn)分享后執(zhí)行的回調(diào)函數(shù)

    },

    cancel: function () { 

       // 用戶取消分享后執(zhí)行的回調(diào)函數(shù)

    }

});

獲取“分享到騰訊微博”按鈕點(diǎn)擊狀態(tài)及自定義分享內(nèi)容接口

wx.onMenuShareWeibo({

    title: '', // 分享標(biāo)題

    desc: '', // 分享描述

    link: '', // 分享鏈接

    imgUrl: '', // 分享圖標(biāo)

    success: function () { 

       // 用戶確認(rèn)分享后執(zhí)行的回調(diào)函數(shù)

    },

    cancel: function () { 

        // 用戶取消分享后執(zhí)行的回調(diào)函數(shù)

    }

});

獲取“分享到QQ空間”按鈕點(diǎn)擊狀態(tài)及自定義分享內(nèi)容接口

wx.onMenuShareQZone({

    title: '', // 分享標(biāo)題

    desc: '', // 分享描述

    link: '', // 分享鏈接

    imgUrl: '', // 分享圖標(biāo)

    success: function () { 

       // 用戶確認(rèn)分享后執(zhí)行的回調(diào)函數(shù)

    },

    cancel: function () { 

        // 用戶取消分享后執(zhí)行的回調(diào)函數(shù)

    }

});

圖像接口

拍照或從手機(jī)相冊中選圖接口

wx.chooseImage({

    count: 1, // 默認(rèn)9

    sizeType: ['original', 'compressed'], // 可以指定是原圖還是壓縮圖,默認(rèn)二者都有

    sourceType: ['album', 'camera'], // 可以指定來源是相冊還是相機(jī),默認(rèn)二者都有

    success: function (res) {

        var localIds = res.localIds; // 返回選定照片的本地ID列表,localId可以作為img標(biāo)簽的src屬性顯示圖片

    }

});

預(yù)覽圖片接口

wx.previewImage({

    current: '', // 當(dāng)前顯示圖片的http鏈接

    urls: [] // 需要預(yù)覽的圖片http鏈接列表

});

上傳圖片接口

wx.uploadImage({

    localId: '', // 需要上傳的圖片的本地ID,由chooseImage接口獲得

    isShowProgressTips: 1, // 默認(rèn)為1,顯示進(jìn)度提示

    success: function (res) {

        var serverId = res.serverId; // 返回圖片的服務(wù)器端ID

    }

});

備注:上傳圖片有效期3天,可用微信多媒體接口下載圖片到自己的服務(wù)器,此處獲得的 serverId 即 media_id。

下載圖片接口

wx.downloadImage({

    serverId: '', // 需要下載的圖片的服務(wù)器端ID,由uploadImage接口獲得

    isShowProgressTips: 1, // 默認(rèn)為1,顯示進(jìn)度提示

    success: function (res) {

        var localId = res.localId; // 返回圖片下載后的本地ID

    }

});

音頻接口

開始錄音接口

wx.startRecord();

停止錄音接口

wx.stopRecord({

    success: function (res) {

        var localId = res.localId;

    }

});

監(jiān)聽錄音自動(dòng)停止接口

wx.onVoiceRecordEnd({

    // 錄音時(shí)間超過一分鐘沒有停止的時(shí)候會(huì)執(zhí)行 complete 回調(diào)

    complete: function (res) {

        var localId = res.localId; 

    }

});

播放語音接口

wx.playVoice({

    localId: '' // 需要播放的音頻的本地ID,由stopRecord接口獲得

});

暫停播放接口

wx.pauseVoice({

    localId: '' // 需要暫停的音頻的本地ID,由stopRecord接口獲得

});

停止播放接口

wx.stopVoice({

    localId: '' // 需要停止的音頻的本地ID,由stopRecord接口獲得

});

監(jiān)聽語音播放完畢接口

wx.onVoicePlayEnd({

    success: function (res) {

        var localId = res.localId; // 返回音頻的本地ID

    }

});

上傳語音接口

wx.uploadVoice({

    localId: '', // 需要上傳的音頻的本地ID,由stopRecord接口獲得

    isShowProgressTips: 1, // 默認(rèn)為1,顯示進(jìn)度提示

        success: function (res) {

        var serverId = res.serverId; // 返回音頻的服務(wù)器端ID

    }

});

備注:上傳語音有效期3天,可用微信多媒體接口下載語音到自己的服務(wù)器,此處獲得的 serverId 即 media_id,參考文檔 .目前多媒體文件下載接口的頻率限制為10000次/天,如需要調(diào)高頻率,請登錄微信公眾平臺,在開發(fā) - 接口權(quán)限的列表中,申請?zhí)岣吲R時(shí)上限。

下載語音接口

wx.downloadVoice({

    serverId: '', // 需要下載的音頻的服務(wù)器端ID,由uploadVoice接口獲得

    isShowProgressTips: 1, // 默認(rèn)為1,顯示進(jìn)度提示

    success: function (res) {

        var localId = res.localId; // 返回音頻的本地ID

    }

});

智能接口

識別音頻并返回識別結(jié)果接口

wx.translateVoice({

   localId: '', // 需要識別的音頻的本地Id,由錄音相關(guān)接口獲得

    isShowProgressTips: 1, // 默認(rèn)為1,顯示進(jìn)度提示

    success: function (res) {

        alert(res.translateResult); // 語音識別的結(jié)果

    }

});

設(shè)備信息

獲取網(wǎng)絡(luò)狀態(tài)接口

wx.getNetworkType({

    success: function (res) {

        var networkType = res.networkType; // 返回網(wǎng)絡(luò)類型2g,3g,4g,wifi

    }

});

地理位置

使用微信內(nèi)置地圖查看位置接口

wx.openLocation({

    latitude: 0, // 緯度,浮點(diǎn)數(shù),范圍為90 ~ -90

    longitude: 0, // 經(jīng)度,浮點(diǎn)數(shù),范圍為180 ~ -180。

    name: '', // 位置名

    address: '', // 地址詳情說明

    scale: 1, // 地圖縮放級別,整形值,范圍從1~28。默認(rèn)為最大

    infoUrl: '' // 在查看位置界面底部顯示的超鏈接,可點(diǎn)擊跳轉(zhuǎn)

});

獲取地理位置接口

wx.getLocation({

    type: 'wgs84', // 默認(rèn)為wgs84的gps坐標(biāo),如果要返回直接給openLocation用的火星坐標(biāo),可傳入'gcj02'

    success: function (res) {

        var latitude = res.latitude; // 緯度,浮點(diǎn)數(shù),范圍為90 ~ -90

        var longitude = res.longitude; // 經(jīng)度,浮點(diǎn)數(shù),范圍為180 ~ -180。

        var speed = res.speed; // 速度,以米/每秒計(jì)

        var accuracy = res.accuracy; // 位置精度

    }

});

搖一搖周邊

開啟查找周邊ibeacon設(shè)備接口

wx.startSearchBeacons({

ticket:"",  //搖周邊的業(yè)務(wù)ticket, 系統(tǒng)自動(dòng)添加在搖出來的頁面鏈接后面

complete:function(argv){

//開啟查找完成后的回調(diào)函數(shù)

}

});

備注:如需接入搖一搖周邊功能,請參考:申請開通搖一搖周邊

關(guān)閉查找周邊ibeacon設(shè)備接口

wx.stopSearchBeacons({

complete:function(res){

//關(guān)閉查找完成后的回調(diào)函數(shù)

}

});

監(jiān)聽周邊ibeacon設(shè)備接口

wx.onSearchBeacons({

complete:function(argv){

//回調(diào)函數(shù),可以數(shù)組形式取得該商家注冊的在周邊的相關(guān)設(shè)備列表

}

});

備注:上述搖一搖周邊接口使用注意事項(xiàng)及更多返回結(jié)果說明,請參考:搖一搖周邊獲取設(shè)備信息

界面操作

隱藏右上角菜單接口

wx.hideOptionMenu();

顯示右上角菜單接口

wx.showOptionMenu();

關(guān)閉當(dāng)前網(wǎng)頁窗口接口

wx.closeWindow();

批量隱藏功能按鈕接口

wx.hideMenuItems({

    menuList: [] // 要隱藏的菜單項(xiàng),只能隱藏“傳播類”和“保護(hù)類”按鈕,所有menu項(xiàng)見附錄3

});

批量顯示功能按鈕接口

wx.showMenuItems({

    menuList: [] // 要顯示的菜單項(xiàng),所有menu項(xiàng)見附錄3

});

隱藏所有非基礎(chǔ)按鈕接口

wx.hideAllNonBaseMenuItem();

// “基本類”按鈕詳見附錄3

顯示所有功能按鈕接口

wx.showAllNonBaseMenuItem();

微信掃一掃

調(diào)起微信掃一掃接口

wx.scanQRCode({

    needResult: 0, // 默認(rèn)為0,掃描結(jié)果由微信處理,1則直接返回掃描結(jié)果,

    scanType: ["qrCode","barCode"], // 可以指定掃二維碼還是一維碼,默認(rèn)二者都有

    success: function (res) {

    var result = res.resultStr; // 當(dāng)needResult 為 1 時(shí),掃碼返回的結(jié)果

}

});

微信小店

跳轉(zhuǎn)微信商品頁接口

wx.openProductSpecificView({

    productId: '', // 商品id

    viewType: '' // 0.默認(rèn)值,普通商品詳情頁1.掃一掃商品詳情頁2.小店商品詳情頁

});

微信卡券

微信卡券接口中使用的簽名憑證api_ticket,與步驟三中config使用的簽名憑證jsapi_ticket不同,開發(fā)者在調(diào)用微信卡券JS-SDK的過程中需依次完成兩次不同的簽名,并確保憑證的緩存。

獲取api_ticket

api_ticket 是用于調(diào)用微信卡券JS API的臨時(shí)票據(jù),有效期為7200 秒,通過access_token 來獲取。

開發(fā)者注意事項(xiàng):

1.此用于卡券接口簽名的api_ticket與步驟三中通過config接口注入權(quán)限驗(yàn)證配置使用的jsapi_ticket不同

2.由于獲取api_ticket 的api 調(diào)用次數(shù)非常有限,頻繁刷新api_ticket 會(huì)導(dǎo)致api調(diào)用受限,影響自身業(yè)務(wù),開發(fā)者需在自己的服務(wù)存儲與更新api_ticket。

接口調(diào)用請求說明

http請求方式: GET

https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=ACCESS_TOKEN&type=wx_card

參數(shù)說明

參數(shù)
是否必須說明
access_token接口調(diào)用憑證

返回?cái)?shù)據(jù)

數(shù)據(jù)示例:

 {

"errcode":0,

"errmsg":"ok",

"ticket":"bxLdikRXVbTPdHSM05e5u5sUoXNKdvsdshFKA",

"expires_in":7200

}

參數(shù)名描述
errcode錯(cuò)誤碼
errmsg錯(cuò)誤信息
ticketapi_ticket,卡券接口中簽名所需憑證
expires_in 有效時(shí)間

拉取適用卡券列表并獲取用戶選擇信息

wx.chooseCard({

    shopId: '', // 門店Id

    cardType: '', // 卡券類型

    cardId: '', // 卡券Id

    timestamp: 0, // 卡券簽名時(shí)間戳

    nonceStr: '', // 卡券簽名隨機(jī)串

    signType: '', // 簽名方式,默認(rèn)'SHA1'

    cardSign: '', // 卡券簽名

    success: function (res) {

        var cardList= res.cardList; // 用戶選中的卡券列表信息

    }

});

參數(shù)名必填 類型 示例值描述
shopIdstring(24)1234 門店ID。shopID用于篩選出拉起帶有指定location_list(shopID)的卡券列表,非必填。
cardTypestring(24)GROUPON卡券類型,用于拉起指定卡券類型的卡券列表。當(dāng)cardType為空時(shí),默認(rèn)拉起所有卡券的列表,非必填。
cardIdstring(32) p1Pj9jr90_SQRaVqYI239Ka1erk卡券ID,用于拉起指定cardId的卡券列表,當(dāng)cardId為空時(shí),默認(rèn)拉起所有卡券的列表,非必填。
timestampstring(32)14300000000時(shí)間戳。
nonceStrstring(32)sduhi123隨機(jī)字符串。
signTypestring(32)SHA1簽名方式,目前僅支持SHA1
cardSignstring(64)abcsdijcous123簽名。

開發(fā)者特別注意:簽名錯(cuò)誤會(huì)導(dǎo)致拉取卡券列表異常為空,請仔細(xì)檢查參與簽名的參數(shù)有效性。

特別提醒

拉取列表僅與用戶本地卡券有關(guān),拉起列表異常為空的情況通常有三種:簽名錯(cuò)誤、時(shí)間戳無效、篩選機(jī)制有誤。請開發(fā)者依次排查定位原因。

批量添加卡券接口

wx.addCard({

    cardList: [{

        cardId: '',

        cardExt: ''

    }], // 需要添加的卡券列表

    success: function (res) {

        var cardList = res.cardList; // 添加的卡券列表信息

    }

});

值得注意的是,這里的card_ext參數(shù)必須與參與簽名的參數(shù)一致,格式為字符串而不是Object,否則會(huì)報(bào)簽名錯(cuò)誤。

建議開發(fā)者一次添加的卡券不超過5張,否則會(huì)遇到超時(shí)報(bào)錯(cuò)。

查看微信卡包中的卡券接口

wx.openCard({

    cardList: [{

        cardId: '',

        code: ''

    }]// 需要打開的卡券列表

});

微信支付

發(fā)起一個(gè)微信支付請求

wx.chooseWXPay({

    timestamp: 0, // 支付簽名時(shí)間戳,注意微信jssdk中的所有使用timestamp字段均為小寫。但最新版的支付后臺生成簽名使用的timeStamp字段名需大寫其中的S字符

    nonceStr: '', // 支付簽名隨機(jī)串,不長于 32 位

    package: '', // 統(tǒng)一支付接口返回的prepay_id參數(shù)值,提交格式如:prepay_id=***)

    signType: '', // 簽名方式,默認(rèn)為'SHA1',使用新版支付需傳入'MD5'

    paySign: '', // 支付簽名

    success: function (res) {

        // 支付成功后的回調(diào)函數(shù)

    }

});

備注:prepay_id 通過微信支付統(tǒng)一下單接口拿到,paySign 采用統(tǒng)一的微信支付 Sign 簽名生成方法,注意這里 appId 也要參與簽名,appId 與 config 中傳入的 appId 一致,即最后參與簽名的參數(shù)有appId, timeStamp, nonceStr, package, signType。

微信支付開發(fā)文檔:https://pay.weixin.qq.com/wiki/doc/api/index.html

附錄1-JS-SDK使用權(quán)限簽名算法

jsapi_ticket

生成簽名之前必須先了解一下jsapi_ticket,jsapi_ticket是公眾號用于調(diào)用微信JS接口的臨時(shí)票據(jù)。正常情況下,jsapi_ticket的有效期為7200秒,通過access_token來獲取。由于獲取jsapi_ticket的api調(diào)用次數(shù)非常有限,頻繁刷新jsapi_ticket會(huì)導(dǎo)致api調(diào)用受限,影響自身業(yè)務(wù),開發(fā)者必須在自己的服務(wù)全局緩存jsapi_ticket 。

1.參考以下文檔獲取access_token(有效期7200秒,開發(fā)者必須在自己的服務(wù)全局緩存access_token):../15/54ce45d8d30b6bf6758f68d2e95bc627.html

2.用第一步拿到的access_token 采用http GET方式請求獲得jsapi_ticket(有效期7200秒,開發(fā)者必須在自己的服務(wù)全局緩存jsapi_ticket):https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=ACCESS_TOKEN&type=jsapi

成功返回如下JSON:

{

"errcode":0,

"errmsg":"ok",

"ticket":"bxLdikRXVbTPdHSM05e5u5sUoXNKd8-41ZO3MhKoyN5OfkWITDGgnr2fwJ0m9E8NYzWKVZvdVtaUgWvsdshFKA",

"expires_in":7200

}

獲得jsapi_ticket之后,就可以生成JS-SDK權(quán)限驗(yàn)證的簽名了。

簽名算法

簽名生成規(guī)則如下:參與簽名的字段包括noncestr(隨機(jī)字符串), 有效的jsapi_ticket, timestamp(時(shí)間戳), url(當(dāng)前網(wǎng)頁的URL,不包含#及其后面部分) 。對所有待簽名參數(shù)按照字段名的ASCII 碼從小到大排序(字典序)后,使用URL鍵值對的格式(即key1=value1&key2=value2…)拼接成字符串string1。這里需要注意的是所有參數(shù)名均為小寫字符。對string1作sha1加密,字段名和字段值都采用原始值,不進(jìn)行URL 轉(zhuǎn)義。

即signature=sha1(string1)。 示例:

noncestr=Wm3WZYTPz0wzccnW

jsapi_ticket=sM4AOVdWfPE4DxkXGEs8VMCPGGVi4C3VM0P37wVUCFvkVAy_90u5h9nbSlYy3-Sl-HhTdfl2fzFy1AOcHKP7qg

timestamp=1414587457

url=http://mp.weixin.qq.com?params=value

步驟1. 對所有待簽名參數(shù)按照字段名的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進(jìn)行sha1簽名,得到signature:

0f9de62fce790f9a083d5c99e95740ceb90c27ed

注意事項(xiàng)

1.簽名用的noncestr和timestamp必須與wx.config中的nonceStr和timestamp相同。

2.簽名用的url必須是調(diào)用JS接口頁面的完整URL。

3.出于安全考慮,開發(fā)者必須在服務(wù)器端實(shí)現(xiàn)簽名的邏輯。

如出現(xiàn)invalid signature 等錯(cuò)誤詳見附錄5常見錯(cuò)誤及解決辦法。

附錄2-所有JS接口列表

版本1.0.0接口

onMenuShareTimeline

onMenuShareAppMessage

onMenuShareQQ

onMenuShareWeibo

onMenuShareQZone

startRecord

stopRecord

onVoiceRecordEnd

playVoice

pauseVoice

stopVoice

onVoicePlayEnd

uploadVoice

downloadVoice

chooseImage

previewImage

uploadImage

downloadImage

translateVoice

getNetworkType

openLocation

getLocation

hideOptionMenu

showOptionMenu

hideMenuItems

showMenuItems

hideAllNonBaseMenuItem

showAllNonBaseMenuItem

closeWindow

scanQRCode

chooseWXPay

openProductSpecificView

addCard

chooseCard

openCard

附錄3-所有菜單項(xiàng)列表

基本類

舉報(bào): "menuItem:exposeArticle"

調(diào)整字體: "menuItem:setFont"

日間模式: "menuItem:dayMode"

夜間模式: "menuItem:nightMode"

刷新: "menuItem:refresh"

查看公眾號(已添加): "menuItem:profile"

查看公眾號(未添加): "menuItem:addContact"

傳播類

發(fā)送給朋友: "menuItem:share:appMessage"

分享到朋友圈: "menuItem:share:timeline"

分享到QQ: "menuItem:share:qq"

分享到Weibo: "menuItem:share:weiboApp"

收藏: "menuItem:favorite"

分享到FB: "menuItem:share:facebook"

分享到 QQ 空間/menuItem:share:QZone

保護(hù)類

編輯標(biāo)簽: "menuItem:editTag"

刪除: "menuItem:delete"

復(fù)制鏈接: "menuItem:copyUrl"

原網(wǎng)頁: "menuItem:originPage"

閱讀模式: "menuItem:readMode"

在QQ瀏覽器中打開: "menuItem:openWithQQBrowser"

在Safari中打開: "menuItem:openWithSafari"

郵件: "menuItem:share:email"

一些特殊公眾號: "menuItem:share:brand"

附錄4-卡券擴(kuò)展字段及簽名生成算法

JSSDK使用者請讀這里,JSAPI用戶可以跳過

卡券簽名和JSSDK的簽名完全獨(dú)立,兩者的算法和意義完全不同,請不要混淆。JSSDK的簽名是使用所有JS接口都需要走的一層鑒權(quán),用以標(biāo)識調(diào)用者的身份,和卡券本身并無關(guān)系。其次,卡券的簽名考慮到協(xié)議的擴(kuò)展性和簡單的防數(shù)據(jù)擅改,設(shè)計(jì)了一套獨(dú)立的簽名協(xié)議。另外由于歷史原因,卡券的JS接口先于JSSDK出現(xiàn),當(dāng)時(shí)的JSAPI并沒有鑒權(quán)體系,所以在卡券的簽名里也加上了appsecret/api_ticket這些身份信息,希望開發(fā)者理解。

卡券 api_ticket

卡券 api_ticket 是用于調(diào)用卡券相關(guān)接口的臨時(shí)票據(jù),有效期為 7200 秒,通過 access_token 來獲取。這里要注意與 jsapi_ticket 區(qū)分開來。由于獲取卡券 api_ticket 的 api 調(diào)用次數(shù)非常有限,頻繁刷新卡券 api_ticket 會(huì)導(dǎo)致 api 調(diào)用受限,影響自身業(yè)務(wù),開發(fā)者必須在自己的服務(wù)全局緩存卡券 api_ticket 

1.參考以下文檔獲取access_token(有效期7200秒,開發(fā)者必須在自己的服務(wù)全局緩存access_token):../15/54ce45d8d30b6bf6758f68d2e95bc627.html

2.用第一步拿到的access_token 采用http GET方式請求獲得卡券 api_ticket(有效期7200秒,開發(fā)者必須在自己的服務(wù)全局緩存卡券 api_ticket):https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=ACCESS_TOKEN&type=wx_card


卡券擴(kuò)展字段cardExt說明

cardExt本身是一個(gè)JSON字符串,是商戶為該張卡券分配的唯一性信息,包含以下字段:

字段是否必填 是否參與簽名說明
code 指定的卡券code碼,只能被領(lǐng)一次。自定義code模式的卡券必須填寫,非自定義code和預(yù)存code模式的卡券不必填寫。詳情見:是否自定義code碼
openid指定領(lǐng)取者的openid,只有該用戶能領(lǐng)取。bind_openid字段為true的卡券必須填寫,bind_openid字段為false不必填寫。
timestamp時(shí)間戳,商戶生成從1970年1月1日00:00:00至今的秒數(shù),即當(dāng)前的時(shí)間,且最終需要轉(zhuǎn)換為字符串形式;由商戶生成后傳入,不同添加請求的時(shí)間戳須動(dòng)態(tài)生成,若重復(fù)將會(huì)導(dǎo)致領(lǐng)取失?。?。
nonce_str隨機(jī)字符串,由開發(fā)者設(shè)置傳入,加強(qiáng)安全性(若不填寫可能被重放請求)。隨機(jī)字符串,不長于32位。推薦使用大小寫字母和數(shù)字,不同添加請求的nonce須動(dòng)態(tài)生成,若重復(fù)將會(huì)導(dǎo)致領(lǐng)取失敗。
fixed_begintimestamp卡券的領(lǐng)取時(shí)間,為10位時(shí)間戳。當(dāng)卡券的有效期類型為DATE_TYPE_FIX_TERM時(shí)專用,標(biāo)識卡券的實(shí)際生效時(shí)間,用于解決商戶系統(tǒng)內(nèi)起始時(shí)間和領(lǐng)取時(shí)間不同步的問題。
outer_id領(lǐng)取渠道參數(shù),用于標(biāo)識本次領(lǐng)取的渠道值。
signature-簽名,商戶將接口列表中的參數(shù)按照指定方式進(jìn)行簽名,簽名方式使用SHA1,具體簽名方案參見下文;由商戶按照規(guī)范簽名后傳入。

簽名說明

1.將 api_ticket(特別說明:api_ticket 相較 appsecret 安全性更高,同時(shí)兼容老版本文檔中使用的 appsecret 作為簽名憑證。)、timestamp、card_id、code、openid、nonce_str的value值進(jìn)行字符串的字典序排序。

2.將所有參數(shù)字符串拼接成一個(gè)字符串進(jìn)行sha1加密,得到signature。

3.signature中的timestamp,nonce字段和card_ext中的timestamp,nonce_str字段必須保持一致。

4.code=jonyqin_1434008071,timestamp=1404896688,card_id=pjZ8Yt1XGILfi-FUsewpnnolGgZk, api_ticket=ojZ8YtyVyr30HheH3CM73y7h4jJE ,nonce_str=jonyqin 則signature=sha1(1404896688jonyqinjonyqin_1434008071ojZ8YtyVyr30HheH3CM73y7h4jJE pjZ8Yt1XGILfi-FUsewpnnolGgZk)=6b81fbf6af16e856334153b39737556063c82689。

強(qiáng)烈建議開發(fā)者使用卡券資料包中的簽名工具SDK進(jìn)行簽名或使用debug工具進(jìn)行校驗(yàn):http://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=cardsign


卡券簽名cardSign說明

1.將 api_ticket(特別說明:api_ticket 相較 appsecret 安全性更高,同時(shí)兼容老版本文檔中使用的 appsecret 作為簽名憑證。)、app_id、location_id、times_tamp、nonce_str、card_id、card_type的value值進(jìn)行字符串的字典序排序。

2.將所有參數(shù)字符串拼接成一個(gè)字符串進(jìn)行sha1加密,得到cardSign。


附錄5-常見錯(cuò)誤及解決方法

調(diào)用config 接口的時(shí)候傳入?yún)?shù) debug: true 可以開啟debug模式,頁面會(huì)alert出錯(cuò)誤信息。以下為常見錯(cuò)誤及解決方法:

1.invalid url domain當(dāng)前頁面所在域名與使用的appid沒有綁定,請確認(rèn)正確填寫綁定的域名,僅支持80(http)和443(https)兩個(gè)端口,因此不需要填寫端口號(一個(gè)appid可以綁定三個(gè)有效域名)。

2.invalid signature簽名錯(cuò)誤。建議按如下順序檢查:

   1.確認(rèn)簽名算法正確,可用 http://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=jsapisign 頁面工具進(jìn)行校驗(yàn)。

   2.確認(rèn)config中nonceStr(js中駝峰標(biāo)準(zhǔn)大寫S), timestamp與用以簽名中的對應(yīng)noncestr, timestamp一致。

   3.確認(rèn)url是頁面完整的url(請?jiān)诋?dāng)前頁面alert(location.href.split('#')[0])確認(rèn)),包括'http(s)://'部分,以及'?'后面的GET參數(shù)部分,但不包括'#'hash后面的部分。

   4.確認(rèn) config 中的 appid 與用來獲取 jsapi_ticket 的 appid 一致。

   5.確保一定緩存access_token和jsapi_ticket。

   6.確保你獲取用來簽名的url是動(dòng)態(tài)獲取的,動(dòng)態(tài)頁面可參見實(shí)例代碼中php的實(shí)現(xiàn)方式。如果是html的靜態(tài)頁面在前端通過ajax將url傳到后臺簽名,前端需要用js獲取當(dāng)前頁面除去'#'hash部分的鏈接(可用location.href.split('#')[0]獲取,而且需要encodeURIComponent),因?yàn)轫撁嬉坏┓窒?,微信客戶端?huì)在你的鏈接末尾加入其它參數(shù),如果不是動(dòng)態(tài)獲取當(dāng)前鏈接,將導(dǎo)致分享后的頁面簽名失敗。

3.the permission value is offline verifying這個(gè)錯(cuò)誤是因?yàn)閏onfig沒有正確執(zhí)行,或者是調(diào)用的JSAPI沒有傳入config的jsApiList參數(shù)中。建議按如下順序檢查:

   1.確認(rèn)config正確通過。

   2.如果是在頁面加載好時(shí)就調(diào)用了JSAPI,則必須寫在wx.ready的回調(diào)中。

   3.確認(rèn)config的jsApiList參數(shù)包含了這個(gè)JSAPI。

4.permission denied該公眾號沒有權(quán)限使用這個(gè)JSAPI,或者是調(diào)用的JSAPI沒有傳入config的jsApiList參數(shù)中(部分接口需要認(rèn)證之后才能使用)。

5.function not exist當(dāng)前客戶端版本不支持該接口,請升級到新版體驗(yàn)。

6.為什么6.0.1版本config:ok,但是6.0.2版本之后不ok(因?yàn)?.0.2版本之前沒有做權(quán)限驗(yàn)證,所以config都是ok,但這并不意味著你config中的簽名是OK的,請?jiān)?.0.2檢驗(yàn)是否生成正確的簽名以保證config在高版本中也ok。)

7.在iOS和Android都無法分享(請確認(rèn)公眾號已經(jīng)認(rèn)證,只有認(rèn)證的公眾號才具有分享相關(guān)接口權(quán)限,如果確實(shí)已經(jīng)認(rèn)證,則要檢查監(jiān)聽接口是否在wx.ready回調(diào)函數(shù)中觸發(fā))

8.服務(wù)上線之后無法獲取jsapi_ticket,自己測試時(shí)沒問題。(因?yàn)閍ccess_token和jsapi_ticket必須要在自己的服務(wù)器緩存,否則上線后會(huì)觸發(fā)頻率限制。請確保一定對token和ticket做緩存以減少2次服務(wù)器請求,不僅可以避免觸發(fā)頻率限制,還加快你們自己的服務(wù)速度。目前為了方便測試提供了1w的獲取量,超過閥值后,服務(wù)將不再可用,請確保在服務(wù)上線前一定全局緩存access_token和jsapi_ticket,兩者有效期均為7200秒,否則一旦上線觸發(fā)頻率限制,服務(wù)將不再可用)。

9.uploadImage怎么傳多圖(目前只支持一次上傳一張,多張圖片需等前一張圖片上傳之后再調(diào)用該接口)

10.沒法對本地選擇的圖片進(jìn)行預(yù)覽(chooseImage接口本身就支持預(yù)覽,不需要額外支持)

11.通過a鏈接(例如先通過微信授權(quán)登錄)跳轉(zhuǎn)到b鏈接,invalid signature簽名失敗(后臺生成簽名的鏈接為使用jssdk的當(dāng)前鏈接,也就是跳轉(zhuǎn)后的b鏈接,請不要用微信登錄的授權(quán)鏈接進(jìn)行簽名計(jì)算,后臺簽名的url一定是使用jssdk的當(dāng)前頁面的完整url除去'#'部分)

12.出現(xiàn)config:fail錯(cuò)誤(這是由于傳入的config參數(shù)不全導(dǎo)致,請確保傳入正確的appId、timestamp、nonceStr、signature和需要使用的jsApiList)

13.如何把jsapi上傳到微信的多媒體資源下載到自己的服務(wù)器(請參見文檔中uploadVoice和uploadImage接口的備注說明)

14.Android通過jssdk上傳到微信服務(wù)器,第三方再從微信下載到自己的服務(wù)器,會(huì)出現(xiàn)雜音(微信團(tuán)隊(duì)已經(jīng)修復(fù)此問題,目前后臺已優(yōu)化上線)

15.綁定父級域名,是否其子域名也是可用的(是的,合法的子域名在綁定父域名之后是完全支持的)

16.在iOS微信6.1版本中,分享的圖片外鏈不顯示,只能顯示公眾號頁面內(nèi)鏈的圖片或者微信服務(wù)器的圖片,已在6.2中修復(fù)

17.是否需要對低版本自己做兼容(jssdk都是兼容低版本的,不需要第三方自己額外做更多工作,但有的接口是6.0.2新引入的,只有新版才可調(diào)用)

18.該公眾號支付簽名無效,無法發(fā)起該筆交易(請確保你使用的jweixin.js是官方線上版本,不僅可以減少用戶流量,還有可能對某些bug進(jìn)行修復(fù),拷貝到第三方服務(wù)器中使用,官方將不對其出現(xiàn)的任何問題提供保障)

19.目前Android微信客戶端不支持pushState的H5新特性,所以使用pushState來實(shí)現(xiàn)web app的頁面會(huì)導(dǎo)致簽名失敗,此問題已在Android6.2中修復(fù)

20.uploadImage在chooseImage的回調(diào)中有時(shí)候Android會(huì)不執(zhí)行,Android6.2會(huì)解決此問題,若需支持低版本可以把調(diào)用uploadImage放在setTimeout中延遲100ms解決

21.require subscribe錯(cuò)誤說明你沒有訂閱該測試號,該錯(cuò)誤僅測試號會(huì)出現(xiàn)

22.getLocation返回的坐標(biāo)在openLocation有偏差,因?yàn)間etLocation返回的是gps坐標(biāo),openLocation打開的騰訊地圖為火星坐標(biāo),需要第三方自己做轉(zhuǎn)換,6.2版本開始已經(jīng)支持直接獲取火星坐標(biāo)

23.查看公眾號(未添加): "menuItem:addContact"不顯示,目前僅有從公眾號傳播出去的鏈接才能顯示,來源必須是公眾號

24.ICP備案數(shù)據(jù)同步有一天延遲,所以請?jiān)诘诙战壎?/span>

附錄6-DEMO頁面和示例代碼

DEMO頁面:

http://demo.open.weixin.qq.com/jssdk


示例代碼:

http://demo.open.weixin.qq.com/jssdk/sample.zip

備注:鏈接中包含php、java、nodejs以及python的示例代碼供第三方參考,第三方切記要對獲取的accesstoken以及jsapi_ticket進(jìn)行緩存以確保不會(huì)觸發(fā)頻率限制。

附錄7-問題反饋

郵箱地址:weixin-open@qq.com

郵件主題:【微信JS-SDK反饋】

郵件內(nèi)容說明:

用簡明的語言描述問題所在,并交代清楚遇到該問題的場景,可附上截屏圖片,微信團(tuán)隊(duì)會(huì)盡快處理你的反饋。


以上內(nèi)容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號