h5调用微信支付宝扫描支付

我们都知道微信浏览器里面如果调用扫描支付都需要签名才能调用成功,支付宝浏览器调用的就是只需要调用接口就可以 通过JSBridge也可以调用扫描支付。 支付宝扫描支付是最简单的 支付宝扫描

      AlipayJSBridge.call(
      'scan',
      {
        type: 'qr', // 扫描类型  qr 二维码  / bar 条形码
        // actionType: "scanAndRoute",// 如果只是扫码,拿到码中的内容，这项不用设置都可以
      },
      (res) => {
        // alert(JSON.stringify(res));
        if (res.error == 10) {
          // 错误码为10：用户取消操作
          Toast('取消操作')
        } else if (res.error == 11) {
          // 错误码为11：扫码失败
          Toast('网络异常，请重试')
        } else {
          // res.codeContent为扫码返回的结果
          window.location.replace(res.codeContent)
        }
      },)

直接调用接口'scan'就可以扫描 支付宝支付

 AlipayJSBridge.call("tradePay", {
    // tradeNO: "2020111422001434251423057464"
    tradeNO: payInfo.trade_no
}, function (data) {
    console.log(data)
    //log(JSON.stringify(data));
if(data.resultCode!=9000){
    //支付失败
    that.isShowErr('您已取消支付，请重新支付')
  //   alert(data.resultCode+"："+data.memo);
}else{
  that.isShowSuccess('支付成功', 0, () => {
    if (callBack) {
      callBack()
    } else {
      if (isRedirect) {
        url &&
          uni.redirectTo({
            url,
          })
      } else {
        url &&
          uni.navigateTo({
            url,
          })
      }
    }
  })
    //支付成功
}

只需要调用tradePay 传递参数小程序返回的trade_no就可以了 微信就比较麻烦 扫描是最费劲的都知道需要后端配合前端传递url后端生成签名字段前端注册和调用扫描。 微信扫描

     let uri =location.href.split('#')[0]
    // let uri = this.vUrl
    let data = {
      url: uri,
    }
    let that = this
getJsSign(data)
      .then((res) => {
        wx.config({
          debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
          appId: res.appId, // 必填，公众号的唯一标识
          timestamp: res.timestamp, // 必填，生成签名的时间戳
          nonceStr: res.nonceStr, // 必填，生成签名的随机串
          signature: res.signature, // 必填，签名
          jsApiList: ['scanQRCode'], // 必填，需要使用的JS接口列表, 这里只需要调用扫一扫
        })
        wx.ready(function () {
          wx.scanQRCode({
            needResult: 1, // 默认为0，扫描结果由微信处理，1则直接返回扫描结果，
            scanType: ['qrCode', 'barCode'], // 可以指定扫二维码还是一维码，默认二者都有
            success: function (res) {
              // 扫码成功，跳转到二维码指定页面（res.resultStr为扫码返回的结果）
              // window.location.replace(res.resultStr);
              setTimeout(() => {
                window.location.replace(res.resultStr)
              }, 20)
            },
          })
        })
      })

微信支付 WeixinJSBridge.invoke

    WeixinJSBridge.invoke(
    'getBrandWCPayRequest',
    {
      appId: that.vAppId, //公众号ID，由商户传入
      timeStamp: payInfo.timeStamp, //时间戳，自1970年以来的秒数
      nonceStr: payInfo.nonceStr, //随机串
      package: payInfo.package,
      signType: payInfo.signType, //微信签名方式：
      paySign: payInfo.paySign, //微信签名
    },
    function (res) {
      if (res.err_msg == 'get_brand_wcpay_request:ok') {
        console.log('支付成功', res)
        // 使用以上方式判断前端返回,微信团队郑重提示：
        //res.err_msg将在用户支付成功后返回ok，但并不保证它绝对可靠。
        that.isShowSuccess('支付成功', 0, () => {
          if (callBack) {
            callBack()
          } else {
            if (isRedirect) {
              url &&
                uni.redirectTo({
                  url,
                })
            } else {
              url &&
                uni.navigateTo({
                  url,
                })
            }
          }
        })
      } else {
        console.log('支付失败', res.err_msg)
        that.isShowErr('您已取消支付，请重新支付')
      }
    },
  )

注意的是，真机运行， wx.config()微信调试工具返回ok就算可以扫描了，他会返回# scan resultstr is here,