微信小程序打夯之旅(六)：支付流程

支付流程示意圖

1. 預支付（請求後臺，後臺請求微信服務獲取支付信息）
2. 調用 API 發起支付：wx.requestPayment({})

jsAPI、jsSDK、小程序支付的對比(開發步驟)

對比欄目	JSAPI	JSSDK	小程序
統一下單	都須要先獲取到Openid，調用相同的API	同	同
調起數據簽名	五個字段參與簽名(區分大小寫)：appId,nonceStr,package,signType,timeStamp	同	同
調起支付頁面協議	HTTP或HTTPS	HTTP或HTTPS	HTTPS
支付目錄	有	有	無
受權域名	有	有	無
回調函數	有	success回調	complete、fail、success回調函數

小程序調起支付 API 說明

wx.requestPayment(
{
  'timeStamp': '',
  'nonceStr': '',
  'package': '',
  'signType': 'MD5',
  'paySign': '',
  'success':function(res){},
  'fail':function(res){},
  'complete':function(res){}
})
複製代碼

• paySign 字段包含信息說明：

paySign = MD5(appId=wxd678efh567hg6787&nonceStr=5K8264ILTKCH16CQ2502SI8ZNMTM67VS&package=prepay_id=wx2017033010242291fcfe0db70013231072&signType=MD5&timeStamp=1490840662&key=qazwsxedcrfvtgbyhnujmikolp111111) = 22D9B4E54AB1950F51E0649E8810ACD6
複製代碼

字段名	變量名	必填	類型	示例值	描述
小程序ID	appId	是	String	wx***6787	微信分配的小程序ID
時間戳	timeStamp	是	String	14***662	時間戳從1970年1月1日00:00:00至今的秒數,即當前的時間
隨機串	nonceStr	是	String	5K***67VS	隨機字符串，不長於32位。推薦隨機數生成算法
數據包	package	是	String	prepay_id=wx***1072	統一下單接口返回的 prepay_id 參數值，提交格式如：prepay_id=wx**1072
簽名方式	signType	是	String	MD5	簽名類型，默認爲MD5，支持HMAC-SHA256和MD5。注意此處需與統一下單的簽名類型一致

• 參數說明：

參數	類型	必填	說明
timeStamp	String	是	時間戳從1970年1月1日00:00:00至今的秒數,即當前的時間
nonceStr	String	是	隨機字符串，長度爲32個字符如下。
package	String	是	統一下單接口返回的 prepay_id 參數值，提交格式如：prepay_id=*
signType	String	是	簽名類型，默認爲MD5，支持HMAC-SHA256和MD5。注意此處需與統一下單的簽名類型一致
paySign	String	是	簽名,具體簽名方案參見微信公衆號支付幫助文檔;
success	Function	否	接口調用成功的回調函數
fail	Function	否	接口調用失敗的回調函數
complete	Function	否	接口調用結束的回調函數（調用成功、失敗都會執行）

• 回調說明：

回調類型	errMsg	說明
success	requestPayment:ok	調用支付成功
fail	requestPayment:fail cancel	用戶取消支付
fail	requestPayment:fail (detail message)	調用支付失敗，其中 detail message 爲後臺返回的詳細失敗緣由

預支付流程

前端提交需支付的信息到開發者服務器，開發者服務器再提交到微信，然後返回須要的信息

{
    "sign":"A2****************A6",

    "timestamp":"14****************68",

    "package":"Sign=WXPay",

    "partnerId":"14****************02",

    "appid":"wx****************ab",

    "nonceStr":"9f****************37",

    "prepayId":"wx****************54"

}
複製代碼

發起支付

md5下載連接：code.csdn.net/snippets/20…

var MD5Util = require('../../../utils/md5.js');
var sign = '';
var signA = "appId="+app.appId+"&nonceStr="+res.data.nonceStr+"&package=prepay_id="+res.data.prepayId+"&signType=MD5&timeStamp="+res.data.timestamp;
var signB = signA+"&key="+app.key;
sign = MD5Util.MD5(signB).toUpperCase();

wx.requestPayment({
    nonceStr: res.data.nonceStr,
    package: "prepay_id="+res.data.prepayId,
    signType: 'MD5',
    timeStamp: res.data.timestamp,
    paySign: sign,
    success: function(res){
      console.log("支付成功");
    },
    fail: function() {
    },
    complete: function() {
    }
})
複製代碼

代碼Demo

wx.request({
  url: 'https://調用服務器獲取微信統一下單數據',
  method: 'GET',
  data: { uid: uid, id: id },
  success: function (res) {
    var nowTime = new Date()
    var appId = res.data.appid
    var timeStamp1 = Math.round((nowTime.getTime()) / 1000)
    var timeStamp = timeStamp1.toString()
    var nonceStr = res.data.nonce_str
    var package = "prepay_id=" + res.data.prepay_id
    var signType = "MD5"
    var key = "Niskh5234234WYk4323HyE78m2sE"//商戶平臺的key
    var sign = res.data.sign
    var paySign = md5.hexMD5("appId=" + appId + "&nonceStr=" + nonceStr + "&package=" + package + "&signType=MD5&timeStamp=" + timeStamp + "&key=" + key)
    wx.requestPayment({
      timeStamp: timeStamp,
      //隨機字符串，長度爲32個字符如下。
      nonceStr: nonceStr,
      //統一下單接口返回的 prepay_id 參數值，提交格式如：prepay_id=*
      package: package,
      //簽名算法，暫支持 MD5
      signType: 'MD5',
      paySign: paySign,
      success: function (res) {
      },
      fail: function (res) {
      },
      complete: function (res) {
      }
    })
  }
})
複製代碼