1. 程式人生 > 實用技巧 >微信內h5呼叫支付

微信內h5呼叫支付

在做公眾號商城的時候,需要用到呼叫微信支付,這是微信官方文件教程

https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=7_7&index=6,詳細描述了怎麼調起微信支付,以下程式碼是我的實際業務呼叫微信支付完整流程

到訂單頁面點選提交訂單按鈕,此時點選事件先向後臺發個請求,公司的後端人員通過程式碼去對接微信的系統,生成一個預訂單,然後返回一個prepay_id,具體可以看官方文件裡邊的業務流程圖。在我們剛才向介面傳送請求以後,後端會把資訊返回給我們,包括appId、timeStamp、nonceStr、package、signType這個值。這些值都是我們調起微信支付必須的。

程式碼如下:

            this.getFetch("公司後端提供的介面", data).then(res => {
              if (res.data.code * 1 === 1) {
                function onBridgeReady() {
                  WeixinJSBridge.invoke(
                    "getBrandWCPayRequest", {
                      appId: res.data.data.jsApiId, //公眾號名稱,由商戶傳入
timeStamp:res.data.data.timestamp, //時間戳,自1970年以來的秒數 nonceStr: res.data.data.nonceStr, //隨機串 package: res.data.data.package, signType: res.data.data.signType, //微信簽名方式: paySign: res.data.data.paySign //
微信簽名 }, wxResponse => { if (wxResponse.err_msg == "get_brand_wcpay_request:ok") { window.location.href = window.location.origin + "/couponPaySuccess?ordernum=" + res.data.data.id; } if (wxResponse.err_msg == "get_brand_wcpay_request:fail") { _this.$toast("支付失敗"); } if (wxResponse.err_msg == "get_brand_wcpay_request:cancel") { _this.$toast("支付取消"); } } ); } if (typeof WeixinJSBridge == "undefined") { if (document.addEventListener) { document.addEventListener( "WeixinJSBridgeReady", onBridgeReady, false ); } else if (document.attachEvent) { document.attachEvent("WeixinJSBridgeReady", onBridgeReady); document.attachEvent( "onWeixinJSBridgeReady", onBridgeReady ); } } else { onBridgeReady(); } } else if (res.data.code * 1 === -1) { this.autoLogin(); } else { this.$toast(res.data.msg); this.wxBtn=true; } });