微信JS支付程式碼_前端呼叫微信支付介面
阿新 • • 發佈:2018-11-09
轉自:http://dditblog.com/itshare_553.html
跟大家分享一段微信支付的js程式碼片段、V3版的微信支付沒有paySignKey引數、基本上是直接複製就可以使用了、改一改自己的引數就好了、話不多說、直接上程式碼
支付按鈕的點選事件
$(´.Save_Patient_Msg´).click(function(){ $(´.Save_Patient_Msg´).off(´click´); var hrdfId = getOrderId(); var txnAmt = $(´.sum_pay.font-red´).html(); var data = {orderId: hrdfId, txnAmt: "0.01", prodDesc: "遠端診斷服務", callType: "JSAPI", access_token: getUrlParam("access_token") }; $.ajax({ type: ´POST´, url: ´/hims/api/commonPay/queryTransNo?access_token=´ getUrlParam(´access_token´), dataType:´json´, contentType:´application/json´, data: JSON.stringify(data), success: function(Wxres){ if(!Wxres){ $.alert(´伺服器擁堵,請稍後訪問´) }else{ console.log(Wxres); if(Wxres.data.respCode == ´fail´){ $.alert(Wxres.data.respMsg); }else{ //10 微信支付介面 // 10.1 發起一個支付請求 // 注意:此 Demo 使用 2.7 版本支付介面實現,建議使用此介面時參考微信支付相關最新文件。 var param = Wxres.data; wx.config({ debug: false, // 開啟除錯模式,呼叫的所有api的返回值會在客戶端alert出來,若要檢視傳入的引數,可以在pc端開啟,引數資訊會通過log打出,僅在pc端時才會列印。 appId: ´wx403ead26691402fb´, // 必填,公眾號的唯一標識 timestamp: param.timestamp, // 必填,生成簽名的時間戳 nonceStr: param.noncestr, // 必填,生成簽名的隨機串 signature: param.signJs,// 必填,呼叫js簽名, jsApiList: [´chooseWXPay´] // 必填,需要使用的JS介面列表,這裡只寫支付的 }); wx.chooseWXPay({ timestamp: param.timestamp, // 支付簽名時間戳,注意微信jssdk中的所有使用timestamp欄位均為小寫。但最新版的支付後臺生成簽名使用的timeStamp欄位名需大寫其中的S字元 nonceStr: param.noncestr, // 支付簽名隨機串,不長於 32 位 package: "prepay_id=" param.transNo, // 統一支付介面返回的prepay_id引數值,提交格式如:prepay_id=***) signType: "MD5", // 簽名方式,預設為´SHA1´,使用新版支付需傳入´MD5´ paySign: param.sign, // 支付簽名 success: function (res) { if(res.errMsg == "chooseWXPay:ok"){ //alert("支付成功"); window.location.href = "/hims/weixin/pages/Order_ok.html?access_token=" getUrlParam("access_token"); }else{ alert(res.errMsg); } }, cancel: function(res){ //alert(´取消支付´); } }); } } }, error:function(data){ var msg = data.message || data.status; $.alert(´伺服器錯誤´ msg); } }); return false; });
獲取url程式碼
function getUrlParam(name){
//構造一個含有目標引數的正則表示式物件
var reg = new RegExp("(^|&)" name "=([^&]*)(&|$)");
//匹配目標引數
var r = window.location.search.substr(1).match(reg);
//返回引數值
if (r!=null) return unescape(r[2]); return null;
}
流程
步驟1:使用者在商戶APP中選擇商品,提交訂單,選擇微信支付。
步驟2:商戶後臺收到使用者支付單,呼叫微信支付統一下單介面。參見 【統一下單API】。
步驟3:統一下單介面返回正常的prepay_id,再按簽名規範重新生成簽名後,將資料傳輸給APP。參與簽名的欄位名為appid,partnerid,prepayid,noncestr,timestamp,package。注意:package的值格式為Sign=WXPay
步驟4:商戶APP調起微信支付。api參見本章節【app端開發步驟說明】
步驟5:商戶後臺接收支付通知。api參見【支付結果通知API】
步驟6:商戶後臺查詢支付結果。api參見【查詢訂單API】