ThinkSSL🔒 一键申购 5分钟快速签发 30天无理由退款 购买更放心 广告
[toc] # 时序图 ## 什么是时序图 * 时序图, 又名序列图、循序图、顺序图,是一种UML交互图。 * 它通过描述对象之间发送消息的时间顺序显示多个对象之间的动态协作。 * 它可以表示用例的行为顺序 ## 时序图的作用 * 用来描述接口的功能, 弥补原型图在逻辑细节上的不足 ![](https://box.kancloud.cn/3e81527f2a916a0bc8c6c89205cfd521_894x1042.png) ## 时序图的语法 ```sequence Andrew->China: Says Hello Note right of China: China thinks\nabout it China-->Andrew: How are you? Andrew->>China: I am good thanks! ``` ```[sequence] Andrew->China: Says Hello Note right of China: China thinks\nabout it China-->Andrew: How are you? Andrew->>China: I am good thanks! ``` --- ```sequence Title: Here is a title A->B: Normal line B-->C: Dashed line C->>D: Open arrow D-->>A: Dashed open arrow ``` ```[sequence] Title: Here is a title A->B: Normal line B-->C: Dashed line C->>D: Open arrow D-->>A: Dashed open arrow ``` --- ```sequence # Example of a comment. Note left of A: Note to the\n left of A Note right of A: Note to the\n right of A Note over A: Note over A Note over A,B: Note over both A and B ``` ```[sequence] # Example of a comment. Note left of A: Note to the\n left of A Note right of A: Note to the\n right of A Note over A: Note over A Note over A,B: Note over both A and B ``` --- ```sequence participant C participant B participant A Note right of A: By listing the participants\n you can change their order ``` ```[sequence] participant C participant B participant A Note right of A: By listing the participants\n you can change their order ``` --- ## 一张图看懂时序图 ![](https://box.kancloud.cn/6100805af5f6d728e986b4802f00c880_624x382.jpg) ## 复现微信支付时序图 ```[sequence] title: 微信支付时序图 participant 微信支付用户 as user participant 微信客户端 as wxc participant 商户APP客户端 as appc participant 商户后台系统 as apps participant 微信支付系统 as wxs user->appc:1.打开商户APP客户端() appc->appc:2.选择商品下单() appc->apps:3.请求生成支付订单() apps->wxs:4.调用统一下单API() wxs->wxs:生成预付单() wxs-->>apps:5.返回预付单信息(prepay_id) apps->apps:6.生成带签名的客户端支付信息() apps-->>appc:7:返回信息(prepay_id,sign等) user->appc:8:用户确认支付() appc-->wxc:9:支付参数通过调用SDK调起微信支付() wxc->wxs:10.发起支付请求() wxs->wxs:验证支付参数, APP支付权限等() wxs-->>wxc:11.返回需要支付授权() user->wxc:12.用户确认支付, 输入密码() wxc->wxs:13:提交支付授权() wxs->wxs:验证授权, 完成支付交易() wxs-->>apps:15.异步通知商户支付结果() apps->apps:接收和保存支付通知() apps->>wxs:16.返回告知已成功接收处理() wxs-->wxc:14.返回支付结果, 发送微信消息提示() wxc->appc:将支付状态通过商户APP已实现的回调接口执行回调() appc->apps:后台查询实际支付结果() apps->wxs:调用微信查询API查询支付结果() wxs-->>apps:返回支付结果() apps-->appc:返回支付结果 appc-->user:展示支付结果() appc->appc:商户发货() ``` ```sequence title: 微信支付时序图 participant 微信支付用户 as user participant 微信客户端 as wxc participant 商户APP客户端 as appc participant 商户后台系统 as apps participant 微信支付系统 as wxs user->appc:1.打开商户APP客户端() appc->appc:2.选择商品下单() appc->apps:3.请求生成支付订单() apps->wxs:4.调用统一下单API() wxs->wxs:生成预付单() wxs-->>apps:5.返回预付单信息(prepay_id) apps->apps:6.生成带签名的客户端支付信息() apps-->>appc:7:返回信息(prepay_id,sign等) user->appc:8:用户确认支付() appc-->wxc:9:支付参数通过调用SDK调起微信支付() wxc->wxs:10.发起支付请求() wxs->wxs:验证支付参数, APP支付权限等() wxs-->>wxc:11.返回需要支付授权() user->wxc:12.用户确认支付, 输入密码() wxc->wxs:13:提交支付授权() wxs->wxs:验证授权, 完成支付交易() wxs-->>apps:15.异步通知商户支付结果() apps->apps:接收和保存支付通知() apps->>wxs:16.返回告知已成功接收处理() wxs-->wxc:14.返回支付结果, 发送微信消息提示() wxc->appc:将支付状态通过商户APP已实现的回调接口执行回调() appc->apps:后台查询实际支付结果() apps->wxs:调用微信查询API查询支付结果() wxs-->>apps:返回支付结果() apps-->appc:返回支付结果 appc-->user:展示支付结果() appc->appc:商户发货() ```