app嵌入微信H5支付

微信官方提示:

提醒:H5支付不建议在APP端使用,如需要在APP中使用微信支付,请接APP支付,文档详见微信支付开发文档

本人项目是app嵌入微信H5支付,操作代码如下:

直接上代码:(本人项目的写法)

下单成功,就可以跳转下面的url了,接口调起H5支付页面:

要是localStorage和sessionStorage不好使的情况下,可以通过传递参数实现,如下

let redirectUrl='http://zend.enn.cn/tx/ssopapi/ssop/bsc-h5/#/success'
let redirectUrl='http://zend.enn.cn/tx/ssopapi/ssop/bsc-h5/#/success?id=123'  //也可以加参数
redirectUrl = encodeURIComponent(redirectUrl)
window.location.href = data.mwebUrl + '&redirect_url='+redirectUrl

微信官方文档说明:

回调页面

正常流程用户支付完成后会返回至发起支付的页面,如需返回至指定页面,则可以在MWEB_URL后拼接上redirect_url参数,来指定回调页面。

如,您希望用户支付完成后跳转至https://www.wechatpay.com.cn,则可以做如下处理:

假设您通过统一下单接口获到的MWEB_URL= https://wx.tenpay.com/cgi-bin/mmpayweb-bin/checkmweb?prepay_id=wx20161110163838f231619da20804912345&package=1037687096

 

则拼接后的地址为MWEB_URL= https://wx.tenpay.com/cgi-bin/mmpayweb-bin/checkmweb?prepay_id=wx20161110163838f231619da20804912345&package=1037687096&redirect_url=https%3A%2F%2Fwww.wechatpay.com.cn

注意:

  1.需对redirect_url进行urlencode处理

  2.由于设置redirect_url后,回跳指定页面的操作可能发生在:1,微信支付中间页调起微信收银台后超过5秒 2,用户点击“取消支付“或支付完成后点“完成”按钮。因此无法保证页面回跳时,支付流程已结束,所以商户设置的redirect_url地址不能自动执行查单操作,应让用户去点击按钮触发查单操作。回跳页面展示效果可参考下图

你可能感兴趣的:(vue,html5)