<div :class="pay sele" @click="accreditWeChat()"><p>微信支付</p></div> 第一步 微信用戶授權(quán)獲取code:accreditWeChat() {//授權(quán)后 回調(diào)地址轉(zhuǎn)碼let url = urlencode(window.location.href);if (判斷頁(yè)面URL上面有沒(méi)有code參數(shù)) {//沒(méi)有code即說(shuō)明用戶未授權(quán) 引導(dǎo)授權(quán)window.location.href = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${this.encryParams.appId}&redirect_uri=${url}&response_type=code&scope=snsapi_userinfo&state=123#wechat_redirect`;} else {console.log("已經(jīng)獲得code 獲取jsapi調(diào)用彈窗的參數(shù)");this.sendAxios(參數(shù));}}, 第二步 獲取jsapi調(diào)用彈窗的參數(shù)(因?yàn)閰?shù) 這里是在后端提供的 要發(fā)請(qǐng)求):sendAxios(參數(shù)) {axios({method:'get',url:'接口',params:參數(shù),}).then(res => {if (res.data.status == 0 ) {//第三調(diào)起判斷this.TunedUp(res.data.params);} else {console.log("請(qǐng)求失敗", res);}});}, 第三步 判斷是否為微信環(huán)境調(diào)起支付彈窗:TunedUp(params) {// 支付只能在微信內(nèi)置瀏覽器才有效果,在其他瀏覽器里面是無(wú)效的，進(jìn)行判斷if (typeof WeixinJSBridge == "undefined") {console.log("請(qǐng)?jiān)谖⑿趴蛻舳舜蜷_(kāi)");if (document.addEventListener) {document.addEventListener("WeixinJSBridgeReady",this.onBridgeReady(params),false);} else if (document.attachEvent) {document.attachEvent("WeixinJSBridgeReady",this.onBridgeReady(params));document.attachEvent("onWeixinJSBridgeReady",this.onBridgeReady(params));}} else {this.onBridgeReady(params);}}, 第四步支付彈窗onBridgeReady(params) {let that = this;WeixinJSBridge.invoke("getBrandWCPayRequest",{appId: params.weixinAppId, //公眾號(hào)ID，由商戶傳入timeStamp: params.weixinTimestamp, //時(shí)間戳，自1970年以來(lái)的秒數(shù)nonceStr: params.weixinNonceStr, //隨機(jī)串package: params.weixinPackage,signType: params.weixinSignType, //微信簽名方式：paySign: params.weixinSign //微信簽名},function(res) {if (res.err_msg == "get_brand_wcpay_request:ok") {// 使用以上方式判斷前端返回,微信團(tuán)隊(duì)鄭重提示：//res.err_msg將在用戶支付成功后返回ok，但并不保證它絕對(duì)可靠。that.$alertMsg("支付成功");console.log("支付成功");} else {that.$alertMsg("支付取消");console.log("支付取消");}});}

總結(jié)

以上是生活随笔為你收集整理的H5微信jsapi支付流程的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。