支付很簡單,但每次都是在網上直接扒下來使用,老年人記憶,于是就自己記錄一下,方便以后快速的粘貼復制;
第一步 :VUE 需要安裝 微信支付模塊
// npm install weixin-js-sdk import wx from "weixin-js-sdk";
第二步 封裝 微信支付方法
wexinPay(data, cb, errorCb) {
//獲取后臺傳入的數據
let AppId = data.appId;
let timestamp = data.timeStamp;
let nonceStr = data.nonceStr;
let signature = data.signature;
let packages = data.package;
let paySign = data.paySign;
let signType = data.signType;
console.log('發起微信支付')
//下面要發起微信支付了
wx.config({
debug: false, // 開啟調試模式,調用的所有api的返回值會在客戶端alert出來，若要查看傳入的參數，可以在pc端打開，參數信息會通過log打出，僅在pc端時才會打印。
appId: appId, // 必填，公眾號的唯一標識
timestamp: timestamp, // 必填，生成簽名的時間戳
nonceStr: nonceStr, // 必填，生成簽名的隨機串
signature: signature, // 必填，簽名，見附錄1
jsApiList: ['chooseWXPay'] // 必填，需要使用的JS接口列表，所有JS接口列表見附錄2
});
wx.ready(function () {
wx.chooseWXPay({
timestamp: timestamp, // 支付簽名時間戳，注意微信jssdk中的所有使用timestamp字段均為小寫。但最新版的支付后臺生成簽名使用的timeStamp字段名需大寫其中的S字符
nonceStr: nonceStr, // 支付簽名隨機串，不長于 32 位
package: packages, // 統一支付接口返回的prepay_id參數值，提交格式如：prepay_id=***）
signType: signType, // 簽名方式，默認為'SHA1'，使用新版支付需傳入'MD5'
paySign: paySign, // 支付簽名
success: function (res) {
// 支付成功后的回調函數
cb(res);
},
fail: function (res) {
//失敗回調函數
errorCb(res);
}
});
});
wx.error(function (res) {
// config信息驗證失敗會執行error函數，如簽名過期導致驗證失敗，具體錯誤信息可以打開config的debug模式查看，也可以在返回的res參數中查看，對于SPA可以在這里更新簽名。
/*alert("config信息驗證失敗");*/
});
}
第三步 向后臺請求數據 成功獲取 轉入微信支付方法 調起 微信支付
//請求后臺接口獲取數據 準備進行微信支付
that.axIOS.post("user/recommend", data).then(res => {
//成功狀態下
if (res.data.status) {
// 存儲微信支付數據data
let data = res.data.data;
console.log("即將跳轉微信支付");
//函數為分裝過得 (就是調用微信支付)
http.wexinPay(
{
appId: data.appId,
nonceStr: data.nonceStr,
package: data.package,
paySign: data.paySign,
signType: data.signType,
timeStamp: data.timeStamp
},
//成功回調函數
res => {
that.$router.push({ path: "/vip" });
}
);
}
else {
that.$message.error(res.data.message);
}
});
