一、準(zhǔn)備階段
注冊(cè)微信支付商戶號(hào)
在微信支付商戶平臺(tái)(https://pay.weixin.qq.com/index.php/home/login)注冊(cè)并進(jìn)行資質(zhì)審核和簽約。這個(gè)商戶號(hào)將成為公司收款賬戶,需要填寫超級(jí)管理員信息并上傳企業(yè)資料(如營(yíng)業(yè)執(zhí)照、對(duì)公銀行賬戶信息、法人身份證)。
小程序關(guān)聯(lián)商戶號(hào)
登錄微信公眾平臺(tái)(https://mp.weixin.qq.com/wxopen/devprofile/get),在左側(cè)功能項(xiàng)找到“微信支付”,選擇“商戶號(hào)管理”,將小程序與商戶號(hào)關(guān)聯(lián)。如果已經(jīng)關(guān)聯(lián),會(huì)顯示已關(guān)聯(lián)的商戶號(hào)信息。
配置小程序合法域名
在微信小程序后臺(tái)配置合法域名,包括API接口域名、上傳文件接口域名等。這是為了確保小程序能夠正常訪問(wèn)后端服務(wù)器。
二、開(kāi)發(fā)流程
獲取OpenID
OpenID是用戶的唯一標(biāo)識(shí),通過(guò)臨時(shí)登錄憑證code獲取。在小程序中調(diào)用wx.login接口,獲取到用戶的code(5分鐘有效期),然后將code傳遞給后端接口,通過(guò)后端服務(wù)器換取OpenID。
javascript
wx.login({??
? success: (res) => {??
? ? console.log(res.code, 'code');??
? ? let userCode = res.code; // 將code傳遞給服務(wù)器??
? ? // 調(diào)用后端接口,將code傳遞給接口會(huì)返回openid, unionid, phone等??
? }??
});
后端生成預(yù)支付訂單
后端服務(wù)器調(diào)用微信支付的統(tǒng)一下單接口(https://pay.weixin.qq.com/wiki/doc/api/wxa/wxa_api.php?chapter=9_1),生成預(yù)支付訂單,并獲取預(yù)支付交易會(huì)話標(biāo)識(shí)prepay_id。這一步涉及復(fù)雜的簽名和加密過(guò)程,確保訂單信息的安全性。
javascript
app.post('/get-pay-params', async (req, res) => {??
? const { outTradeNo } = req.body;??
? try {??
? ? const order = await createPrepayOrder(outTradeNo, 1, '測(cè)試商品');??
? ? const payParams = generateSignature(order, config.partner_key);??
? ? res.json(payParams);??
? } catch (err) {??
? ? console.error('生成支付參數(shù)失敗:', err);??
? ? res.status(500).send('Failed to generate payment params.');??
? }??
});??
?
function generateSignature(order, key) {??
? const params = {??
? ? appId: config.appid,??
? ? nonceStr: Math.random().toString(36).substring(2),??
? ? package: `prepay_id=${order.prepay_id}`,??
? ? signType: 'MD5',??
? ? timeStamp: `${Math.round(Date.now() / 1000)}`??
? };??
? const stringToSign = Object.keys(params).sort().map(k => `${k}=${params[k]}`).join('&') + `&key=${key}`;??
? const sign = crypto.createHash('md5').update(stringToSign).digest('hex').toUpperCase();??
? return { ...params, paySign: sign };??
}
前端獲取支付參數(shù)并發(fā)起支付
前端小程序需要從后端獲取預(yù)支付訂單的相關(guān)參數(shù)(包括時(shí)間戳timeStamp、隨機(jī)字符串nonceStr、預(yù)支付IDpackage、簽名算法signType、簽名paySign等),然后使用這些參數(shù)調(diào)用wx.requestPayment接口發(fā)起支付請(qǐng)求。
javascript
Page({??
? data: {??
? ? payParams: {}??
? },??
? getPayParams: function() {??
? ? wx.request({??
? ? ? url: 'https://your-backend.com/get-pay-params',??
? ? ? method: 'POST',??
? ? ? data: { outTradeNo: '1234567890' },??
? ? ? success: (res) => {??
? ? ? ? const { package: pkg, nonceStr, signType, paySign, timeStamp } = res.data;??
? ? ? ? this.setData({??
? ? ? ? ? payParams: { pkg, nonceStr, signType, paySign, timeStamp }??
? ? ? ? });??
? ? ? },??
? ? ? fail: (err) => {??
? ? ? ? console.error('獲取支付參數(shù)失敗:', err);??
? ? ? }??
? ? });??
? },??
? onPay: function() {??
? ? wx.requestPayment({??
? ? ? ...this.data.payParams,??
? ? ? success: (res) => {??
? ? ? ? console.log('支付成功:', res);??
? ? ? },??
? ? ? fail: (err) => {??
? ? ? ? console.error('支付失敗:', err);??
? ? ? }??
? ? });??
? }??
});
處理支付回調(diào)
當(dāng)支付成功時(shí),微信會(huì)向商戶的后端服務(wù)器發(fā)送異步通知。商戶需要處理這些通知,更新數(shù)據(jù)庫(kù)中的訂單狀態(tài)。
javascript
app.post('/notify', (req, res) => {??
? const { transaction_id, out_trade_no, result_code, return_code } = req.query;??
? if (return_code === 'SUCCESS' && result_code === 'SUCCESS') {??
? ? // 更新數(shù)據(jù)庫(kù)中的訂單狀態(tài)??
? ? updateOrderStatus(out_trade_no, 'paid').then(() => {??
? ? ? res.send('SUCCESS');??
? ? }).catch((err) => {??
? ? ? console.error('更新訂單狀態(tài)失敗:', err);??
? ? ? res.send('FAIL');??
? ? });??
? } else {??
? ? console.error('支付回調(diào)失敗:', req.query);??
? ? res.send('FAIL');??
? }??
});
三、具體實(shí)現(xiàn)中的注意事項(xiàng)
支付參數(shù)的安全性和完整性
在調(diào)用wx.requestPayment時(shí),需要確保傳入的支付參數(shù)是準(zhǔn)確和完整的。這些參數(shù)包括時(shí)間戳、隨機(jī)字符串、預(yù)支付ID、簽名算法和簽名等,任何一個(gè)參數(shù)的錯(cuò)誤都可能導(dǎo)致支付失敗。
支付流程的順暢性
支付流程應(yīng)該盡可能順暢,減少用戶等待時(shí)間。提供清晰的支付提示和支付結(jié)果反饋,讓用戶能夠及時(shí)了解支付狀態(tài)。
錯(cuò)誤處理
在支付過(guò)程中,可能會(huì)遇到各種錯(cuò)誤,如網(wǎng)絡(luò)錯(cuò)誤、支付參數(shù)錯(cuò)誤、支付失敗等。開(kāi)發(fā)者需要在代碼中做好錯(cuò)誤處理,給用戶友好的提示,并盡可能提供解決方案。
支付結(jié)果的驗(yàn)證
在處理支付回調(diào)時(shí),需要驗(yàn)證支付結(jié)果的真實(shí)性和有效性。可以通過(guò)校驗(yàn)支付通知中的簽名、對(duì)比訂單號(hào)等方式來(lái)確保支付結(jié)果的真實(shí)性。
四、總結(jié)
微信支付功能是小程序商城開(kāi)發(fā)的核心功能之一,通過(guò)集成微信支付,可以為用戶提供便捷的支付手段,提升用戶體驗(yàn)。在集成微信支付功能時(shí),需要做好準(zhǔn)備工作,包括注冊(cè)微信支付商戶號(hào)、小程序關(guān)聯(lián)商戶號(hào)、配置小程序合法域名等。在開(kāi)發(fā)流程中,需要獲取OpenID、后端生成預(yù)支付訂單、前端獲取支付參數(shù)并發(fā)起支付、處理支付回調(diào)等步驟。在具體實(shí)現(xiàn)中,需要注意支付參數(shù)的安全性和完整性、支付流程的順暢性、錯(cuò)誤處理以及支付結(jié)果的驗(yàn)證等方面。
通過(guò)本文的介紹,相信讀者已經(jīng)對(duì)如何在微信小程序開(kāi)發(fā)中集成支付功能有了全面的了解。希望這些內(nèi)容能夠幫助開(kāi)發(fā)者更好地實(shí)現(xiàn)微信小程序的支付功能,為用戶提供更好的服務(wù)。