微信小程序H5支付

利用微信小程序 <web-view> 组件，将原来放在公众号的网页转移到微信小程序上，但是支付出现问题。

支付报错：{"err_msg":"system:access_denied"}。

经查询，微信小程序现不支持通过组件在 H5 页面上支付，需要在支付时跳转到小程序，小程序支付完后，再跳转回 H5 页面。

1.调用接口

首先调用统一下单接口，在微信支付服务后台生成预支付交易单，返回正确的预支付交易后调起支付。

详情见 https://pay.weixin.qq.com/wiki/doc/api/wxa/wxa_api.php?chapter=9_1

调用接口
接口链接：https://api.mch.weixin.qq.com/pay/unifiedorder
方法：post
参数：xml_data（xml格式）

参数 xml_data 举例：

<xml>
   <appid>wx2421b1c4370ec43b</appid>
   <body>JSAPItest</body>
   <mch_id>10000100</mch_id>
   <nonce_str>1add1a30ac87aa2db72f57a2375d8fec</nonce_str>
   <notify_url>https://wxpay.wxutil.com/pub_v2/pay/notify.v2.php</notify_url>
   <openid>oUpF8uMuAJO_M2pxb1Q9zNjWeS6o</openid>
   <out_trade_no>1415659990</out_trade_no>
   <spbill_create_ip>14.23.150.211</spbill_create_ip>
   <total_fee>1</total_fee>
   <trade_type>JSAPI</trade_type>
   <sign>0CB01533B8C1EF103065174F50BCA001</sign>
</xml>

其中，nonce_str 随机字符串长度在 32 位以内，

sign 通过签名算法计算得出，签名类型默认为 MD5，

notify_url 是异步接收微信支付结果通知的回调地址，必须外网可访问，不能携带参数。

2.签名生成算法

以上述 xml 参数举例，将以上参数除 sign 外按照参数名 ASCII 码从小到大排序，使用 URL 键值对的格式拼接成字符串 stringA，如下：

stringA="appid=wx2421b1c4370ec43b&body=JSAPItest&mch_id=10000100&nonce_str=1add1a30ac87aa2db72f57a2375d8fec&notify_url=https://wxpay.wxutil.com/pub_v2/pay/notify.v2.php&openid=oUpF8uMuAJO_M2pxb1Q9zNjWeS6o&out_trade_no=1415659990&spbill_create_ip=14.23.150.211&total_fee=1&trade_type=JSAPI";

拼接API密钥：

1 2	stringSignTemp=stringA+"&key=192006250b4c09247ec02edce69f6a2d"; //key为商户平台设置的密钥key sign=MD5(stringSignTemp).toUpperCase(); //md5算法

3.统一下单

request 请求示例：

wx.request({
    url: 'https://api.mch.weixin.qq.com/pay/unifiedorder',
      method: "POST",
      data: xml_data,
      success: res=>{
        console.log(res)
      },
})

4.代码

如下：

