簡單說說微信小程式的支付流程(日常水文~~)

語言: CN / TW / HK

一、前言

微信小程式為電商類小程式,提供了非常完善、優秀、安全的支付功能

在小程式內可呼叫微信的API完成支付功能,方便、快捷

場景如下圖所示:

  • 使用者通過分享或掃描二維碼進入商戶小程式,使用者選擇購買,完成選購流程
  • 調起微信支付控制元件,使用者開始輸入支付密碼
  • 密碼驗證通過,支付成功。商戶後臺得到支付成功的通知
  • 返回商戶小程式,顯示購買成功
  • 微信支付公眾號下發支付憑證

以電商小程式為例

支付流程圖如下所示:

具體的做法:

  • 開啟某小程式,點選直接下單
  • wx.login獲取使用者臨時登入憑證code,傳送到後端伺服器換取openId
  • 在下單時,小程式需要將購買的商品Id,商品數量,以及使用者的openId傳送到伺服器
  • 伺服器在接收到商品Id、商品數量、openId後,生成服務期訂單資料,同時經過一定的簽名演算法,向微信支付傳送請求,獲取預付單資訊(prepay_id),同時將獲取的資料再次進行相應規則的簽名,向小程式端響應必要的資訊
  • 小程式端在獲取對應的引數後,呼叫wx.requestPayment()發起微信支付,喚醒支付工作臺,進行支付
  • 接下來的一些列操作都是由使用者來操作的包括了微信支付密碼,指紋等驗證,確認支付之後執行鑑權調起支付
  • 鑑權調起支付:在微信後臺進行鑑權,微信後臺直接返回給前端支付的結果,前端收到返回資料後對支付結果進行展示
  • 推送支付結果:微信後臺在給前端返回支付的結果後,也會向後臺也返回一個支付結果,後臺通過這個支付結果來更新訂單的狀態

其中後端響應資料必要的資訊則是wx.requestPayment方法所需要的引數,大致如下:

wx.requestPayment({ // 時間戳 timeStamp: '', // 隨機字串 nonceStr: '', // 統一下單介面返回的 prepay_id 引數值 package: '', // 簽名型別 signType: '', // 簽名 paySign: '', // 呼叫成功回撥 success () {}, // 失敗回撥 fail () {}, // 介面呼叫結束回撥 complete () {} })

引數表如下所示:

三、結束

小程式支付和以往的網頁、APP微信支付大同小異,可以說小程式的支付變得更加簡潔,不需要設定支付目錄、域名授權等操作

參考文獻

  • http://pay.weixin.qq.com/wiki/doc/apiv3/open/pay/chapter2_8_0.shtml
  • http://juejin.cn/post/6844903895970349064