一、說明：
實現(xiàn)微信支付功能需要在小程序后臺配置支付相關信息，并且在前端代碼中調(diào)用微信支付API進行支付操作。好的，uni-app微信小程序實現(xiàn)支付功能整體流程大致如下：
-
注冊微信公眾平臺，并完成開發(fā)者資質認證；
-
在微信商戶平臺注冊商戶賬號，并完成商戶資質認證；
-
在商戶后臺創(chuàng)建支付訂單，得到
prepay_id； -
在客戶端調(diào)用微信支付API，進行支付請求；
-
微信返回支付結果給服務器端，服務器端進行結果驗證和訂單更新；
-
將訂單狀態(tài)告知客戶端，支付完成。
二、簡單介紹一下每個步驟的細節(jié)：
1. 注冊微信公眾平臺
-
注冊地址：微信公眾平臺 - 申請開通商戶號，并對應綁定好微信小程序。
-
開發(fā)文檔地址：微信官方文檔
2. 注冊微信商戶平臺
- 注冊地址：接入微信支付 - 中添加產(chǎn)品并獲取到API密鑰、商戶號等相關信息。
- 開發(fā)文檔地址：微信支付文檔
注意： 此商戶號，需要由
主管及更上級領導進行注冊，會成為公司收款賬戶（不是由前端程序員注冊！?。〔皇怯汕岸顺绦騿T注冊?。?！不是由前端程序員注冊?。?！）注冊非常簡單，重點是需要提供企業(yè)資料，一般程序員沒有權限獲取這些材料，所以需要由上級注冊
企業(yè)注冊需要材料：營業(yè)執(zhí)照，對公銀行賬戶信息，法人身份證
3. 創(chuàng)建支付訂單，請求后端接口，獲取orderInfo
這里進行說明
orderInfo完全是后端返回的，前端不做任何處理，
所以orderInfo有問題推給后端，前端不用浪費時間,app的支付不管ios還是android都是string類型
微信orderinfo格式
"{\"appid\":\"xxxxxxxx\",\"partnerid\":\"xxxxxxx\",\"prepayid\":\"xxxxxxxxxxxxxxxx\",\"timestamp\":\"1579779903\",\"noncestr\":\"xxxxxxx\",\"package\":\"Sign": "WXPay\",\"sign\":\"xxxxxxxxxxxxxxxxxxxx\"}"
在這里我們簡單舉一個例子，以Node.js為例，后端代碼可能如下所示（變量不是很全，各位后端自己看著改）：
const wxpay = require('node-weixin-pay');
const config = {
appid: 'your appid',
mch_id: 'your merchant id',
partner_key: 'your partner key',
pfx: fs.readFileSync('path to your p12 file'),
};
const payment = {
body: 'Your order description',
out_trade_no: 'Your order number',
total_fee: 1,
spbill_create_ip: 'Your ip address',
notify_url: 'Your notify url',
trade_type: 'JSAPI',
openid: 'Your openid',
};
wxpay.getBrandWCPayRequestParams(payment, config, (err, result) => {
if (err) {
console.error(err);
} else {
// 返回給前端的支付參數(shù)
const orderinfo = {
appId: result.appId,
timeStamp: result.timeStamp,
nonceStr: result.nonceStr,
package: result.package,
signType: result.signType,
paySign: result.paySign,
};
}
});
其中，
node-weixin-pay是用來對微信支付進行封裝的第三方庫，具體使用方法可以參考其官方文檔。
上述代碼中，需要使用你的appid、mch_id、partner_key等參數(shù)，這些參數(shù)是你自己在注冊微信支付時所獲得的。我們將payment對象傳遞給getBrandWCPayRequestParams()方法，并帶上config對象，該方法會返回一個加密后的訂單信息（即orderInfo）。
最后，我們將加密后的訂單信息返回給前端，前端頁面拿到該信息后即可使用微信支付API，向微信服務器發(fā)送請求，完成支付流程。
微信支付統(tǒng)一下單接口返回的支付參數(shù)包含以下含義（重要?。。。?/h4>
- appid：小程序或公眾號的AppID
- partnerid：商戶號
- prepayid：預支付交易會話標識
- noncestr：隨機字符串，不長于32位
- timestamp：時間戳，表示當前時間，格式為yyyyMMddHHmmss
- package：統(tǒng)一下單接口返回的prepay_id參數(shù)值，此處將其賦值給package，是客戶端調(diào)起微信支付時的必要參數(shù)
- sign：簽名，通過簽名算法計算得出，用于驗簽支付結果是否合法。
在客戶端調(diào)起微信支付時，需要將以上參數(shù)傳遞給微信支付API發(fā)送請求完成支付。
4. 調(diào)用微信支付API
在客戶端調(diào)起微信支付時，需要將以上參數(shù)傳遞給微信支付API發(fā)送請求完成支付。
在客戶端調(diào)用微信提供的wx.requestPayment方法，需要傳入如下參數(shù)：
-
timeStamp: 時間戳，自1970年以來的秒數(shù) -
nonceStr: 隨機字符串，不長于32位 -
package: 統(tǒng)一下單接口返回的prepay_id參數(shù)值，格式為prepay_id=xxx -
signType: 簽名算法，目前支持HMAC-SHA256和MD5，默認使用MD5 -
paySign: 簽名
第三步、第四步一起的示例代碼：
uni.request({
url: '你們公司的后端接口地址,獲取支付核心數(shù)據(jù)',
method: 'POST',
data: { 接口需要什么參數(shù)就傳給接口,包含扣款金額,訂單id等 },
success(obj) {
//調(diào)用微信官方支付接口彈出付款界面,輸入密碼扣款
wx.requestPayment({
timeStamp: obj.xxxx.timeStamp, //后端返回的時間戳
nonceStr: obj.xxxx.nonceStr, //后端返回的隨機字符串
package: obj.xxxx.packageValue, //后端返回的prepay_id
signType: 'MD5', //后端簽名算法,根據(jù)后端來,后端MD5這里即為MD5
paySign: obj.xxxx.paySign, //后端返回的簽名
success (res) {
console.log('用戶支付扣款成功', res)
},
fail (res) {
console.log('用戶支付扣款失敗', res)
}
})
}
})
以上就是前端實現(xiàn)微信支付功能的基本步驟，需要注意的是，在實際開發(fā)中，還需要考慮
支付安全、支付異常情況等問題。同時，建議開發(fā)者使用uni-app官方提供的微信支付插件來減少開發(fā)成本和難度。
5. 驗證支付結果和更新訂單狀態(tài)
在微信回調(diào)服務器通知支付結果后，服務器需要進行結果驗證和處理訂單狀態(tài)。具體步驟如下：
-
將收到的xml轉化為數(shù)組，驗證簽名是否一致；
-
判斷支付結果中的
return_code和result_code是否都為SUCCESS； -
根據(jù)
out_trade_no查詢訂單信息，判斷訂單狀態(tài)； -
更新訂單狀態(tài)為已支付/支付失敗。文章來源：http://www.zghlxwxcb.cn/news/detail-539808.html
6. 支付完成
將支付結果告知客戶端，客戶端根據(jù)支付結果進行相應的頁面跳轉處理。文章來源地址http://www.zghlxwxcb.cn/news/detail-539808.html
到了這里，關于【uni-app微信小程序】實現(xiàn)支付功能的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關文章，希望大家以后多多支持TOY模板網(wǎng)！