// index.js
Page({
  data: {
    openid:''
  },
  // 事件处理函数
  onLoad() {
    let that = this;  
    wx.login({
        success (res) {
          if (res.code) {
            //发起网络请求
            var JSCODE=res.code
            var urlx='https://xxx.xxx.com/WXAppOpenid?js_code='+JSCODE; //从服务器获取openid
            wx.request({
              url: urlx,
              data: {code: res.code},
              method:'GET',
              success:function(rex){that.setData({openid:rex.data.openid});}
            })
          } else {console.log('登录失败！' + res.errMsg)}
        }
      })
  },
  zhifu(){
    var appId='xxxxxxxxxx';
    var nonceStr = 'xxxxxxxxxxxxxxxxxxxxx';  //随机生成
    var codeStr="DC";
    codeStr += this.getTimeStamp();
    codeStr += parseInt((Math.random()*10));
    console.log(codeStr);
    var money='10'; //￥0.1
    //var url='https://xxx.xxx.com/PayCallBackServlet';
    var url = 'https://wxpay.wxutil.com/pub_v2/pay/notify.v2.php';
    var ip = '111.11.111.111';  // 本机ip
    var openId = this.data.openid;
    console.log(openId);
    var mch_id = '1111111111';
    var mch_key = '111111111111111111111';
    var app_key = 'xxxxxxxxxxxxxxxxxxxxxxxxxxxxx';
    var stringA="appid="+appId+"&body=JSAPItest&mch_id="+mch_id+"&nonce_str="+nonceStr+"&notify_url="+url+"&openid="+openId+"&out_trade_no="+codeStr+"&spbill_create_ip="+ip+"&total_fee="+money+"&trade_type=JSAPI";
    console.log(stringA);
    var stringSignTemp=stringA+"&key="+mch_key;
    console.log(stringSignTemp);
    var sign=md5(stringSignTemp).toUpperCase();
    console.log(sign);
    var tdata = '<xml>'+
    '<appid>'+appId+'</appid>'+
    '<body>JSAPItest</body>'+
    '<mch_id>'+mch_id+'</mch_id>'+
    '<nonce_str>'+nonceStr+'</nonce_str>'+
    '<notify_url>'+url+'</notify_url>'+
    '<openid>'+openId+'</openid>'+
    '<out_trade_no>'+codeStr+'</out_trade_no>'+
    '<spbill_create_ip>'+ip+'</spbill_create_ip>'+
    '<total_fee>'+money+'</total_fee>'+
    '<trade_type>JSAPI</trade_type>'+
    '<sign>'+sign+'</sign>'+'</xml>';
    console.log(tdata);
    var prepay_id;
    wx.request({
      url: 'https://api.mch.weixin.qq.com/pay/unifiedorder',
      method: "POST",
      data: tdata,
      success: res=>{
        console.log(res)
        console.log(res.data)
        var a=res.data.indexOf('<prepay_id><![CDATA[');
        var b=res.data.indexOf(']]></prepay_id>');
        if(a == -1) return;
        prepay_id=res.data.slice(a+20,b);
        console.log(prepay_id);
        //pay
        var myDate=new Date();
        var timeStamp=myDate.getTime().toString();
        var pack="prepay_id="+prepay_id;
        var signType="MD5";
        var stringB="appId="+appId+
            "&nonceStr="+nonceStr+
            "&package="+pack+
            "&signType="+signType+
            "&timeStamp="+timeStamp+
            "&key="+mch_key;
        var paySign=md5(stringB).toUpperCase();
        wx.requestPayment({
          "timeStamp":timeStamp,
          "nonceStr": nonceStr,
          "package": pack,
          "signType": signType,
          "paySign": paySign,
          "success":function(res){
            console.log(res)
          },
          "fail":function(res){
            console.log(res)
          },
          "complete":function(res){
            console.log(res)}
        })
      },
    })
    console.log("last line");
  },
  getTimeStamp(){
    var myDate=new Date();
    var codeStr = myDate.getFullYear();
    var temp = myDate.getMonth()+1;
    if(temp<10) codeStr += "0";
    codeStr += temp;
    temp = myDate.getDate();
    if(temp < 10) codeStr +="0";
    codeStr += temp;
    codeStr += "_";
    codeStr += myDate.getHours();
    temp = myDate.getMinutes();
    if(temp < 10) codeStr += "0";
    codeStr += temp;
    temp = myDate.getSeconds();
    if(temp < 10) codeStr += "0";
    codeStr += temp;
    codeStr += "_";
    temp = myDate.getMilliseconds();
    if(temp < 10) codeStr += "00";
    else if(temp < 100) codeStr += "0";
    codeStr += temp;
    return codeStr;
  },

})

/*
 * JavaScript MD5
 * https://github.com/blueimp/JavaScript-MD5
 *
 * Copyright 2011, Sebastian Tschan
 * https://blueimp.net
 *
 * Licensed under the MIT license:
 * https://opensource.org/licenses/MIT
 *
 * Based on
 * A JavaScript implementation of the RSA Data Security, Inc. MD5 Message
 * Digest Algorithm, as defined in RFC 1321.
 * Version 2.2 Copyright (C) Paul Johnston 1999 - 2009
 * Other contributors: Greg Holt, Andrew Kepert, Ydnar, Lostinet
 * Distributed under the BSD License
 * See http://pajhome.org.uk/crypt/md5 for more info.
 */

