微信支付小程序版


近日,因工作需要開始研究在小程序上面實現微信支付功能,經過自己研究加上參考網上前輩的部分代碼,終於實現了。期間遇到過很多坑,故在此筆記供自己和有需要的朋友參考。

開發環境:  微信小程序+nodejs(eggjs框架)

參數准備:  微信商戶平台申請支付功能,獲得商戶ID(商戶號)、商戶key(API KEY)、獲得openId、Appsecret()AppSecret是APPID對應的接口密碼)

請求流程:  

      1. 小程序調用wx.request請求到后台(含一些支付信息,如金額、交易名稱等)

      2.后台在收到前台小程序請求后,按微信支付開發文檔的要求進行拼接,然后調用統一下單API發送請求到微信獲取簽名(這個簽名個人理解主要是為了驗證報文信息是否被篡改)

      3.連同生成的簽名及一些重要信息在后台加密后生成一個簽名(后文稱第二次簽名),連同第二次簽名已經信息返回給 1 中的小程序request請求。

      4.小程序前台收到返回的成功信息后,調用API wx.requestPayment發送請求,成功后會條用微信的支付,讓輸入密碼。(開發環境會生成一個二維碼,然開發者微信掃描后才會調用微信支付輸入密碼界面),最后更新請求結果反饋給頁面。

跳坑指南:

    兩次簽名時候都需要輸入小程序ID(appId),但是兩次簽名參數中小程序ID變量名不一樣,第一次是全部小寫,第二次是第二個單詞的首字母大寫appId。如此處寫錯,會提示“支付驗證簽名失敗”{因為簽名的目的就是為了驗證信息是否被篡改,此處變量名稱變了,自然就對不上了}

以下為代碼,供參考:(為了測試,交易金額信息直接在后台寫死了)

  //小程序前台事件函數  xx.js
  wxPay:function(){
    //發送請求到后台,獲取prepay_id
    console.log("&&&&&", app.gData.userInfo.openId);
    wx.request({
      url: app.gData.iServerUrl + '/getPrepayId',
      method: 'GET',
      data: { openId: app.gData.userInfo.openId},
      header: { 'content-type': 'application/json' },
      success: function (res) {
        console.log("payment:",res);
        if (res.data.status == 100) {
          var payModel = res.data;
          wx.requestPayment({
            'timeStamp': payModel.timestamp,
            'nonceStr': payModel.nonceStr,
            'package': payModel.package,
            'signType': 'MD5',
            'paySign': payModel.paySign,
            success: function (res) {
              console.log("success+++",res);
              wx.showToast({
                title: '支付成功',
                icon: 'success',
                duration: 2000
              })
            },
            fail: function (res) {
              console.log("fail+++", res);
            }
          })
        }
      }
    })

  }

  

 

