微信小程序接入微信支付實現(xiàn)過程詳解
一、基本介紹
1、支付場景:點擊支付按鈕喚起微信支付彈窗,輸入正確密碼后完成支付。
2、基本流程:點擊支付按鈕首先生成一個訂單,然后在后端調(diào)用微信api接口進(jìn)行統(tǒng)一下單,將接口返回的數(shù)據(jù)回傳到前端拉起支付操作,然后異步通知支付結(jié)果。
二、配置信息
1、微信公眾平臺配置
點擊功能 – 微信支付,關(guān)聯(lián)一下 注冊好的微信商戶平臺

1、微信商戶平臺配置
(1)設(shè)置證書和密鑰
登錄微信商戶平臺,點擊賬戶中心 – API安全,設(shè)置證書和兩個密鑰(此處兩個密鑰設(shè)置為相同的。

(2)申請JSAPI支付
①點擊產(chǎn)品中心 – 我的產(chǎn)品 ,點擊申請JSAPI支付。

②填寫支付授權(quán)目錄
開發(fā)配置中需要填寫支付授權(quán)目錄(后端服務(wù)器域名)

三、編碼實現(xiàn)
1、獲取用戶的openId
必須要有微信用戶的openid才可以喚醒支付功能。openid由微信公眾號提供,是對于消費(fèi)者微信產(chǎn)生的唯一用戶身份標(biāo)識。
獲取方法:傳送門
2、獲取prepay_id和支付簽名驗證paySign
商戶在小程序中先調(diào)用接口在微信支付服務(wù)后臺生成預(yù)支付交易單,返回正確的預(yù)支付交易后調(diào)起支付。
(1)調(diào)用接口生成預(yù)支付訂單拿到訂單id
orderInsert(data).then(res => {
if (res.data.code === 1) {
this.getPayInfo(res.data.data.id)
} else {
wx.showToast({
title: res.data.msg,
icon: 'none'
})
}
})
(2)通過訂單id調(diào)用接口獲取用戶支付所需參數(shù)
getPayInfo(id) {
unifiedOrder({id}).then(res => {
if(res.data.code === 1) {
this.payMoney(res.data.data)
} else {
wx.showToast({
title: res.data.msg,
icon: "error"
})
}
}
}
(3)通過wx.requestPayment方法調(diào)用起支付功能

payMoney(moneyData) {
wx.requestPayment({
timeStamp: moneyData.timeStamp,
nonceStr: moneyData.nonceStr,
package: moneyData.packageValue,
signType: moneyData.signType,
paySign: moneyData.paySign,
success(res) {
},
fail(res) {
wx.showToast({
title: "支付失??!",
icon: "error"
})
}
})
}
四、流程總結(jié)
(1)小程序獲取微信openId以及訂單號傳給后臺
(2)后臺根據(jù)openId和訂單號進(jìn)行簽名post微信統(tǒng)一下單接口
(3)后臺獲取微信返回的xml字符串解析二次簽名后返回給前端
(4)前端調(diào)起微信支付API
到此這篇關(guān)于微信小程序接入微信支付實現(xiàn)過程詳解的文章就介紹到這了,更多相關(guān)小程序接入微信支付內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
ionic中的$ionicPlatform.ready事件中的通用設(shè)置
$ionicPlatform.ready事件是用于檢測當(dāng)前的平臺是否就緒的事件,相當(dāng)于基于document的deviceready事件, 在app中一些通用關(guān)于設(shè)備的設(shè)置必須在這個事件中處理2017-06-06
javascript動態(tài)的改變IFrame的高度實現(xiàn)自動伸展
動態(tài)的改變IFrame的高度,實現(xiàn)IFrame自動伸展,父頁面也自動神縮,實現(xiàn)原理很簡單就是在IFrame子頁面一加載的時候,調(diào)用父IFrame對象,改變其高度,感興趣的朋友可以了解下2013-10-10
使用smartupload組件實現(xiàn)jsp+jdbc上傳下載文件實例解析
這篇文章主要介紹了使用smartupload組件實現(xiàn)jsp+jdbc上傳下載文件實例解析,非常不錯,具有參考借鑒價值,需要的朋友可以參考下2017-01-01
JS中驗證整數(shù)和小數(shù)的正則表達(dá)式
網(wǎng)上很多關(guān)于驗證小數(shù)的正則表達(dá)式,但是很多都不是百分百正確,所以我結(jié)合一些前輩的經(jīng)驗,寫了一個,分享到腳本之家平臺,對小數(shù)或整數(shù)正則表達(dá)式的相關(guān)知識感興趣的朋友一起看看吧2018-10-10
JS+CSS實現(xiàn)六級網(wǎng)站導(dǎo)航主菜單效果
這篇文章主要介紹了JS+CSS實現(xiàn)六級網(wǎng)站導(dǎo)航主菜單效果,涉及JavaScript遍歷頁面元素及動態(tài)修改css屬性的相關(guān)實現(xiàn)技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-09-09

