关于微信支付与支付宝支付前端这块二码合一的方法记录

第一步判断浏览器

if (/MicroMessenger/.test(window.navigator.userAgent)) {

this.browserType = 1; //这里是微信浏览器

} else if (/AlipayClient/.test(window.navigator.userAgent)) {

this.browserType = 2;//这里是支付宝

 

} else {

this.browserType = 3;

this.$dialog.notify({

mes: "请您使用微信或支付宝扫码",

timeout: 2000,

callback: () => {}

});

return;

}

第二步 

 针对不同的浏览器 使用不同的唤醒方式

1.微信唤醒,数据计算为了安全都放在后台

function onBridgeReady(){
WeixinJSBridge.invoke(
'getBrandWCPayRequest', {
"appId":"wxef36f2b018cbe7bc",//公众号名称，由商户传入
"timeStamp":"1514516640", //时间戳，自1970年以来的秒数
"nonceStr":"piebSggAS99bDNMj", //随机串
"package":"prepay_id=wx201712291103585aecc31a000076831289",
"signType":"MD5", //微信签名方式：
"paySign":"2879CA1DA8F74A65742FEA8D5936AEEA" //微信签名
},
function(res){
// if(res.err_msg == "get_brand_wcpay_request:ok" ) {
// } // 使用以上方式判断前端返回,微信团队郑重提示：res.err_msg将在用户支付成功后返回 ok，但并不保证它绝对可靠。
location.href = "myOrder.html";
}
);
}
if (typeof WeixinJSBridge == "undefined"){
if( document.addEventListener ){
document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);
}else if (document.attachEvent){
document.attachEvent('WeixinJSBridgeReady', onBridgeReady);
document.attachEvent('onWeixinJSBridgeReady', onBridgeReady);
}
}else{
onBridgeReady();
}

返回的是上面数据 

eval(data.data)

 

2.支付宝唤醒,我这里用的是表单的方式

 

if (response.data.code == 0) {

// alert(response.data.data)

 

this.$refs.pay.innerHTML=response.data.data

document.querySelector(".pay form").submit()

// eval(response.data.data);

} else {