最近微信網(wǎng)頁開發(fā)要用到公眾平臺支付的功能，過程中坑不少。

引入js

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

通過config接口注入權(quán)限驗證配置

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

JS-SDK使用權(quán)限簽名signature算法:

想要使用JSSDK必須要進行權(quán)限簽名驗證，和支付簽名（paySign）不是一個東西??！

1. 通過APPID和APPSECRET獲取access_token
   https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=APPID&secret=APPSECRET

{"access_token":"ACCESS_TOKEN","expires_in":7200}

2. 生成jsapi_ticket
   用第一步拿到的access_token 采用http GET方式請求獲得jsapi_ticket
   https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=ACCESS_TOKEN&type=jsapi

{
"errcode":0,
"errmsg":"ok",
"ticket":"bxLdikRXVbTPdHSM05e5u5sUoXNKd8-41ZO3MhKoyN5OfkWITDGgnr2fwJ0m9E8NYzWKVZvdVtaUgWvsdshFKA",
"expires_in":7200
}

需要注意access_token 和jsapi_ticket有效期均為7200s，jsapi_ticket每天限制2000次請求，所以服務(wù)端必須進行緩存。

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

noncestr=Wm3WZYTPz0wzccnW
jsapi_ticket=sM4AOVdWfPE4DxkXGEs8VMCPGGVi4C3VM0P37wVUCFvkVAy_90u5h9nbSlYy3-Sl-HhTdfl2fzFy1AOcHKP7qg
timestamp=1414587457
url=[http://mp.weixin.qq.com?params=value](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進行sha1簽名，得到signature：
0f9de62fce790f9a083d5c99e95740ceb90c27ed

調(diào)用JSSDK支付功能

wx.chooseWXPay({
    // 支付簽名時間戳，注意微信jssdk中的所有使用timestamp字段均為小寫。但最新版的支付后臺生成簽名使用的timeStamp字段名需大寫其中的S字符
    timestamp: 0, 
    nonceStr: '', // 支付簽名隨機串，不長于 32 位
    package: '', // 統(tǒng)一支付接口返回的prepay_id參數(shù)值，提交格式如：prepay_id=***）
    signType: '', // 簽名方式，默認為'SHA1'，使用新版支付需傳入'MD5'
    paySign: '', // 支付簽名
    success: function (res) {
        //res返回信息只有errMsg并沒有err_msg，都是自己開調(diào)試模式，log出來的！都是淚
        // 支付成功后的回調(diào)函數(shù)
    }
    cancel: function (res) {
        // 支付取消的回調(diào)函數(shù)
    }
    error: function (res) {
        // 支付失敗的回調(diào)函數(shù)
    }
});

注意??！注意啊！這里取消和失敗的回調(diào)要這么寫?。】墒枪俜介_發(fā)文檔上并沒有?。?！

下面這種寫法是官方給出的，但是這是處理JSSDK權(quán)限驗證時config信息驗證失敗的回調(diào)！

wx.error(function(res){

});

還有需要注意的是，js上調(diào)起支付timestamp是小寫，而服務(wù)端做簽名時候timeStamp中'S'必須大寫！
服務(wù)端做簽名的時候一定要注意參數(shù)大小寫和順序問題，以及服務(wù)端和js參數(shù)要保持一致。

真心想吐槽微信公眾平臺開發(fā)文檔！心好累！碼農(nóng)何苦為難碼農(nóng)！