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

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

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

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

三、編碼實(shí)現(xiàn)
1、獲取用戶的openId
必須要有微信用戶的openid才可以喚醒支付功能。openid由微信公眾號(hào)提供,是對(duì)于消費(fèi)者微信產(chǎn)生的唯一用戶身份標(biāo)識(shí)。
獲取方法:傳送門
2、獲取prepay_id和支付簽名驗(yàn)證paySign
商戶在小程序中先調(diào)用接口在微信支付服務(wù)后臺(tái)生成預(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以及訂單號(hào)傳給后臺(tái)
(2)后臺(tái)根據(jù)openId和訂單號(hào)進(jìn)行簽名post微信統(tǒng)一下單接口
(3)后臺(tái)獲取微信返回的xml字符串解析二次簽名后返回給前端
(4)前端調(diào)起微信支付API
到此這篇關(guān)于微信小程序接入微信支付實(shí)現(xiàn)過程詳解的文章就介紹到這了,更多相關(guān)小程序接入微信支付內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
ionic中的$ionicPlatform.ready事件中的通用設(shè)置
$ionicPlatform.ready事件是用于檢測(cè)當(dāng)前的平臺(tái)是否就緒的事件,相當(dāng)于基于document的deviceready事件, 在app中一些通用關(guān)于設(shè)備的設(shè)置必須在這個(gè)事件中處理2017-06-06
JS時(shí)間戳轉(zhuǎn)換為常用時(shí)間格式的三種方式
我們?cè)陂_發(fā)中經(jīng)常需要把時(shí)間戳轉(zhuǎn)化成日期格式,下面這篇文章主要給大家介紹了關(guān)于JS時(shí)間戳轉(zhuǎn)換為常用時(shí)間格式的三種主要方式,文中通過實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2023-04-04
javascript動(dòng)態(tài)的改變IFrame的高度實(shí)現(xiàn)自動(dòng)伸展
動(dòng)態(tài)的改變IFrame的高度,實(shí)現(xiàn)IFrame自動(dòng)伸展,父頁面也自動(dòng)神縮,實(shí)現(xiàn)原理很簡單就是在IFrame子頁面一加載的時(shí)候,調(diào)用父IFrame對(duì)象,改變其高度,感興趣的朋友可以了解下2013-10-10
使用smartupload組件實(shí)現(xiàn)jsp+jdbc上傳下載文件實(shí)例解析
這篇文章主要介紹了使用smartupload組件實(shí)現(xiàn)jsp+jdbc上傳下載文件實(shí)例解析,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2017-01-01
JS中驗(yàn)證整數(shù)和小數(shù)的正則表達(dá)式
網(wǎng)上很多關(guān)于驗(yàn)證小數(shù)的正則表達(dá)式,但是很多都不是百分百正確,所以我結(jié)合一些前輩的經(jīng)驗(yàn),寫了一個(gè),分享到腳本之家平臺(tái),對(duì)小數(shù)或整數(shù)正則表達(dá)式的相關(guān)知識(shí)感興趣的朋友一起看看吧2018-10-10
JS+CSS實(shí)現(xiàn)六級(jí)網(wǎng)站導(dǎo)航主菜單效果
這篇文章主要介紹了JS+CSS實(shí)現(xiàn)六級(jí)網(wǎng)站導(dǎo)航主菜單效果,涉及JavaScript遍歷頁面元素及動(dòng)態(tài)修改css屬性的相關(guān)實(shí)現(xiàn)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-09-09
js 動(dòng)態(tài)創(chuàng)建 html元素
最近在學(xué)習(xí)js 寫了個(gè)簡單的效果,菜鳥可以學(xué)習(xí)學(xué)習(xí),基本原理:使用隨即數(shù)設(shè)置top 和left的值,2009-07-07

