h5移動端調用支付寶、微信支付的實現

2024-09-05 07:23:33

字體：大中小

來源：轉載

供稿：網友

公司項目之前已有支付寶支付，現要求增加微信支付，第一次做，摸著石頭過河！結果是滿意的。
廢話就不說了直接上代碼：

var aliChannel = null;     var wxChannel = null;    // 定義支付方式切換     var state_type = 1;    // 選擇支付方式  默認為支付寶樣式    $(".zfb").find("i").css("background-Image","url(../img/pl_8.png)");    $(".pay").on("singleTap",".pay_c",function(){        $(this).find("i").css("background-Image","url(../img/pl_8.png)");        $(this).siblings().find("i").css("background-Image","url(../img/pl_9.png)");        if($(this).find("span").text().trim() == "支付寶"){            state_type = 1;        }else if($(this).find("span").text().trim() == "微信"){            state_type = 2;        }    })    // 點擊支付    $('.pay_btn').unbind();    $('.pay_btn').singleTap(function () {        if(state_type == 1){            // 支付寶通道            mui.plusReady(function () { // 獲取支付通道                  plus.payment.getChannels(function (channels) {                    for (var i in channels) {                        if (channels[i].id == "wxpay") {                            wxChannel = channels[i];                        } else {                            aliChannel = channels[i];                        }                    }                }, function (e) {                    alert("獲取支付通道失敗：" + e.message);                });            })            mui.post('此處填寫支付接口', {               '此處填寫所需參數'            },            function (data) {                console.log(JSON.stringify(data));                if (data) {                    data = data.data.payStr;                    plus.payment.request(aliChannel, data, function (result) {                                                    // 支付成功處理                                           }, function (e) {                        floatRemind("付費失敗，用戶已取消");                    });                } else {                    plus.nativeUI.alert("支付失敗");                }            });        }else if(state_type == 2){            // 微信通道            mui.plusReady(function () { // 獲取支付通道                  plus.payment.getChannels(function (channels) {                    for (var i in channels) {                        if (channels[i].id == "wxpay") {                            wxChannel = channels[i];                        } else {                            aliChannel = channels[i];                         }                    }                }, function (e) {                    alert("獲取支付通道失敗：" + e.message);                });            })            mui.post('此處填寫支付接口', {                '此處填寫所需參數'            },                function (data) {                    data = JSON.stringify(data.data);                    if (data) {                        plus.payment.request(wxChannel, data, function (result) {                                                            // 支付成功處理                                                   }, function (msg) {                            // JSON.stringify(msg.message)                            floatRemind('支付失敗');                        });                    } else {                        plus.nativeUI.alert("支付失敗");                    }                });        }                    })

自己已經用過了，沒有問題，支付寶可以真機調試，微信必須打包下載測試。

測試過程中有過報錯-100，百度各種解決方法，后來發現不是前端問題，有人說打包必須選自有證書，自己試過了不需要，公用證書就可以的。