導語

微信打賞支付和紅包提現，是日常高頻功能，那么基于小程序云開發，如何實現小程序的打賞支付和紅包提現呢？騰訊工程師給你支招。

如何實現小程序打賞支付

1.1 小程序打賞支付功能介紹

這次的打賞功能，主要用于活躍年會晚會，功能集成在年會小程序上。互動流程如下：晚會節目開始表演時，現場觀眾打開小程序，會自動定位到當前節目名稱，點擊節目名稱即可進入節目打賞界面。我們提供了免費打賞(送愛心)和付費打賞。(備注：打賞并未涉及向個體的虛擬物品打賞，而是用戶向商戶的付費購買。)

圖1.?晚會節目打賞功能流程圖

這個年會小程序的付費打賞主要是利用小程序的微信支付能力來實現的，具體如何操作呢？下面我給大家介紹一下：首先需要有一個收款類型的商戶號，其次需要為小程序開通微信支付功能，具體請看下面的接入流程。

1.2 小程序打賞支付接入流程

在成功申請商戶號之后，可登錄商戶平臺^[1]，點擊產品中心 -> 我的產品，查看已開通的支付產品，里面必須包含 JSAPI 支付才能進行小程序微信支付的開發。請注意，付款類型的商戶號是沒有 JSAPI 支付的，需要是收款類型的商戶號才有。

圖2. 商戶平臺的產品中心截圖

在商戶平臺 -> API 安全，可設置 API 密鑰(如原先已生成過密鑰，請找管理員獲取密鑰)，這個密鑰和商戶號在后續的微信支付開發需要用到。

有了商戶號，小程序就可以申請開通微信支付功能了。具體操作是將小程序 AppID 與商戶號進行綁定。到小程序的微信公眾平臺，點擊微信支付 -> 商戶號管理，可以查到已綁定的商戶號(一個小程序可以綁定多個互不沖突、影響的商戶號)。接著就可以愉快地進入小程序微信支付相關功能的開發了。

圖3.在小程序微信公眾平臺查看已綁定的商戶號

1.3 通過云開發實現小程序打賞支付

本次小程序的微信支付后臺邏輯是借助云開發來實現的，其中在接收支付結果通知回調中，用到了中轉服務器來做數據的中轉。當然，想百分百通過云開發來實現的話，可試試云開發最近提供的通過 HTTP 訪問云函數^[2]。

在發起微信支付之前，需要先去微信支付服務后臺生成預支付交易單，獲得預支付交易會話標識 prepay_id 和簽名 paySign 等參數后，才能調用小程序前端微信支付接口進行支付操作。這里要注意，小程序前端微信支付接口的成功回調，是需要用戶在支付成功后點擊“完成”按鈕才會執行，當用戶未點擊“完成”按鈕，則不會執行成功回調。所以，我們要確認用戶是否支付成功，需要在生成預支付交易單時，傳遞 notify_url 參數，用來接收支付結果通知回調，當用戶支付成功時，微信支付服務后臺會將成功狀態通過 notify_url 參數填寫的地址推送過來，這時我們就能夠知道用戶已經支付成功。

生成預支付交易單，要確保同一個商戶號下的商戶訂單號是唯一的，同一筆交易不能多次提交。交易類型寫 JSAPI，接收支付結果通知的回調地址不能攜帶參數，附相關文檔^[3]。

支付結果通知回調，接收微信支付服務后臺的支付結果通知時，一定要做簽名驗證，并校驗返回的訂單號、訂單金額是否與數據庫保存的一致，防止出現“假通知”，造成資金損失，附相關文檔^[4]。

圖4. 小程序微信支付開發流程圖

詳細全面日志記錄，利用云開發提供的日志服務，對每個打賞交易訂單做詳細的日志記錄，確保用戶的每一筆交易都有跡可尋。

圖5. 詳細全面的日志記錄

如何實現小程序紅包提現

2.1 小程序紅包提現功能介紹

晚會進入中場環節時，現場用戶可通過小程序進入互動小游戲，某用戶在玩游戲的過程中，只要首次分數上報成功，后臺就會自動給其分配一個隨機金額的紅包，當用戶退出互動小游戲，返回到小程序時，前端就會彈出紅包，用戶拆開紅包，金額自動提現到賬微信零錢。

