支付架构

跳转支付

一、前端对某订单发起支付

通过ajax调用，传递交易或订单SN参数（带token）

二、支付API返回跳转参数

支付api返回跳转form所需的表单项，格式如下：

{
    gateway_url:"https://openapi.alipay.com/gateway.do",
    form_items[{
      item_name:"",
      item_value:""
    }  
     //, other ...
    ]
}

三、由前端向第三方支付发起跳转

这部分的操作体验为：新打开窗口来打开第三方平台
本窗口遮罩，并显示两个按钮：支付成功、支付出现问题

四、用户在第三方平台上完成支付操作

五、第三平台跳转回我方平台

此时会跳向 DomainSettings.buyer/payment/{trade_type}/{sn}/result
既同步回调地址,但这里我们不再做支付结果校验
此页面为前端页面，展示出交易或者订单（使用trade_type来判断交易trade或者订单order） “支付已经完成”字样
支付结果会在异步通知中来完成

第三方平台异步通知我方系统支付结果

我方系统更改订单状态

二维码支付

一、当用户选择某个支付方式时，前端嵌入一个iframe

二、在iframe中向支付api发起支付请求

此api为：

get:/order/pay/{trade_type}/{sn}

参数	类型	说明
trade_type	String	交易类型，可选值有order或trade
sn	String	相应的订单号
client_type	String	客户端类型，PC,WAP,NATIVE,REACT
pay_mode	String	客户端唯一id
payment_plugin_id	String	支付插件类型

三、api返回跳转的form 项

支付api返回跳转form所需的表单项，格式如下：

{
    gateway_url:"https://openapi.alipay.com/gateway.do",
    form_items[{
      item_name:"",
      item_value:""
    }  
     //, other ...
    ]
}

四、由前端向第三方支付发起跳转

五、第三方支付返回二维码的界面

在本界面中，支付宝本身提供了支付状态查询功能
但微信没有提供这样的功能，所以，如果是微信的话，在第三步中的gateway_url 实际上会是我们自己的一个api，在这个api中我们自己实现了和支付宝二维码界面一样的的支付状态查询功能

微信二维码显示页的api为：

POST:/order/pay/weixin/qrpage/{微信交易号}/{微信QR码}

其中交易号和微信QR码会在第二步中的返回值中得到

此api的view页面在：/resources/templates/weixin_qr.ftl

在此页面中会包含一个二维码显示的图片，其src 为：

/order/pay/weixin/qr/{QR码}

此页面还包含一个付款状态检测程序，以便及时得到用户付款成功的反馈完成页面的跳转，此api为：

/order/pay/weixin/status/{微信交易单号}

六、用户用手机扫描上述二维码

七、手机上的微信或支付宝会调起支付

八、用户在第三方平台上完成支付

九、第三方平台会通知我平台支付的状态

十、此时iframe中的二维码界的js程序会轮询支付状态，就但支付成功统一调用一个规定好的方法：

parent.payComplete()

十一、前端在父页面中已经定义好了这样的一个方法来处理相应的支付完成操作

支付架构

跳转支付​

二维码支付​

跳转支付

二维码支付