前言：
最近接手做一个支付中心的的项目，需要接入微信和支付宝的
pc和h5两个平台的支付。因为之前支付相关的服务都是各个部门自己做，但现在为了统一公司形象以及统一管理，需要做一个公共项目接公司各个业务线的支付需求。这篇文章调研了支付宝和微信两端的关于
pc和h5的支付流程和一些常见问题，也是自己开发项目前的调研文档，共享给大家。
一、产品需求：
pc场景：
在
pc网页端支付步骤中的收银台处显示收款二维码，支持用户选择微信 / 支付宝，用户需要自行打开手机客户端，进行扫码支付，当用户成功支付或订单超时后返回到指定订单页面。（页面展现大致如下：）
h5场景：
在
h5浏览器支付步骤中的收银台进行支付时，支持用户选择微信 / 支付宝进行支付，当选择其中一种后，调起客户端完成支付，成功或失败后返回指定订单页面。（页面展现大致如下：）
二、文档列表：
通过前面我们知道了需求，那就对应找一下相关文档，当前只支持微信和支付宝两种类型，故只列出两种文档
微信支付产品文档：链接
pc端调用接口类型： Native 支付
h5端调用接口类型： H5 支付
支付宝支付产品文档：链接
pc端调用接口类型： 电脑网站支付
h5端调用接口类型： 手机网站支付
三、不同类型支付中的细节梳理
看过文档后，下面是我对每个支付进行的一个细节梳理，便于大家以最快的时间熟悉流程：
1. 微信之Native支付
介绍 && 适用场景
Native支付是指商户系统按微信支付协议生成支付二维码，用户再用微信"扫一扫"完成支付的模式。Native支付适用于PC网站、实体店单品或订单、媒体广告支付等场景。
业务流程图：
使用示例
QA 常见问题：
1. pc端生成二维码，用户扫描二维码进行支付，是用jsapi 还是 native
如需实现
pc端生成二维码，用户扫描二维码进行支付，建议用Native支付
2. Native 支付返回的二维码链接code_url过期后，在不改变订单的情况下，怎么刷新二维码？
使用原参数重新调用即可获取新的
code_url
3. Native 支付返回的二维码链接code_url的有效期？
code_url有效期为两个小时，过期后扫码不能再发起支付
4. 当商户调用关闭订单接口后，用户还可以支付吗？
当商户调用关闭订单后，订单无法再进行调起支付
5. 在商户关闭订单后，二维码失效吗？
当关闭订单后，二维码就会失效，无法进行支付
6. 当我前一步查询订单，结果是未支付状态，正准备关闭，此时用户扫码支付了，如果他比我快，是否可以支付成功？
此时订单状态还未修改，是可以支付成功的
2. 支付宝之电脑网站支付
介绍 && 适用场景
电脑网站支付是指商户在电脑网页展示商品或服务，用户在商户页面确认使用支付宝支付时，通过调用支付宝的支付接口，返回支付url，前端通过url生成二维码，用户使用手机客户端扫码完成支付。
使用示例
QA
1. 如何获取到支付链接
可以调用
alipay.trade.page.pay接口，以get形式提交，就会直接返回类似这样的支付链接了，可以转成二维码支付，接口地址
打印getBody 就可以得到链接，如下：
2. 如何获取支付状态
支付的状态是通过异步通知的，在支付接口设置一下
notify_url参数，支付成功后会把支付的结果通知到设置的这个地址上，一般这个地址用后端接口设置接收一下即可，前端通过轮训去调用后端查询状态，如果后端没有接收到支付宝的通知，则调用支付宝的接口去查状态，如果后端接收到支付宝的回调后，更改订单状态，并在下次前端请求时返回给前端
3. 支付url 的有效期？
可以通过修改
timeout_express（支付超时参数：在订单创建后开始生效，超时未支付订单将关闭）字段来设置，取值范围：1m～15d。电脑网站支付、手机网站支付和App支付默认订单超时时间为15d，timeout_express<=15d，文档地址
3. 微信之H5支付
介绍 && 适用场景
H5支付是指商户在微信客户端外的移动端网页展示商品或服务，用户在前述页面确认使用微信支付时，商户发起本服务呼起微信客户端进行支付。H5支付主要用于触屏版的手机浏览器请求微信支付的场景，方便从外部浏览器唤起微信支付。
业务流程图：
使用示例
QA 常见问题：
1. 返回的跳转url可以直接唤起客户端吗？
h5_url为拉起微信支付收银台的中间页面，可通过访问该url来拉起微信客户端，完成支付，h5_url的有效期为5分钟如果用户安装了客户端，可以直接唤起客户端
2. 如果用户没有安装客户端，是否会有中间页面来提示用户安装客户端或者网页登录支付，商家是否需要关心？
会有中间页面来提示，商家不用关心这个页面
3. 支付完成后，是否可以跳转到指定页面
正常流程用户支付完成后会返回至发起支付的页面，如需返回至指定页面，则可以在
h5_url后拼接上redirect_url参数，来指定回调页面
4. 支付宝之手机支付
介绍 && 适用场景
手机网站支付是指商户在移动端网页展示商品或服务，用户在商户页面确认使用支付宝支付时，浏览器自动跳转支付宝 App 或支付宝网页完成付款的支付产品。
使用示例
QA 常见问题
1. 当h5支付后如何跳会商户
需要跳转的话，后端调用
alipay.trade.wap.pay(手机网站支付接口2.0)时可以设置下return_url，在支付完成后，即可跳回商户指定页面
2. h5 如何获取跳转链接，唤起客户端
调用支付接口的方式改为
get即可，如下图：
3. 当场景为需要在pc 端展示二维码，让用户通过扫码支付，需要用电脑支付还是h5?
用
h5的支付接口即可，用户扫码后会支付会调起客户端来发起支付
4. 什么场景用pc 的接口
如果你的支付场景为让用户在pc完成支付时 ，那就可以调用
pc的接口，支付宝会返回一个pc端的支付页面(如下图)，直接跳转到支付宝的页面，输入账号密码登录后，即可完成支付流程
总结
内心感受：说实话，做开发也算时间长一点，对于移动端的涉猎少之又少，更别说支付了，所以，当听到这个项目需要我做的时候，有些新奇，又有点担心，虽然之前也接过这种外部
api，但是还是有些忐忑，因为我不知道我该了解到哪个程度才能只能我完成这个任务。项目开展在10月1放假前的几天，上班查文档，下班看视频，串流程，这篇文章就是当时的产物，现在项目做的差不多了，正好再整理润色一下，留个记录。学习下来，发现好像没那么难，想对自己说：困难就像纸老虎，勇敢一点，再勇敢一点。