圖6.?晚會中場互動小游戲紅包發放功能流程圖

紅包發放主要是利用微信支付的企業付款到零錢接口來實現的，首先需要有一個付款類型的商戶號，其次需要為小程序開通微信支付功能，將小程序 AppID 與付款商戶號進行綁定。

在小程序中給用戶發紅包，一開始我們有想過利用小程序紅包^[5]來實現這個功能，這樣讓用戶有微信原生發放和領取紅包的體驗，但目前僅支持用戶微信掃碼打開小程序時進行紅包領取，其他場景暫不支持，所以沒有采用這種方法。

2.2 小程序紅包提現接入流程 在成功申請商戶號之后，可登錄商戶平臺^[6]，點擊產品中心 -> 我的產品，查看已開通的運營工具，里面必須包含企業付款到零錢才能進行紅包提現的開發。請注意，收款類型的商戶號是沒有企業付款到零錢的，需要是付款類型的商戶號才有。

圖7.商戶平臺的產品中心截圖

在商戶平臺 -> API 安全，可設置 API 密鑰(如原先已生成過密鑰，請找管理員獲取密鑰)，這個密鑰和商戶號在后續的紅包提現開發需要用到。

有了商戶號，小程序就可以申請開通微信支付功能了。小程序的微信支付功能開通后，我們到小程序的微信公眾平臺，點擊微信支付 -> 商戶號管理，可以查到已綁定的商戶號(一個小程序可以綁定多個互不沖突、影響的商戶號)。接著就可以愉快地進入紅包提現相關功能的開發了。

圖8. 在小程序微信公眾平臺查看已綁定的商戶號

2.3 通過云開發實現小程序紅包提現

本次小程序的紅包分配和提現的后臺邏輯都是借助云開發來實現的。

紅包金額生成，在小程序上線前，后臺就根據付款商戶號總金額和預計線下總參與人數，預先生成一批隨機的紅包金額，隨機打亂順序后入庫 allRedPacketAmounts。

//隨機的紅包金額入庫格式如下{ "_id": "xxxxxx", //記錄id "red_packets": [8.88,18.88,66.66,88.88], //隨機的紅包金額數組 "user_openids": [] //已分配紅包的用戶openid數組}

紅包金額分配，每個用戶只能分配一個紅包，為了避免由于并發導致多個用戶同時分配到同一金額的紅包，我們做了紅包分配的串行處理，每個用戶排隊分配紅包。在給用戶分配紅包之前，先使用原子操作 db.command.addToSet()將其 openid 加入到 user_openids 數組中，并獲得其 openid 在 user_openids 中的索引，在 red_packets 中獲取相同索引的紅包金額作為此用戶分配到的紅包金額。當 red_packets 數組的紅包金額分配完以后，用戶分配到的紅包金額將為 0，用戶拆開紅包時，前端會展示“手慢了，紅包派完了”。

//給用戶分配紅包金額const _ = db.command//原子操作將openid加入到user_openids數組中let updated = await db.collection('allRedPacketAmounts').doc('xxxxxx').update({ data: { user_openids: _.addToSet(openid) }})//獲取最新的紅包金額分配情況let record = (await db.collection('allRedPacketAmounts').doc('xxxxxx').get()).data//獲取此用戶openid在user_openids數組中的索引let index = record.user_openids.indexOf(openid)//獲取此用戶分配到的紅包金額let amount = record.red_packets[index] || 0

