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

支付流程示意图

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) {
      }
    })
  }
})
复制代码