h5頁面調起微信支付


//先判斷是否支持所需接口

//聲明所需變量

 

var timestamp;
var appId;
var signature;
var nonceStr;
var url = location.href;

 

//發送ajax


$.ajax({
type: "get",
url: "/public/vipreg/js/jssdk.php",
data: {
url: url
},
dataType: "jsonp",
jsonp: "callback",
jsonpCallback: "success_jsonpCallback",
success: function(data) {
timestamp = data.timestamp;
appId = data.appId;
signature = data.signature;
nonceStr = data.nonceStr;
wx.config({
debug: false,
appId: data.appId,
timestamp: data.timestamp,
nonceStr: data.nonceStr,
signature: data.signature,
jsApiList: [
'checkJsApi',
'onMenuShareTimeline',
'onMenuShareAppMessage',
'onMenuShareQQ',
'onMenuShareWeibo',
'hideMenuItems',
'showMenuItems',
'hideAllNonBaseMenuItem',
'showAllNonBaseMenuItem',
'translateVoice',
'startRecord',
'stopRecord',
'onRecordEnd',
'playVoice',
'pauseVoice',
'stopVoice',
'uploadVoice',
'downloadVoice',
'chooseImage',
'previewImage',
'uploadImage',
'downloadImage',
'getNetworkType',
'openLocation',
'getLocation',
'hideOptionMenu',
'showOptionMenu',
'closeWindow',
'scanQRCode',
'chooseWXPay',
'openProductSpecificView',
'addCard',
'chooseCard',
'openCard'
]
});

},
error: function(data) {
console.log(data)
}

});

 

 

wx.ready(function() {

// config信息驗證后會執行ready方法,所有接口調用都必須在config接口獲得結果之后,config是一個客戶端的異步操作,所以如果需要在頁面加載時就調用相關接口,則須把相關接口放在ready函數中調用來確保正確執行。對於用戶觸發時才調用的接口,則可以直接調用,不需要放在ready函數中。
});

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

 

//點擊按鈕調起支付

$('.pay_btn').click(function() {

var newopenid = getCookie('openid');

$.ajax({

url: "/user/chongzhi",

data: {

uid: params.uid,
token: params.token,
type: 4,
money_type: 1,
price: '398',
openid: newopenid,
tradetype: 'JSAPI'

},

dataType: "JSON",

type: "post",

success: function(data) {

timestamp = data.jsapi.timeStamp;

nonceStr = data.jsapi.nonceStr;

package = data.jsapi.package;

paySign = data.jsapi.paySign;

wx.chooseWXPay({

appId: appId,

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

nonceStr: nonceStr, // 支付簽名隨機串,不長於 32 位

package: package, // 統一支付接口返回的prepay_id參數值,提交格式如:prepay_id=\*\*\*)

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

paySign: paySign, // 支付簽名

success: function(res) {
//成功后的回調,一般支付成功后,都需要給后台發送收貨人,支付金額等信息

var addid=getCookie('addid');

$.ajax({

url: "/ZeroBuy/userOrderPay",

data: {

uid:params.uid,
address_id:addid,
token:params.token

},

dataType: "JSON",

type: "post",

success: function(data) {

},

error: function(data) {


}

});

$('.chenggong').removeClass('cgnone');
$('.chenggong').addClass('cgblock');

}
});

},
error: function(data) {

}

});

})

 

 

 

 

 

 

 

總結:其實邏輯並不難,但是需要傳的數據很多,其中大多數都是后台生成傳給前端再傳回去,上面的代碼復制粘貼改一改接口和命名基本就能用了


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM