let WeChatPay = function() {
// 2、引入js后、获取公众号校验信息
let timestamp = '',
nonceStr = '',
signature = '';
let v = {
// 用于换取微信校验信息的参数:要求不可以包含 “#” 号
url: location.split('#')[0]
};
// 3、通过config接口注入权限验证配置(需要同步进行,在获取到校验信息后方可注入config,否则校验失败!)
wx.config({
debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
appId: '', // 必填,公众号的唯一标识
timestamp: , // 必填,生成签名的时间戳
nonceStr: '', // 必填,生成签名的随机串
signature: '', // 必填,签名
jsApiList: ["checkJsApi", "chooseWXPay", "updateAppMessageShareData", "updateTimelineShareData"] // 必填,需要使用的JS接口列表
});
axios.post('/wx/pay/orderPay_XXXX', data).then(res => {
// 支付成功状态
if (res.code == 200) {
// 获取支付必备的参数
let {
nonceStr,
package,
signType,
paySign
} = res.data;
// 4、通过ready接口处理成功验证
wx.ready(function() {
/* 微信支付 */
wx.chooseWXPay({
timestamp: 0, // 支付签名时间戳,注意微信jssdk中的所有使用timestamp字段均为小写。但最新版的支付后台生成签名使用的timeStamp字段名需大写其中的S字符
nonceStr: nonceStr, // 支付签名随机串,不长于 32 位
package: package, // 统一支付接口返回的prepay_id参数值,提交格式如:prepay_id=\*\*\*)
signType: signType, // 签名方式,默认为'SHA1',使用新版支付需传入'MD5'
paySign: paySign, // 支付签名
success: function(res) {
// 前端判断返回方式,微信团队郑重提示:不保证绝对可靠,切记!
if (res.errMsg == 'chooseWXPay:ok') {
// 【支付成功】
} else if (res.errMsg == 'chooseWXPay:cancel') {
// 【支付取消】:用户取消支付不会进入这个判断,而是进入complate和cancel函数
} else {
}
},
complete: function(res) {
// 接口调用完成时执行的回调函数,无论成功或失败都会执行
if (res.errMsg == 'chooseWXPay:ok') {
// 【支付成功】:支付成功提示页面,点击完成按钮之后
wx.closeWindow(); /* 关闭微信窗口,调用时需要在config中进行校验 */
} else if (res.errMsg == 'chooseWXPay:cancel') {
// 【支付取消】
} else {
}
/**
* iOS和Android支付成功点击“完成”后都会进入success和complete函数,都返回'chooseWXPay:ok'
* (也有人说Android支付成功不进入success函数,)
* 原因是【iOS和Android返回数据不同。支付成功后Android返回 {"errMsg":"getBrandWCPayRequest:ok"},iOS返回{"err_Info":"success","errMsg":"chooseWXPay:ok"},故Android找不到success方法,导致失败】
* */
},
fail: function(err) {
// 接口调用失败
},
cancel: function(err) {
// 用户点击取消时的回调函数:用户取消支付后实际上进入cancel 和 complate函数
}
});
});
}
}).catch(err => {
console.log('支付失败:', err);
});
}