node+vue.js實現微信支付(沙箱)完整版,親測可用

時間 2021-03-13

標籤 javascript 前端 java segmentfault api promise 微信 app post 微信支付欄目 JavaScript 简体版

原文原文鏈接

網上不少資料文檔都是殘次不全的,沒幾個真正有用的，我這記錄下可用的實現方式javascript

微信的沙箱的區別就是在正常的全部api前面加一個sandboxnew。前端

demo 請狠狠的戳這裏 https://download.lllomh.com/cliect/#/product/J302779150521235java

支付寶支付請用力點這裏 https://segmentfault.com/a/1190000039370713?_ea=110506795segmentfault

1，事前準備

這裏的商戶必需要跟商戶綁定過才行,否則會報錯,api

1.1獲取沙箱祕鑰

function getKey(){
    //首先拿到前端傳過來的參數
    let orderCode = 'xy16143316973304295';
    let money     = 1.01;

    //首先生成簽名sign
    let mch_id = mchid;
    let nonce_str = wxpay.createNonceStr();
    let timestamp = wxpay.createTimeStamp();
    let body = '微信支付';
    let out_trade_no = orderCode;
    let total_fee = wxpay.getmoney(money);
    let spbill_create_ip = '49.235.115.11';//終端ip
    let notify_url = wxurl;
    let trade_type = 'NATIVE';
    let sign = wxpay.paysignjsapi(appid,body,mch_id,nonce_str,notify_url,out_trade_no,spbill_create_ip,total_fee,trade_type,mchkey);mchkey// 祕鑰要是正式的祕鑰才能夠獲取
    //組裝xml數據
    var formData  = "<xml>";
    formData  += "<appid>"+appid+"</appid>";  //appid
    formData  += "<body><![CDATA["+"微信支付"+"]]></body>";
    formData  += "<mch_id>"+mch_id+"</mch_id>";  //商戶號
    formData  += "<nonce_str>"+nonce_str+"</nonce_str>"; //隨機字符串，不長於32位。
    formData  += "<notify_url>"+notify_url+"</notify_url>";
    formData  += "<out_trade_no>"+out_trade_no+"</out_trade_no>";
    formData  += "<spbill_create_ip>"+spbill_create_ip+"</spbill_create_ip>";
    formData  += "<total_fee>"+total_fee+"</total_fee>";
    formData  += "<trade_type>"+trade_type+"</trade_type>";
    formData  += "<sign>"+sign+"</sign>";
    formData  += "</xml>";
    let promise = new Promise(function(resolve, reject) {
        let urls = "https://api.mch.weixin.qq.com/sandboxnew/pay/getsignkey"
        request({url:urls,method:'POST',body: formData},function(err,response,body){
            if(!err && response.statusCode == 200){
                xmlreader.read(body.toString("utf-8"), function (errors, response) {
                    var sandbox_signkey = response.xml.sandbox_signkey.text()
                    resolve(sandbox_signkey)
                });
            }
        })
    });
    return promise
}

2,封裝方法

function wxpPys(sorder,smoney) {
    //首先拿到前端傳過來的參數
    let orderCode = sorder;
    let money = smoney;

    //首先生成簽名sign
    let mch_id = wechatConfig.mchid;
    let appid = wechatConfig.appid;
    let mchkey = wechatConfig.mchkey;
    let nonce_str = wxpay.createNonceStr();
    let timestamp = wxpay.createTimeStamp();
    let body = '微信支付';
    let out_trade_no = orderCode;
    let total_fee = wxpay.getmoney(money);
    let spbill_create_ip = '49.235.115.11';//終端ip
    let notify_url = wechatConfig.wxurl;
    let trade_type = 'NATIVE';
    let sign = wxpay.paysignjsapi(appid,body,mch_id,nonce_str,notify_url,out_trade_no,spbill_create_ip,total_fee,trade_type,mchkey);
    //組裝xml數據
    let formData  = "<xml>";
    formData  += "<appid>"+appid+"</appid>";  //appid
    formData  += "<body><![CDATA["+"微信支付"+"]]></body>";
    formData  += "<mch_id>"+mch_id+"</mch_id>";  //商戶號
    formData  += "<nonce_str>"+nonce_str+"</nonce_str>"; //隨機字符串，不長於32位。
    formData  += "<notify_url>"+notify_url+"</notify_url>";
    formData  += "<out_trade_no>"+out_trade_no+"</out_trade_no>";
    formData  += "<spbill_create_ip>"+spbill_create_ip+"</spbill_create_ip>";
    formData  += "<total_fee>"+total_fee+"</total_fee>";
    formData  += "<trade_type>"+trade_type+"</trade_type>";
    formData  += "<sign>"+sign+"</sign>";
    formData  += "</xml>";
    var url = 'https://api.mch.weixin.qq.com/sandboxnew/pay/unifiedorder';
    let promise = new Promise(function(resolve, reject) {
        request({url:url,method:'POST',body: formData},function(err,response,body){
            if(!err && response.statusCode == 200){
                console.log(body);
                xmlreader.read(body.toString("utf-8"), function (errors, response) {
                    console.log(response.xml)
                    var code_url = response.xml.code_url.text();
                    resolve(code_url)
                });
            }
        })
    });
    return promise
}

3,接口定義

/**
 * 添加購物車支付微信 */
router.post('/api/member/payOrder', (req, res) => {

    let orderId=req.body.orderId
    let reuct =  new wxpPys(orderId,1.01)
    reuct.then(response=>{
        res.send(
            {
                "success": true,
                "message": "success",
                "code": 200,
                "timestamp": (new Date()).getTime(),
                "result": response
            }
        )
    })

})

查詢訂單:promise

/**
 * 添加購物車提交訂單微信支付後查詢訂單狀態是否成功 */
router.post('/api/member/queryOrderWechat', (req, res) => {
    let orderId=req.body.orderId
    let reuct =  new queryOrder(orderId,1.01)
    reuct.then(response=>{

        console.log(response)

        res.send(
            {
                "success": true,
                "message": "success",
                "code": 200,
                "timestamp": (new Date()).getTime(),
                "result": response
            }
        )
    })
})

這裏要強調沙箱版是不須要掃碼的,等於彈出微信自動掃碼支付了,直接看結果就行!微信

正式的時候就把全部連接中的sandboxnew去掉就行 app