首先这个二维码并不是直接将微信和支付宝的二维码合并,而是一个假的二维码,下面说一下思路。
1.页面加载时服务器生成一个供用户扫描的二维码。内容类似 https://pay.wps.cn/api/pay/qrcodepay?order_id=20181109f75bac7c, 后台主要是生成一个预订单。
2.用户扫描提供的二维码,服务器通过请求ua判定扫描客户端类型分别向微信(MicroMessenger)或支付宝(AlipayClient)提供订单,同时展示二维码的页面轮询向后台查询订单状态供支付完成后页面后期处理准备。
3.服务器端进行处理,如果是通过微信扫描的,通过公众号支付方式提交订单返回拉起支付的信息,微信内嵌浏览器收到信息,调起公众号支付窗口,完成支付;如果是通过支付宝扫描的,通过支付宝移动端支付方式提交订单返回对应form信息,渲染到支付宝浏览器上,调起支付。
4.向微信和支付宝提交订单时会加上回调地址,这样支付完成后,第三方可以通过回调提醒服务器完成"发货"操作。
相关demo之后有时间整理一下再分享。
https://github.com/yulele166/qr_pay.git