微信小程序 使用微信支付功能实现在线支付订单

Posted 2021-01-11 知兮

以前做过PC页面微信支付，但是这次在小程序 直接调用微信支付功能还是方便很多

先放个微信官方API链接：https://pay.weixin.qq.com/wiki/doc/api/wxa/wxa_api.php?chapter=7_7&index=5

先说说整个下单支付流程的整体思路，

0，准备工作：

一，appId，开发帐号中注册时的appId。

二，sdkContent，后台返回的包含有金额，支付方式等信息的数据包。

三，key值，商户申请微信支付功能时所配置的密钥

准备好后，

1，首先选择下单金额和支付方式【这里默认只有微信支付一个】，拿到金额和支付方式和用户唯一识别码【登陆时就放入微信缓存中】，发送到后端下单接口生成订单号

2，拿到返回的订单号和用户唯一识别码，再到后台现金充值接口拿到sdkContent，也就是一会在下一步微信支付中要用到的package参数，

3，将开发帐号中注册时的appId【注意：区别于后台之间通讯用的appId，两不同也不通用】，时间戳，随机串，签名方式和数据包按微信签名规则拼接成字符串，后面接上key值 【key值 ：商户申请微信支付功能时所配置的密钥】

使用MD5方式进行加密，再将成生的加密字符中的字母全部换成大写，然后将加密串与appId，时间戳，随机串，签名方式和数据包调用wx.requestPayment(OBJECT)发起微信支付

如果规则符合，基本就可以支付成功了

注意要点：appid不要弄错，sdkContent别名要换成微信指定的prepay_id，参数名大小写，key值放在尾部，其他参数按序排列，加密完成后字母全部大写

 

 

第一步：下单