/* global define */

    /*
     * Add integers, wrapping at 2^32. This uses 16-bit operations internally
     * to work around bugs in some JS interpreters.
     */
    function safeAdd(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 bitRotateLeft(num, cnt)
    {
        return (num << cnt) | (num >>> (32 - cnt))
    }

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

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

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

    function md5hh(a, b, c, d, x, s, t)
    {
        return md5cmn(b ^ c ^ d, a, b, x, s, t)
    }

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

    /*
     * Calculate the MD5 of an array of little-endian words, and a bit length.
     */
    function binlMD5(x, len)
    {
        /* append padding */
        x[len >> 5] |= 0x80 << (len % 32)
        x[((len + 64) >>> 9 << 4) + 14] = len

        var i
        var olda
        var oldb
        var oldc
        var oldd
        var a = 1732584193
        var b = -271733879
        var c = -1732584194
        var d = 271733878

        for (i = 0; i < x.length; i += 16)
        {
            olda = a
            oldb = b
            oldc = c
            oldd = d

            a = md5ff(a, b, c, d, x[i], 7, - 680876936)
            d = md5ff(d, a, b, c, x[i + 1], 12, - 389564586)
            c = md5ff(c, d, a, b, x[i + 2], 17, 606105819)
            b = md5ff(b, c, d, a, x[i + 3], 22, - 1044525330)
            a = md5ff(a, b, c, d, x[i + 4], 7, - 176418897)
            d = md5ff(d, a, b, c, x[i + 5], 12, 1200080426)
            c = md5ff(c, d, a, b, x[i + 6], 17, - 1473231341)
            b = md5ff(b, c, d, a, x[i + 7], 22, - 45705983)
            a = md5ff(a, b, c, d, x[i + 8], 7, 1770035416)
            d = md5ff(d, a, b, c, x[i + 9], 12, - 1958414417)
            c = md5ff(c, d, a, b, x[i + 10], 17, - 42063)
            b = md5ff(b, c, d, a, x[i + 11], 22, - 1990404162)
            a = md5ff(a, b, c, d, x[i + 12], 7, 1804603682)
            d = md5ff(d, a, b, c, x[i + 13], 12, - 40341101)
            c = md5ff(c, d, a, b, x[i + 14], 17, - 1502002290)
            b = md5ff(b, c, d, a, x[i + 15], 22, 1236535329)

            a = md5gg(a, b, c, d, x[i + 1], 5, - 165796510)
            d = md5gg(d, a, b, c, x[i + 6], 9, - 1069501632)
            c = md5gg(c, d, a, b, x[i + 11], 14, 643717713)
            b = md5gg(b, c, d, a, x[i], 20, - 373897302)
            a = md5gg(a, b, c, d, x[i + 5], 5, - 701558691)
            d = md5gg(d, a, b, c, x[i + 10], 9, 38016083)
            c = md5gg(c, d, a, b, x[i + 15], 14, - 660478335)
            b = md5gg(b, c, d, a, x[i + 4], 20, - 405537848)
            a = md5gg(a, b, c, d, x[i + 9], 5, 568446438)
            d = md5gg(d, a, b, c, x[i + 14], 9, - 1019803690)
            c = md5gg(c, d, a, b, x[i + 3], 14, - 187363961)
            b = md5gg(b, c, d, a, x[i + 8], 20, 1163531501)
            a = md5gg(a, b, c, d, x[i + 13], 5, - 1444681467)
            d = md5gg(d, a, b, c, x[i + 2], 9, - 51403784)
            c = md5gg(c, d, a, b, x[i + 7], 14, 1735328473)
            b = md5gg(b, c, d, a, x[i + 12], 20, - 1926607734)

            a = md5hh(a, b, c, d, x[i + 5], 4, - 378558)
            d = md5hh(d, a, b, c, x[i + 8], 11, - 2022574463)
            c = md5hh(c, d, a, b, x[i + 11], 16, 1839030562)
            b = md5hh(b, c, d, a, x[i + 14], 23, - 35309556)
            a = md5hh(a, b, c, d, x[i + 1], 4, - 1530992060)
            d = md5hh(d, a, b, c, x[i + 4], 11, 1272893353)
            c = md5hh(c, d, a, b, x[i + 7], 16, - 155497632)
            b = md5hh(b, c, d, a, x[i + 10], 23, - 1094730640)
            a = md5hh(a, b, c, d, x[i + 13], 4, 681279174)
            d = md5hh(d, a, b, c, x[i], 11, - 358537222)
            c = md5hh(c, d, a, b, x[i + 3], 16, - 722521979)
            b = md5hh(b, c, d, a, x[i + 6], 23, 76029189)
            a = md5hh(a, b, c, d, x[i + 9], 4, - 640364487)
            d = md5hh(d, a, b, c, x[i + 12], 11, - 421815835)
            c = md5hh(c, d, a, b, x[i + 15], 16, 530742520)
            b = md5hh(b, c, d, a, x[i + 2], 23, - 995338651)

            a = md5ii(a, b, c, d, x[i], 6, - 198630844)
            d = md5ii(d, a, b, c, x[i + 7], 10, 1126891415)
            c = md5ii(c, d, a, b, x[i + 14], 15, - 1416354905)
            b = md5ii(b, c, d, a, x[i + 5], 21, - 57434055)
            a = md5ii(a, b, c, d, x[i + 12], 6, 1700485571)
            d = md5ii(d, a, b, c, x[i + 3], 10, - 1894986606)
            c = md5ii(c, d, a, b, x[i + 10], 15, - 1051523)
            b = md5ii(b, c, d, a, x[i + 1], 21, - 2054922799)
            a = md5ii(a, b, c, d, x[i + 8], 6, 1873313359)
            d = md5ii(d, a, b, c, x[i + 15], 10, - 30611744)
            c = md5ii(c, d, a, b, x[i + 6], 15, - 1560198380)
            b = md5ii(b, c, d, a, x[i + 13], 21, 1309151649)
            a = md5ii(a, b, c, d, x[i + 4], 6, - 145523070)
            d = md5ii(d, a, b, c, x[i + 11], 10, - 1120210379)
            c = md5ii(c, d, a, b, x[i + 2], 15, 718787259)
            b = md5ii(b, c, d, a, x[i + 9], 21, - 343485551)

            a = safeAdd(a, olda)
            b = safeAdd(b, oldb)
            c = safeAdd(c, oldc)
            d = safeAdd(d, oldd)
        }
        return [a, b, c, d]
    }

    /*
     * Convert an array of little-endian words to a string
     */
    function binl2rstr(input)
    {
        var i
        var output = ''
        var length32 = input.length * 32
        for (i = 0; i < length32; i += 8)
        {
            output += String.fromCharCode((input[i >> 5] >>> (i % 32)) & 0xff)
        }
        return output
    }

    /*
     * Convert a raw string to an array of little-endian words
     * Characters >255 have their high-byte silently ignored.
     */
    function rstr2binl(input)
    {
        var i
        var output = []
        output[(input.length >> 2) - 1] = undefined
        for (i = 0; i < output.length; i += 1)
        {
            output[i] = 0
        }
        var length8 = input.length * 8
        for (i = 0; i < length8; i += 8)
        {
            output[i >> 5] |= (input.charCodeAt(i / 8) & 0xff) << (i % 32)
        }
        return output
    }

    /*
     * Calculate the MD5 of a raw string
     */
    function rstrMD5(s)
    {
        return binl2rstr(binlMD5(rstr2binl(s), s.length * 8))
    }

    /*
     * Calculate the HMAC-MD5, of a key and some data (raw strings)
     */
    function rstrHMACMD5(key, data)
    {
        var i
        var bkey = rstr2binl(key)
        var ipad = []
        var opad = []
        var hash
        ipad[15] = opad[15] = undefined
        if (bkey.length > 16)
        {
            bkey = binlMD5(bkey, key.length * 8)
        }
        for (i = 0; i < 16; i += 1)
        {
            ipad[i] = bkey[i] ^ 0x36363636
            opad[i] = bkey[i] ^ 0x5c5c5c5c
        }
        hash = binlMD5(ipad.concat(rstr2binl(data)), 512 + data.length * 8)
        return binl2rstr(binlMD5(opad.concat(hash), 512 + 128))
    }

    /*
     * Convert a raw string to a hex string
     */
    function rstr2hex(input)
    {
        var hexTab = '0123456789abcdef'
        var output = ''
        var x
        var i
        for (i = 0; i < input.length; i += 1)
        {
            x = input.charCodeAt(i)
            output += hexTab.charAt((x >>> 4) & 0x0f) + hexTab.charAt(x & 0x0f)
        }
        return output
    }

    /*
     * Encode a string as utf-8
     */
    function str2rstrUTF8(input)
    {
        return unescape(encodeURIComponent(input))
    }

    /*
     * Take string arguments and return either raw or hex encoded strings
     */
    function rawMD5(s)
    {
        return rstrMD5(str2rstrUTF8(s))
    }

    function hexMD5(s)
    {
        return rstr2hex(rawMD5(s))
    }

    function rawHMACMD5(k, d)
    {
        return rstrHMACMD5(str2rstrUTF8(k), str2rstrUTF8(d))
    }

    function hexHMACMD5(k, d)
    {
        return rstr2hex(rawHMACMD5(k, d))
    }

    function md5(string, key, raw)
    {
        if (!key)
        {
            if (!raw)
            {
                return hexMD5(string)
            }
            return rawMD5(string)
        }
        if (!raw)
        {
            return hexHMACMD5(key, string)
        }
        return rawHMACMD5(key, string)
    }