紅包金額提現，小程序前端獲取當前用戶分配到的紅包 id，并傳給紅包提現的云函數，進行紅包金額的提現，直接到賬用戶的微信零錢。紅包提現的云函數，使用到的核心接口是微信支付的企業付款到零錢接口，附[相關文檔](https://pay.weixin.qq.com/wiki/doc/api/tools/mch_pay.php?chapter=14_2)

圖9. 小程序紅包分配與提現開發流程圖

調用企業付款到零錢接口，需要先到微信商戶平臺的產品中心 -> 企業付款到零錢 -> 產品設置 -> 發起方式 -> API 接口發起中配置接口調用 IP 白名單。這里需要填一個固定的 IP 地址，而我們使用的是云函數來請求企業付款到零錢接口，而云函數默認是動態(非固定)IP 的。

下面說明如何給云函數配置固定 IP，首先進入騰訊云^[7]，使用此小程序的管理員微信進行掃碼，然后選擇此小程序進行登錄。接著進入騰訊云云開發云函數控制臺^[8]，點擊要配置為固定 IP 的云函數名稱，編輯網絡配置，給其選擇一個私有網絡^[9]和子網^[10]就可以有個固定 IP，如果沒有私有網絡/子網，則需新建。

圖10. 編輯云函數的網絡配置//通過以下方法獲取云函數IP，校驗云函數IP是否是固定的const cp = require('child_process')const util = require('util')exports.main = async(event, context) => { return await util.promisify(cp.exec)('curl -k https://ip.cn')}

請求企業付款到零錢接口，需要帶上商戶 API 證書，可到微信商戶平臺 -> 賬戶中心 -> 賬戶設置 -> API 安全中下載 API 證書。只需要使用到 API 證書壓縮包里面的 apiclient_cert.p12 文件。證書文件名應改為復雜且不易猜測的文件名，存放于安全目錄中，防止泄露。我們將 API 證書文件存放在紅包提現的云函數目錄下，安全且便于引用。

//請求企業付款到零錢接口時帶上API證書示例const mchid = 'xxxxxx'const fs = require('fs')const rp = require('request-promise')let xml = (await rp({ url: 'https://api.mch.weixin.qq.com/mmpaymkttransfers/promotion/transfers', method: 'POST', agentOptions: { pfx: fs.readFileSync(__dirname + '/yXZ2tfp0R9FWi3bVorza7T1nGcJKBQg8.p12'), passphrase: mchid }, body: 'some xml data'})).toString('utf-8')

請求企業付款到零錢接口，所傳的商戶訂單號(partner_trade_no)要確保其歷史全局唯一性。如果商戶向同一用戶付款，傳遞了兩個不同的商戶訂單號，則會給用戶付兩次款。為了避免給用戶重復支付資金，造成損失，我們限定“1 用戶 1 紅包 1 商戶訂單號”，無論接口返回什么錯誤碼(err_code)，都會使用原商戶訂單號重試付款，這樣就不會出現重復支付等資金風險。這里要特別注意一下，企業付款到零錢接口默認的調用頻率為 30/s，如果接口返回錯誤碼 FREQ_LIMIT，最好前端提示：“提現人數過多，請稍后再試”。

圖11. 商戶平臺資金流水截圖?

我們利用云開發提供的日志服務，對每個用戶的紅包金額分配和提現狀態做詳細的日志記錄，確保每一筆資金都有跡可尋。此外，也可登錄商戶平臺，查詢資金流水。

作者介紹

蘇秋宏，騰訊高級前端工程師，就職于騰訊游戲 TGideas 團隊。

關注 TGideas

參考資料

[1]

商戶平臺: https://pay.weixin.qq.com/

[2]

通過 HTTP 訪問云函數: https://tencentcloudbase.github.io/2019-09-03-access-function-by-http/#%E9%80%9A%E8%BF%87-http-%E8%AE%BF%E9%97%AE%E4%BA%91%E5%87%BD%E6%95%B0

[3]

相關文檔: https://pay.weixin.qq.com/wiki/doc/api/wxa/wxa_api.php?chapter=9_1

[4]

相關文檔: https://pay.weixin.qq.com/wiki/doc/api/wxa/wxa_api.php?chapter=9_7&index=8

[5]

小程序紅包: https://pay.weixin.qq.com/wiki/doc/api/tools/miniprogram_hb.php?chapter=18_4&index=1

[6]

商戶平臺: https://pay.weixin.qq.com/

[7]

騰訊云: https://cloud.tencent.com/login/mp

[8]

騰訊云云開發云函數控制臺: https://console.cloud.tencent.com/tcb/scf

[9]

私有網絡: https://console.cloud.tencent.com/vpc/vpc?rid=4

[10]

子網: https://console.cloud.tencent.com/vpc/subnet?rid=4

?

?更多精彩

點擊圖片

---

? ? ? 點擊在看讓更多人發現精彩

總結

以上是生活随笔為你收集整理的前端的date类型后台接收_腾讯高级前端工程师支招，云开发实现小程序打赏和提现云开发实践...的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。