subRecharge: function (e) { //充值下单
    var that = this
    var amount = Number(that.data.onPrice); //金额 [单位：分]
    if (amount==\'\'){
      that.errorShow(\'请选择充值金额\');
      return;
    }
    var appid = getApp().globalData.appid; //appid
    var timestamp = Date.parse(new Date());//获取当前时间戳 
    timestamp = timestamp / 1000;
    var version = getApp().globalData.version; //版本号
    var sign = getApp().globalData.sign; //签名

    var userIdEnc = wx.getStorageSync(\'userIdEnc\'); //获取本地缓存中的userIdEnc //用户唯一识别码
    var loginDevice = wx.getStorageSync(\'loginDevice\');//获取本地缓存中的loginDevice
    
    var data = { "appId": appid, "timestamp": timestamp, "version": version, "userIdEnc": userIdEnc, "amount": amount };
    var url = getApp().globalData.url; //接口路径
    var key = getApp().globalData.appkey;  //加密k值 
    var encryption = utils.encryption(key, data) //算出签名
    sign = encryption;//赋值给签名
    data.sign = sign;
    data = JSON.stringify(data);
    // console.log(\'算出签名的data结果：\', data)
    var header = {
      \'content-type\': \'application/json\',
      \'cookie\': "devimark=" + loginDevice + ";" + "usenc=" + userIdEnc,
    };
    wx.request({ //请求用充值下单接口
      method: "post",
      url: url + \'/order/recharge/createAmountOrder\',
      data: data + \'@#@\' + appid,
      header: header,
      dataType: "json",
      success: function (res) {
        // console.log("充值成功", res) 
        if (res.data.code == \'0000\') { //下单成功
          that.setData({
            systemOrderNo: res.data.data.systemOrderNo //返回充值订单编号 
          });
          that.cashPay(); //调用支付方法
       
        } else if (res.data.code == \'2014\'){  //2014 用户没有登录
          wx.navigateTo({
            url: \'../../pages/logs/logs\',
          })
        }else{
          wx.navigateTo({
            url: \'../../pages/rechargeFailure/rechargeFailure\',//充值失败页
          })
        }

      }, fail: function (res) {
        console.log("充值失败", res)
        wx.navigateTo({
          url: \'../../pages/rechargeFailure/rechargeFailure\',//充值失败页
        })
      }
    })

  }

 

 

第二步：使用订单号获取支付数据包【含第三步：调用微信支付接口】

cashPay: function(){ // 现金充值
    var that = this
    // var amount = Number(that.data.onPrice); //金额
    var systemOrderNo = that.data.systemOrderNo;//充值订单号
    var cashPayWayId = getApp().globalData.cashPayWayId; //现金支付方式ID
    var appid = getApp().globalData.appid; //appid
    var timestamp = Date.parse(new Date());//获取当前时间戳 
    timestamp = timestamp / 1000;
    var version = getApp().globalData.version; //版本号
    var sign = getApp().globalData.sign; //签名
    var userIdEnc = wx.getStorageSync(\'userIdEnc\'); //获取本地缓存中的userIdEnc //用户唯一识别码
    var loginDevice = wx.getStorageSync(\'loginDevice\');//获取本地缓存中的loginDevice
    var data = { "appId": appid, "timestamp": timestamp, "version": version, "systemOrderNo": systemOrderNo, "cashPayWayId": cashPayWayId };
    var url = getApp().globalData.url; //接口路径
    var key = getApp().globalData.appkey;  //加密k值 
    var encryption = utils.encryption(key, data) //算出签名
    sign = encryption;//赋值给签名
    data.sign = sign;
    data = JSON.stringify(data);
    // console.log(\'算出签名的data结果：\', data)
    var header = {
      \'content-type\': \'application/json\',
      \'cookie\': "devimark=" + loginDevice + ";" + "usenc=" + userIdEnc,
    };
    wx.request({ //请求用现金支付接口
      method: "post",
      url: url + \'/pay/cash/cashPay\',
      data: data + \'@#@\' + appid,
      header: header,
      dataType: "json",
      success: function (res) {
        // console.log("现金支付成功", res)
        if (res.data.code == \'0000\') { //现金支付成功
          var sdkContent = \'prepay_id=\'+res.data.data.sdkContent;
         
          var wxappid = getApp().globalData.wxappid; //appid
          var timestamp = Date.parse(new Date());//获取当前时间戳 
          timestamp = timestamp / 1000;
          timestamp = timestamp.toString();
          var nonceStr = utils.getNum(); //随机串
          var signType = \'MD5\';
          var paykey = getApp().globalData.paykey;
         
          var paySign = { "appId": wxappid, "nonceStr": nonceStr, "package": sdkContent, "signType": signType, "timeStamp": timestamp,}
          var objKeySort = utils.objKeySort(paySign); //排序
          paySign = utils.splicingString(objKeySort); //按微信支付验签规则拼接字符串
          paySign = paySign + "&key=" + paykey;  //尾部添加key值 【商户密钥】
          console.log("sort_ASCII", objKeySort);
          console.log("paySign", paySign);
          var md5 = require(\'../../utils/js/md5.js\');  //md5加密
          var md5Pw = md5.hexMD5(paySign);
          paySign = md5Pw.toUpperCase(); //按微信支付验签规则将签名字母转大写
          console.log(paySign);
          console.log(timestamp, nonceStr, sdkContent, paySign);
          wx.requestPayment(
            {
              \'timeStamp\': timestamp,
              \'nonceStr\': nonceStr,
              \'package\': sdkContent,
              \'signType\': \'MD5\',
              \'paySign\': paySign,
              \'success\': function (res) { 
                // console.log(1);
                 wx.navigateTo({
                    url: \'../../pages/rechargeSuccess/rechargeSuccess\',//充值成功页
                  })
              },
              \'fail\': function (res) {
                wx.navigateTo({
                  url: \'../../pages/rechargeFailure/rechargeFailure\',//充值失败页
                })
               },
              \'complete\': function (res) {
                wx.navigateTo({
                  url: \'../../pages/rechargeFailure/rechargeFailure\',//充值失败页
                })
              }
            })


          // console.log("0000", res.data.data.systemOrderNo)
         
        } else if (res.data.code == \'2014\') {  //2014 用户没有登录
          wx.navigateTo({
            url: \'../../pages/logs/logs\',
          })
        } else {
          wx.navigateTo({
            url: \'../../pages/rechargeFailure/rechargeFailure\',//充值失败页
          })
        }

      }, fail: function (res) {
        console.log("充值失败", res)
        wx.navigateTo({
          url: \'../../pages/rechargeFailure/rechargeFailure\',//充值失败页
        })
      }
    })
  },

 

注意检查签名加密前的顺序和大小写

appId=wxd678efh567hg6787&nonceStr=5K8264ILTKCH16CQ2502SI8ZNMTM67VS&package=prepay_id=wx2017033010242291fcfe0db70013231072&signType=MD5&timeStamp=1490840662&key=qazwsxedcrfvtgbyhnujmikolp111111

 

其中有用到的一些数据处理方法，封装在util.js中方便全局调用，这里也给贴上

//key值顺序排序的函数
function objKeySort(obj) {//排序的函数
  var newkey = Object.keys(obj).sort();
  //先用Object内置类的keys方法获取要排序对象的属性名，再利用Array原型上的sort方法对获取的属性名进行排序，newkey是一个数组
  var newObj = {};//创建一个新的对象，用于存放排好序的键值对
  for (var i = 0; i < newkey.length; i++) {//遍历newkey数组
    newObj[newkey[i]] = obj[newkey[i]];//向新创建的对象中按照排好的顺序依次增加键值对
  }
  return newObj;//返回排好序的新对象
}




function splicingString(obj){ //封装全局拼接微信支付验签字符串
  var str = \'\';
  var arr = Object.keys(obj);
  var j = arr.length;
  var k = 0;
  for (var i in obj) {
    k++;
    // console.log("aa.length::", j, k)
    if (j == k) {
      str += i + "=" + obj[i]
    } else {
      str += i + "=" + obj[i] + "&"
    }
    // console.log(i,\'--\',aa[i]);
  }
  return str;
  // console.log(str)
}

function getNum() { //随机生成32位随机数
  var chars = [\'0\', \'1\', \'2\', \'3\', \'4\', \'5\', \'6\', \'7\', \'8\', \'9\', \'A\', \'B\', \'C\', \'D\', \'E\', \'F\', \'G\', \'H\', \'I\', \'J\', \'K\', \'L\', \'M\', \'N\', \'O\', \'P\', \'Q\', \'R\', \'S\', \'T\', \'U\', \'V\', \'W\', \'X\', \'Y\', \'Z\', \'a\', \'b\', \'c\', \'d\', \'e\', \'f\', \'g\', \'h\', \'i\', \'j\', \'k\', \'l\', \'m\', \'n\', \'o\', \'p\', \'q\', \'r\', \'s\', \'t\', \'u\', \'v\', \'w\', \'x\', \'y\', \'z\']; 
  var nums = "";
  for (var i = 0; i < 32; i++) {
    var id = parseInt(Math.random() * 61); 
    nums += chars[id]; 
  } 
  return nums; 
}

module.exports = {
  formatTime: formatTime,
  // Bytes2Str: Bytes2Str,
  // Str2Bytes: Str2Bytes,
  encryption: encryption,
  getNum: getNum,
  objKeySort: objKeySort,
  sort_ASCII: sort_ASCII,
  splicingString: splicingString
}

 

MD5加密文件

/*      * A javascript implementation of the RSA Data Security, Inc. MD5 Message      * Digest Algorithm, as defined in RFC 1321.      * Version 1.1 Copyright (C) Paul Johnston 1999 - 2002.      * Code also contributed by Greg Holt      * See http://pajhome.org.uk/site/legal.html for details.      */

/*      * Add integers, wrapping at 2^32. This uses 16-bit operations internally      * to work around bugs in some JS interpreters.      */
function safe_add(x, y) {
  var lsw = (x & 0xFFFF) + (y & 0xFFFF)
  var msw = (x >> 16) + (y >> 16) + (lsw >> 16)
  return (msw << 16) | (lsw & 0xFFFF)
}

/*      * Bitwise rotate a 32-bit number to the left.      */
function rol(num, cnt) {
  return (num << cnt) | (num >>> (32 - cnt))
}

/*      * These functions implement the four basic operations the algorithm uses.      */
function cmn(q, a, b, x, s, t) {
  return safe_add(rol(safe_add(safe_add(a, q), safe_add(x, t)), s), b)
}

function ff(a, b, c, d, x, s, t) {
  return cmn((b & c) | ((~b) & d), a, b, x, s, t)
}

function gg(a, b, c, d, x, s, t) {
  return cmn((b & d) | (c & (~d)), a, b, x, s, t)
}

function hh(a, b, c, d, x, s, t) {
  return cmn(b ^ c ^ d, a, b, x, s, t)
}

function ii(a, b, c, d, x, s, t) {
  return cmn(c ^ (b | (~d)), a, b, x, s, t)
}

/*      * Calculate the MD5 of an array of little-endian words, producing an array      * of little-endian words.      */
function coreMD5(x) {
  var a = 1732584193
  var b = -271733879
  var c = -1732584194
  var d = 271733878
  for (var i = 0; i < x.length; i += 16) {
    var olda = a
    var oldb = b
    var oldc = c
    var oldd = d
    a = ff(a, b, c, d, x[i + 0], 7, -680876936)
    d = ff(d, a, b, c, x[i + 1], 12, -389564586)
    c = ff(c, d, a, b, x[i + 2], 17, 606105819)
    b = ff(b, c, d, a, x[i + 3], 22, -1044525330)
    a = ff(a, b, c, d, x[i + 4], 7, -176418897)
    d = ff(d, a, b, c, x[i + 5], 12, 1200080426)
    c = ff(c, d, a, b, x[i + 6], 17, -1473231341)
    b = ff(b, c, d, a, x[i + 7], 22, -45705983)
    a = ff(a, b, c, d, x[i + 8], 7, 1770035416)
    d = ff(d, a, b, c, x[i + 9], 12, -1958414417)
    c = ff(c, d, a, b, x[i + 10], 17, -42063)
    b = ff(b, c, d, a, x[i + 11], 22, -1990404162)
    a = ff(a, b, c, d, x[i + 12], 7, 1804603682)
    d = ff(d, a, b, c, x[i + 13], 12, -40341101)
    c = ff(c, d, a, b, x[i + 14], 17, -1502002290)
    b = ff(b, c, d, a, x[i + 15], 22, 1236535329)
    a = gg(a, b, c, d, x[i + 1], 5, -165796510)
    d = gg(d, a, b, c, x[i + 6], 9, -1069501632)
    c = gg(c, d, a, b, x[i + 11], 14, 643717713)
    b = gg(b, c, d, a, x[i + 0], 20, -373897302)
    a = gg(a, b, c, d, x[i + 5], 5, -701558691)
    d = gg(d, a, b, c, x[i + 10], 9, 38016083)
    c = gg(c, d, a, b, x[i + 15], 14, -660478335)
    b = gg(b, c, d, a, x[i + 4], 20, -405537848)
    a = gg(a, b, c, d, x[i + 9], 5, 568446438)
    d = gg(d, a, b, c, x[i + 14], 9, -1019803690)
    c = gg(c, d, a, b, x[i + 3], 14, -187363961)
    b = gg(b, c, d, a, x[i + 8], 20, 1163531501)
    a = gg(a, b, c, d, x[i + 13], 5, -1444681467)
    d = gg(d, a, b, c, x[i + 2], 9, -51403784)
    c = gg(c, d, a, b, x[i + 7], 14, 1735328473)
    b = gg(b, c, d, a, x[i + 12], 20, -1926607734)
    a = hh(a, b, c, d, x[i + 5], 4, -378558)
    d = hh(d, a, b, c, x[i + 8], 11, -2022574463)
    c = hh(c, d, a, b, x[i + 11], 16, 1839030562)
    b = hh(b, c, d, a, x[i + 14], 23, -35309556)
    a = hh(a, b, c, d, x[i + 1], 4, -1530992060)
    d = hh(d, a, b, c, x[i + 4], 11, 1272893353)
    c = hh(c, d, a, b, x[i + 7], 16, -155497632)
    b = hh(b, c, d, a, x[i + 10], 23, -1094730640)
    a = hh(a, b, c, d, x[i + 13], 4, 681279174)
    d = hh(d, a, b, c, x[i + 0], 11, -358537222)
    c = hh(c, d, a, b, x[i + 3], 16, -722521979)
    b = hh(b, c, d, a, x[i + 6], 23, 76029189)
    a = hh(a, b, c, d, x[i + 9], 4, -640364487)
    d = hh(d, a, b, c, x[i + 12], 11, -421815835)
    c = hh(c, d, a, b, x[i + 15], 16, 530742520)
    b = hh(b, c, d, a, x[i + 2], 23, -995338651)
    a = ii(a, b, c, d, x[i + 0], 6, -198630844)
    d = ii(d, a, b, c, x[i + 7], 10, 1126891415)
    c = ii(c, d, a, b, x[i + 14], 15, -1416354905)
    b = ii(b, c, d, a, x[i + 5], 21, -57434055)
    a = ii(a, b, c, d, x[i + 12], 6, 1700485571)
    d = ii(d, a, b, c, x[i + 3], 10, -1894986606)
    c = ii(c, d, a, b, x[i + 10], 15, -1051523)
    b = ii(b, c, d, a, x[i + 1], 21, -2054922799)
    a = ii(a, b, c, d, x[i + 8], 6, 1873313359)
    d = ii(d, a, b, c, x[i + 15], 10, -30611744)
    c = ii(c, d, a, b, x[i + 6], 15, -1560198380)
    b = ii(b, c, d, a, x[i + 13], 21, 1309151649)
    a = ii(a, b, c, d, x[i + 4], 6, -145523070)
    d = ii(d, a, b, c, x[i + 11], 10, -1120210379)
    c = ii(c, d, a, b, x[i + 2], 15, 718787259)
    b = ii(b, c, d, a, x[i + 9], 21, -343485551)
    a = safe_add(a, olda)
    b = safe_add(b, oldb)
    c = safe_add(c, oldc)
    d = safe_add(d, oldd)
  }
  return [a, b, c, d]
}

/*      * Convert an array of little-endian words to a hex string.      */
function binl2hex(binarray) {
  var hex_tab = "0123456789abcdef"
  var str = ""
  for (var i = 0; i < binarray.length * 4; i++) {
    str += hex_tab.charAt((binarray[i >> 2] >> ((i % 4) * 8 + 4)) & 0xF) + hex_tab.charAt((binarray[i >> 2] >> ((i % 4) * 8)) & 0xF)
  }
  return str
}

/*      * Convert an array of little-endian words to a base64 encoded string.      */
function binl2b64(binarray) {
  var tab = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/"
  var str = ""
  for (var i = 0; i < binarray.length * 32; i += 6) {
    str += tab.charAt(((binarray[i >> 5] << (i % 32)) & 0x3F) | ((binarray[i >> 5 + 1] >> (32 - i % 32)) & 0x3F))
  }
  return str
}

/*      * Convert an 8-bit character string to a sequence of 16-word blocks, stored      * as an array, and append appropriate padding for MD4/5 calculation.      * If any of the characters are >255, the high byte is silently ignored.      */
function str2binl(str) {
  var nblk = ((str.length + 8) >> 6) + 1 // number of 16-word blocks
  var blks = new Array(nblk * 16)
  for (var i = 0; i < nblk * 16; i++) blks[i] = 0
  for (var i = 0; i < str.length; i++)
    blks[i >> 2] |= (str.charCodeAt(i) & 0xFF) << ((i % 4) * 8)
  blks[i >> 2] |= 0x80 << ((i % 4) * 8)
  blks[nblk * 16 - 2] = str.length * 8
  return blks
}
/*      * Convert a wide-character string to a sequence of 16-word blocks, stored as      * an array, and append appropriate padding for MD4/5 calculation.      */
function strw2binl(str) {
  var nblk = ((str.length + 4) >> 5) + 1 // number of 16-word blocks
  var blks = new Array(nblk * 16)
  for (var i = 0; i < nblk * 16; i++) blks[i] = 0
  for (var i = 0; i < str.length; i++)
    blks[i >> 1] |= str.charCodeAt(i) << ((i % 2) * 16)
  blks[i >> 1] |= 0x80 << ((i % 2) * 16)
  blks[nblk * 16 - 2] = str.length * 16
  return blks
}
/*      * External interface      */
function hexMD5(str) { return binl2hex(coreMD5(str2binl(str))) }
function hexMD5w(str) { return binl2hex(coreMD5(strw2binl(str))) }
function b64MD5(str) { return binl2b64(coreMD5(str2binl(str))) }
function b64MD5w(str) { return binl2b64(coreMD5(strw2binl(str))) }
/* Backward compatibility */
function calcMD5(str) { return binl2hex(coreMD5(str2binl(str))) }
module.exports = { hexMD5: hexMD5 }

View Code

 

最后，成功调取微信支付功能！