首先在vue里下載依賴
npm install weixin-jsapi
然后在需要使用的頁面中引入
import wx from 'weixin-jsapi'
//微信支付 wx.config({ debug: false, // 這里一般在測試階段先用ture,等打包給后台的時候就改回false, appId: ost.appId, // 必填,公眾號的唯一標識 timestamp: ost.timeStamp, // 必填,生成簽名的時間戳 nonceStr: ost.nonceStr, // 必填,生成簽名的隨機串 signature: ost.paySign, // 必填,簽名 jsApiList: ["chooseWXPay"], // 必填,需要使用的JS接口列表 }); wx.ready(() => { wx.checkJsApi({ jsApiList: ["chooseWXPay"], success: function(res) { console.log("seccess"); console.log("hskdjskjk", res); }, fail: function(res) { console.log("fail"); console.log(res); }, }); wx.chooseWXPay({
// 這些ost.數據是從后台請求過來的 timestamp: ost.timeStamp, // 支付簽名時間戳,注意微信jssdk中的所有使用timestamp字段均為小寫。但最新版的支付后台生成簽名使用的timeStamp字段名需大寫其中的S字符 nonceStr: ost.nonceStr, // 支付簽名隨機串,不長於 32 位 package: ost.package, // 統一支付接口返回的prepay_id參數值,提交格式如:prepay_id=\*\*\*) signType: ost.signType, // 簽名方式,默認為'SHA1',使用新版支付需傳入'MD5' paySign: ost.paySign, // 支付簽名 success: function(res) { console.log(res, "支付成功的回調"); // 支付成功后的回調函數 // that.getUserRecharge(); }, fail: function(res) { console.log(res, "支付失敗的回調"); that.$public170.dataAlert("支付失敗"); // alert('支付失敗'); // alert(res.errMsg); }, complete: function(res) { //使用支付完成的回調,不代表支付成功 console.log(res, "支付完成"); if (res.errMsg == "getBrandWCPayRequest:ok" ||res.errMsg == "chooseWXPay:ok") //在這里判斷是否支付成功,然后進行支付成功后的操作事件
{ console.log("進入支付刷新"); that.getUserRecharge(); } }, }); });