本文實(shí)例講述了JS通過調(diào)用微信API實(shí)現(xiàn)微信支付功能的方法。分享給大家供大家參考，具體如下：

最近在做微信公眾號開發(fā)，在微信支付上遇到一些問題，困惑了3天，今天終于搞定。期間要感謝一些大神的幫助，趁熱下面分享一下我的經(jīng)驗(yàn)。

在實(shí)現(xiàn)微信支付之前，需要到微信開發(fā)平臺認(rèn)證，這些認(rèn)證和配置信息我就不多說了，這里主要從代碼層面實(shí)現(xiàn)支付。

function onBridgeReady(){
  WeixinJSBridge.invoke(
    'getBrandWCPayRequest', {
      "appId" ： "wx2421b1c4370ec43b",   //公眾號名稱，由商戶傳入
      "timeStamp"：" 1395712654",     //時間戳，自1970年以來的秒數(shù)
      "nonceStr" ： "e61463f8efa94090b1f366cccfbbb444", //隨機(jī)串
      "package" ： "prepay_id=u802345jgfjsdfgsdg888",   //統(tǒng)一訂單號
      "signType" ： "MD5",     //微信簽名方式：
      "paySign" ： "70EA570631E4BB79628FBCA90534C63FF7FADD89" //支付簽名
    },
    function(res){
      alert(res.err_msg);
      if(res.err_msg == "get_brand_wcpay_request：ok" ) {}   // 使用以上方式判斷前端返回,微信團(tuán)隊鄭重提示：res.err_msg將在用戶支付成功后返回  ok，但并不保證它絕對可靠。
    }
  );
}
if (typeof WeixinJSBridge == "undefined"){
  if( document.addEventListener ){
    document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);
  }else if (document.attachEvent){
    document.attachEvent('WeixinJSBridgeReady', onBridgeReady);
    document.attachEvent('onWeixinJSBridgeReady', onBridgeReady);
  }
}else{
  onBridgeReady();
}

上面的JS代碼是官方文檔上貼出來的，官方文檔:https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=7_7。

下面對JS中的幾個參數(shù)做主要的講解:

在開發(fā)過程中，有4個非常重要的參數(shù):一個是appid,AppSecret,apikey和商戶號。上面js中的appID就是其中之一。timeStamp是一個時間戳，10位數(shù)，nonceStr是隨機(jī)數(shù)，32位以內(nèi)，這里最重要的兩個參數(shù)，也是最容易出錯的就是package和paySign了。我一一說來。先說package，這里需要用到prepay_id，這個參數(shù)是微信生成的訂單號，需要我們調(diào)用統(tǒng)一訂單接口來獲取。官方文檔:https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=9_1。可以從文檔看到，要獲取prepay_id，需要很多參數(shù)，這里面有一個非常重要的參數(shù)就是簽名。注意:這里的簽名和JS中的支付簽名和不同的。 簽名的算法文檔里有，我只是強(qiáng)調(diào)兩點(diǎn)。一個是參數(shù)的順序，一定一定要按照ASCII從小到大拼接，二是apikey一定不能錯，這個apikey在哪里呢?登入商戶平臺就可以設(shè)置了。

拼接好簽名需要的字符串后，進(jìn)行MD5加密就可以得到簽名了。然后把簽名和前面所有的參數(shù)組合成xml格式的字符串，調(diào)用給的接口URL地址：https://api.mch.weixin.qq.com/pay/unifiedorder就可以返回一個xml結(jié)果，解析出其中的prepay_id，這樣這個參數(shù)就成功獲取到了。

下面再說JS中的最后一個參數(shù)PaySign:支付簽名。支付簽名的算法也是一樣，把JS中的其他5個參數(shù)按照順序拼接，加上apikey，MD5加密，ok。

簽名的算法都是一樣的，只是參數(shù)值不同而已。這里需要注意一點(diǎn)。在支付簽名的時候，用到隨機(jī)數(shù)nonceStr，時間戳timeStamp，而簽名時使用的這兩個參數(shù)和JS中的這兩個參數(shù)的值要是一樣的，是同一個隨機(jī)數(shù)，同一個時間戳。為什么呢?雖然文檔沒說，但是我的理解是:支付簽名是通過隨機(jī)數(shù)和時間戳來生成的，然后在支付的時候，把隨機(jī)數(shù)，時間戳，支付簽名一起發(fā)送過去，那么在微信進(jìn)行驗(yàn)證的時候，也會根基js中的隨機(jī)數(shù)和時間戳生成簽名和你發(fā)送的支付簽名進(jìn)行比較，如果你在js中重新獲取新的隨機(jī)數(shù)、時間戳，那么算出來的簽名和你發(fā)送的簽名就會不一樣，就會報錯:簽名失敗。

到此，代碼層面的注意點(diǎn)就這些，當(dāng)然，還有其他的一些注意點(diǎn)。比如其中有用的openid，這個參數(shù)也是需要調(diào)用接口獲取到的，還有支付授權(quán)的目錄是否配置正確。

最后一句總結(jié):仔細(xì)看文檔，最后問別人，可以找微信支付相關(guān)的群，里面很多大神的，我之前就是遇到一個問題糾結(jié)了2天沒解決，(有時候光看文檔也不行)，

然后怒加了8個微信開發(fā)的群，最終在高人的指點(diǎn)下終于搞出來了。再次表示感謝。程序員是一個熱愛分享的群體，他們非常樂意把自己知道的東西分享出去。所以不懂的時候，多問問。

更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《JavaScript中json操作技巧總結(jié)》、《JavaScript切換特效與技巧總結(jié)》、《JavaScript錯誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》

希望本文所述對大家JavaScript程序設(shè)計有所幫助。