- npm下载
npm i weixin-jsapi
- 在组件中引用
import wx from "weixin-jsapi"
第一个请求验证支付页面路径
第二个请求拿到后台返回支付签名等拉取微信支付
this.$axios({
url: "/pay/preScan",
method: "post",
params: {
deviceId: sessionStorage.getItem("equId"),
url: window.location.href.split("?")[0]
}
}).then(res => {
var data = res.data.data;
this.$axios({
url: "/pay/wxPay",
method: "get",
params: {
deviceId: sessionStorage.getItem("equId"),
driverNums: driverNums.toString(),
channelIds: driverNums.toString(),
openId: sessionStorage.getItem("openId"),
countMoney: "1"
}
}).then(res1 => {
wx.config({
debug: false, //这里一般在测试阶段先用ture，等打包给后台的时候就改回false,
appId: data.appId,
timestamp: data.timestamp,
nonceStr: data.nonceStr,
signature: data.sign,
jsApiList: ["chooseWXPay"]
});
wx.ready(() => {
this.flag = true;
wx.chooseWXPay({
timestamp: res1.data.timeStamp, // 支付签名时间戳，注意微信jssdk中的所有使用timestamp字段均为小写。但最新版的支付后台生成签名使用的timeStamp字段名需大写其中的S字符
nonceStr: res1.data.nonceStr, // 支付签名随机串，不长于 32 位
package: res1.data.package, // 统一支付接口返回的prepay_id参数值，提交格式如：prepay_id=\*\*\*）
signType: "MD5", // 签名方式，默认为'SHA1'，使用新版支付需传入'MD5'
paySign: res1.data.paySign, // 支付签名
success: function(res) {
alert("成功");
},
cancel: function(res) {
alert("已取消支付");
}
});
});
});
});
