支付宝网页支付:
1、前端发送(流水号,手机号,产品ID,金额,回调地址,取消地址,支付类型)支付信息给后端,
2、后端组装数据,通过SDK向支付宝发起请求,返回数据给前端。
let loc ="/gateway.do?" +返回数据;window.location.href = loc;
3、前端会自动展现支付页面,调用支付宝APP。
4、支付完后跳回到商家网页内,最后展示支付结果。
微信的H5支付:
指商户在微信客户端外的移动端网页展示商品或服务,用户在前述页面确认使用微信支付时,商户发起本服务呼起微信客户端进行支付。
环境配置:公众号开通H5支付权限,H5支付域名配置。
1、前端给后端发送(流水号、手机号、产品ID、token、金额、redirect_url回调页面之类的)给后端做安全校验。
2、后端效验通过返回一个回调地址,前端跳转进入微信支付中间页,调起微信支付收银台。
let url=后端返回的urlwindow.location.replace(url) //这里是后端返回的URL直接进行跳转即可完成微信外支付
微信支付收银台中间页会进行H5权限的校验,安全性检查。
tips:微信支付中间页(h5_url)的有效期为5分钟。
正常流程用户支付完成后会返回至发起支付的页面,如需返回至指定页面,则可以在h5_url后拼接上redirect_url参数,来指定回调页面。您希望用户支付完成后跳转至,则拼接后的地址为h5_url= /cgi-bin/mmpayweb-bin/checkmweb?prepay_id=wx1110163838f231619da20804912345&package=1037687096&redirect_url=https%3A%2F%
需对redirect_url进行urlencode处理,
由于设置redirect_url后,回跳指定页面的操作可能发生在:
1、微信支付中间页调起微信收银台后超过5秒
2、用户点击“取消支付”或支付完成后点击“完成”按钮。因此无法保证页面回跳时,支付流程已结束,所以商户设置的redirect_url地址不能自动执行查单操作,应让用户去点击按钮触发查单操作,
3、支付成功,用户收到支付凭证,同时商户后台收到支付成功的通知