公众号H5页面接入微信支付

官方示例:

function onBridgeReady(){
   WeixinJSBridge.invoke(
      'getBrandWCPayRequest', {
         "appId":"wx2421b1c4370ec43b",     //公众号名称,由商户传入     
         "timeStamp":"1395712654",         //时间戳,自1970年以来的秒数     
         "nonceStr":"e61463f8efa94090b1f366cccfbbb444", //随机串     
         "package":"prepay_id=u802345jgfjsdfgsdg888",     
         "signType":"MD5",         //微信签名方式:     
         "paySign":"70EA570631E4BB79628FBCA90534C63FF7FADD89" //微信签名 
      },
      function(res){
      if(res.err_msg == "get_brand_wcpay_request:ok" ){
      // 使用以上方式判断前端返回,微信团队郑重提示:
            //res.err_msg将在用户支付成功后返回ok,但并不保证它绝对可靠。
      } 
}); 


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();
}

实际应用也是这样用就可以了,这几个参数需要后台返回来

            const result = JSON.parse(res.data);
            const params = {
              appId: result.data.appId, //公众号名称,由商户传入
              timeStamp: result.data.timestamp, //时间戳,自1970年以来的秒数
              nonceStr: result.data.nonceStr, //随机串
              package: result.data.packAge,
              signType: result.data.signType, //微信签名方式:
              paySign: result.data.paySign, //微信签名
            };
            // 微信支付
            if (typeof WeixinJSBridge == "undefined") {
              if (document.addEventListener) {
                document.addEventListener(
                  "WeixinJSBridgeReady",
                  this.onBridgeReady,
                  false
                );
              } else if (document.attachEvent) {
                document.attachEvent("WeixinJSBridgeReady", this.onBridgeReady);
                document.attachEvent(
                  "onWeixinJSBridgeReady",
                  this.onBridgeReady
                );
              }
            } else {
              this.onBridgeReady(params);
            }





    
    onBridgeReady(params) {
      const _this = this;
      WeixinJSBridge.invoke(
        "getBrandWCPayRequest",
        {
          appId: params.appId, //公众号名称,由商户传入
          timeStamp: params.timeStamp, //时间戳,自1970年以来的秒数
          nonceStr: params.nonceStr, //随机串
          package: params.package,
          signType: params.signType, //微信签名方式:
          paySign: params.paySign, //微信签名
        },
        function (res) {
          if (res.err_msg == "get_brand_wcpay_request:ok") {
            // 使用以上方式判断前端返回,微信团队郑重提示:
            //res.err_msg将在用户支付成功后返回ok,但并不保证它绝对可靠。
            _this.$router.push("/success");
          }
        }
      );
    },

就是这么简单了

猜你喜欢

转载自blog.csdn.net/joyvonlee/article/details/108149594