//后台eggjs  xxservice.js 中的方法   

 async getPrepayId(parm) {

            var {ctx,res }= this;

            var openid = parm.openId;
            var str = app.config.getWxPayOrdrID();
            var spbill_create_ip = '192.168.3.11'//ctx.header.host.replace(/::ffff:/, ''); // 獲取客戶端ip
            var body = '測試支付'; // 商品描述
            var notify_url = 'https://localhost:7001/api/v1/getPrepayId' // 支付成功的回調地址  可訪問 不帶參數
            var nonce_str = str; // 隨機字符串
            var out_trade_no = str; // 商戶訂單號
            var total_fee = '1'; // 訂單價格 單位是 分
            var timestamp = Math.round(new Date().getTime()/1000); // 當前時間
            console.log("nonce_str",str);
            var ret ={
                appid:app.config.wx.appid,
                mch_id:app.config.wx.Mch_id,
                nonce_str:nonce_str,
                body:body,
                out_trade_no:out_trade_no,
                total_fee:total_fee,
                spbill_create_ip:spbill_create_ip,
                notify_url:notify_url,
                openid:openid,
                trade_type: 'JSAPI',
                key:app.config.wx.Mch_key
            }

            // 簽名
            var sign = paysign.paysignjsapi(ret);
            var bodyData = '<xml>';
            bodyData += '<appid>' + app.config.wx.appid + '</appid>';  // 小程序ID
            bodyData += '<body>' + body + '</body>'; // 商品描述
            bodyData += '<mch_id>' + app.config.wx.Mch_id + '</mch_id>'; // 商戶號
            bodyData += '<nonce_str>' + nonce_str + '</nonce_str>'; // 隨機字符串
            bodyData += '<notify_url>' + notify_url + '</notify_url>'; // 支付成功的回調地址
            bodyData += '<openid>' + openid + '</openid>'; // 用戶標識
            bodyData += '<out_trade_no>' + out_trade_no + '</out_trade_no>'; // 商戶訂單號
            bodyData += '<spbill_create_ip>' + spbill_create_ip + '</spbill_create_ip>'; // 終端IP
            bodyData += '<total_fee>' + total_fee + '</total_fee>'; // 總金額 單位為分
            bodyData += '<trade_type>JSAPI</trade_type>'; // 交易類型 小程序取值如下:JSAPI
            bodyData += '<sign>' + sign + '</sign>';
            bodyData += '</xml>';

            // 微信小程序統一下單接口
            var returnValue = {};
            var urlStr = 'https://api.mch.weixin.qq.com/pay/unifiedorder';

            const rst = await ctx.curl(urlStr, {
                // 必須指定 method
                method: 'POST',
                data: bodyData

            });

            let signBody = rst.data.toString();
            if (!rst.error && rst.status == 200) {
                        console.log("test1 &&&&");
                        parseString(signBody, function (err, result) {
                            if (result.xml.return_code[0] == 'SUCCESS') {
                                returnValue.msg = '操作成功';
                                returnValue.status = '100';
                                returnValue.out_trade_no = out_trade_no;  // 商戶訂單號
                                // 小程序 客戶端支付需要 nonceStr,timestamp,package,paySign  這四個參數
                                returnValue.nonceStr = result.xml.nonce_str[0]; // 隨機字符串
                                returnValue.timestamp = timestamp.toString(); // 時間戳
                                returnValue.package = 'prepay_id=' + result.xml.prepay_id[0]; // 統一下單接口返回的 prepay_id 參數值
                                var wxSign = {
                                    appId: app.config.wx.appid,    //小程序ID
                                    nonceStr: returnValue.nonceStr,  //隨機串
                                    package: returnValue.package,   //數據包
                                    signType: 'MD5',    //簽名方式
                                    timeStamp: returnValue.timestamp, //時間戳
                                    key:app.config.wx.Mch_key
                                }
                                returnValue.paySign = paysign.paysignjsapi(wxSign); // 簽名
                            } else{
                                returnValue.msg = result.xml.return_msg[0];
                                returnValue.status = '102';
                            }
                        });
                    }

            return returnValue;
        }

  

//自己寫的拼報文及md5加密,兩次生成簽名時都會調用,所有寫成了一個獨立的方法   paysign.js
'use strict'; const crypto = require('crypto'); //const request = require('axios'); function paysignjsapi(params) { let param = params; var key=''; var ret ={}; // console.log("param.key",param.key); if(param.key){ key = param.key; delete param.key; ret = param; }else{ ret = param; } var str = raw(ret); //將參數拼接成字符串 str = str + '&key='+key; console.log("MD5Str:",str); var md5Str = crypto.createHash('md5').update(str).digest('hex'); md5Str = md5Str.toUpperCase(); ; return md5Str; }; //字符排序連接 function raw(args) { var keys = Object.keys(args); keys = keys.sort(); var newArgs = {}; keys.forEach(function(key) { // newArgs[key.toLowerCase()] = args[key]; newArgs[key] = args[key]; }); var str = ''; for(var k in newArgs) { str += '&' + k + '=' + newArgs[k]; } str = str.substr(1); return str; }; module.exports={ paysignjsapi }

  


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM