微信支付方式

库课科技前端
182 阅读4分钟

微信支付方式：

  1. JSAPI支付
  2. Native支付
  3. H5支付
  4. 小程序支付

JSAPI支付

说明：  通过JSAPI下单API成功获取预支付交易会话标识（prepay_id）后，需要通过JSAPI调起支付API来调起微信支付收银台。

  1. WeixinJSBridge内置对象（只针对微信浏览器内有效）
  2. wx.chooseWXPay支付（需注入JSSDK，公众号开发说明）
function onBridgeReady() {
  WeixinJSBridge.invoke('getBrandWCPayRequest', {
    "appId": "wx2421b1c4370ecxxx",   //公众号ID，由商户传入    
    "timeStamp": "1395712654",   //时间戳，自1970年以来的秒数    
    "nonceStr": "e61463f8efa94090b1f366cccfbbb444", //随机串    
    "package": "prepay_id=wx21201855730335ac86f8c43d1889123400",
    "signType": "RSA",     //微信签名方式：    
    "paySign": "" //微信签名
  },
  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();
}

wx.chooseWXPay({
  timestamp: 0, // 支付签名时间戳，注意微信jssdk中的所有使用timestamp字段均为小写。但最新版的支付后台生成签名使用的timeStamp字段名需大写其中的S字符
  nonceStr: '', // 支付签名随机串，不长于 32 位
  package: '', // 统一支付接口返回的prepay_id参数值，提交格式如：prepay_id=***）
  signType: '', // 微信支付V3的传入RSA,微信支付V2的传入格式与V2统一下单的签名格式保持一致
  paySign: '', // 支付签名
  success: function (res) {
    // 支付成功后的回调函数
    if (res.err_msg == "get_brand_wcpay_request:ok") {
        // 使用以上方式判断前端返回,微信团队郑重提示：
        //res.err_msg将在用户支付成功后返回ok，但并不保证它绝对可靠。
    }
  },
  complete: function(res) {
      // 支付完成
  },
  fail: function(res) {
     // 支付失败
  }
});

Native支付

说明：  通过Native下单API成功获取支付二维码链接（code_url）后，需要在前端（PC网页或POS机具）生成二维码供用户扫描支付。 注意

  • code_url对应链接格式：weixin://pay.weixin.qq.com/bizpayurl/up?pr=NwY5Mz9&groupid=00。请商户调用第三方库将code_url生成二维码图片。该模式链接较短，生成的二维码打印到结账小票上的识别率较高。

小程序支付

说明：  通过JSAPI下单API成功获取交易会话标识（prepay_id）后，需要通过JSAPI调起支付API来调起微信支付收银台。

wx.requestPayment({
    "timeStamp": "1414561699", // 时间戳
    "nonceStr": "5K8264ILTKCH16CQ2502SI8ZNMTM67VS", // 支付签名随机字符串
    "package": "prepay_id=wx201410272009395522657a690389285100", // JSAPI下单接口返回的prepay_id参数值
    "signType": "RSA", // 签名方式
    "paySign": "", // 签名
    "success":function(res){},
    "fail":function(res){},
    "complete":function(res){}
})

H5支付

说明：通过H5下单API成功获取H5下单返回的支付中间页（h5_url）后，用户需要通过微信外部的浏览器调起微信支付收银台

  • h5_url为拉起微信支付收银台的中间页面，可通过访问该URL来拉起微信客户端，完成支付，h5_url的有效期为5分钟
  • 微信支付收银台中间页会进行H5权限的校验，安全性检查
  • 正常流程用户支付完成后会返回至发起支付的页面，如需返回至指定页面，则可以在h5_url后拼接上redirect_url参数，来指定回调页面。您希望用户支付完成后跳转至https://www.wechatpay.com.cn，则拼接后的地址为h5_url= https://wx.tenpay.com/cgi-bin/mmpayweb-bin/checkmweb?prepay_id=wx20161110163838f231619da20804912345&package=1037687096&redirect_url=https%3A%2F%2Fwww.wechatpay.com.cn
  • 需对redirect_url进行urlencode处理
  • 由于设置redirect_url后,回跳指定页面的操作可能发生在
    • 微信支付中间页调起微信收银台超过5秒
    • 用户点击“取消支付”或支付完成后点击“完成”按钮。因此无法保证页面回跳时，支付流程已结束，所以商户设置的redirect_url地址不能自动执行查单操作，应让用户去点击按钮触发查单操作，弹窗提示
https://wx.tenpay.com/cgi-bin/mmpayweb-bin/checkmweb?prepay_id=wx20161110163838f231619da20804912345&package=1037687096&redirect_url=https%3A%2F%2Fwww.wechatpay.com.cn

// h5_url为拉起微信支付收银台的中间页面，可通过访问该URL来拉起微信客户端，完成支付，h5_url的有效期为5分钟

浏览器支付方式解析

  1. pc端使用微信支付
    Native支付,生成支付二维码 生成支付二维码规则
  2. wap端支付
    微信浏览器内：jsApi和native
    非微信浏览器内：h5支付
  3. 小程序内支付
    小程序支付

官网文档链接

avatar
文章
阅读
粉丝