微信JSAPI支付方式与错误(当前页面的URL未注册,支付验证签名失败)

微信JSAPI支付文档

前端调用JSAPI支付有两种方法

方法一:

  wx.chooseWXPay({
      // 支付签名时间戳，注意微信jssdk中的所有使用timestamp字段均为小写。但最新版的支付后台生成签名使用的timeStamp字段名需大写其中的S字符
      timestamp: timestamp.toString(),
      // 支付签名随机串，不长于 32 位
      nonceStr: nonce_str,
      // 统一支付接口返回的prepay_id参数值，提交格式如：prepay_id=\*\*\*）
      package: package,
      // 签名方式，默认为'SHA1'，使用新版支付需传入'MD5'
      signType: "MD5",
      // 支付签名
      paySign: pay_sign,
      // 支付成功后的回调函数
      success: function (res) {
          // res.errMsg === 'chooseWXPay:ok'方式判断前端返回,微信团队郑重提示：
          // res.errMsg将在用户支付成功后返回ok，但并不保证它绝对可靠， 切记。
          if (res.errMsg === 'chooseWXPay:ok') {
          		// todo
          }
      },
      // 支付取消回调函数
      cancel: function (res) {
          that.$toast('用户取消支付~')
      },
      // 支付失败回调函数
      fail: function (res) {
          that.$toast('支付失败~')
      }
  })

方法二:

 WeixinJSBridge.invoke(
     "getBrandWCPayRequest",
     {
         appId: appId, //公众号名称，由商户传入
         timeStamp: timestamp.toString(), //时间戳，自1970年以来的秒数
         nonceStr: nonce_str, //随机串 后台生成
         package: package,
         signType: "MD5", //微信签名方式：
         paySign:sign //微信签名
     },
     res => {
         if (res.err_msg == "get_brand_wcpay_request:ok") {
             //微信团队郑重提示：res.err_msg 将在用户支付成功后返回 ok，但并不保证它绝对可靠。
             that.$toast.success("支付成功!");
         }
         if (res.err_msg == "get_brand_wcpay_request:fail") {
             that.$toast.fail("支付失败!");
         }
         if (res.err_msg == "get_brand_wcpay_request:cancel") {
             that.$toast.fail("支付已取消!");
         }
     }
 );

在开发过程中遇到当前页面的URL未注册的错误提示, 要注意, 当你的微信支付配置与文档无误以外, 看看转跳到此支付页的上一页A的路由是否与你设定的域名/授权目录/回调链接一致.

如:
在微信设定的域名是:

https:ABCD.com/efg/

那么, A转跳到支付页面的路由应该是:

this.$router.push('https:ABCD.com/efg/?参数')

而不能是:

this.$router.push('https:ABCD.com/efg?参数')

注意, 当操作系统是ios的话, 转跳不能用router.push, 要使用 locaiton.href ,因为ios拿到的是第一个进入的链接

而当遇到支付验证签名失败这个提示时, 应提醒后端, 是否设定的参数与支付文档不一致, 且要留意, 支付签名是否需要二次签名. 当一切都与文档一致还是报此错误时, 要留意, 后端传给微信的参数要与前端一致, 如(timestamp, nonceStr等要一致)