微信公众号支付前端部分流程

上周公司安排了微信公众号支付开发任务，经过快一周的不断填坑，终于把支付搞定，现在把遇到的问题和开发步骤记录一下，方便遇到同样问题的老铁们节省一些时间，少入些坑，先说一下本文不包含的内容，因为这些并不难配置，网上也有很多讲解，先做一下声明：

• 1.我做的是微信公众号支付，在微信内H5调起支付
• 2.公众号支付申请也不讲
• 3.公众号的授权路径这些在官网都有，不再讲：https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=7_3
• 4.微信公众平台-微信支付-开发配置-支付授权目录配置也不再说

---

业务流程

建议对业务流程不熟悉的先看下：

https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=7_4

比如：哪些是需要前端做的，哪些是后端做的，哪些是微信支付系统的

我直接从生成商户订单开始说起，在官网的业务流程是第4步。

1.在咱们的后台生成订单

2.在后台调用微信的统一下单接口，参数不细讲，因为官网说的很详细了
https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=9_1
微信系统会生成预付单，接口返回成功其中一个参数是prepay_id

3.后台返回支付参数prepay_id，还有一个参数是签名paySign，这个前端或者后台来做签名都行

4.前端网页中执行JS调起支付
https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=7_7&index=6
这一步常常会有支付失败的返回 get_brand_wcpay_request:fail，大部分是签名和公众号的授权路径问题。公众号的授权路径问题这个我讲一下，我用的是SPA（单一页面），所以授权路径是会改变的，我把微信调起支付时的页面单独提了出来，放在网址的根页面，这个支付页面路径肯定是固定的了。我看有人说可以用/#/之前的路径，但是我是没有这样成功。授权路径写法也有很多例子，如：
http://www.cnblogs.com/zhouXX/p/6892039.html

5.微信系统进行检测是否合法

6.微信系统调起输入密码

7.用户输入密码

8.微信系统验证，然后告知咱们后台和前端是否成功。前端上面4.的接口中返回

9.微信系统展示支付消息给用户

注：
1.参数中时间戳是10位，以秒为单位
2.这个是签名算法，MD5加密前端也有插件，搜一下有一堆不再讲：
https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=4_3

总结

感觉遇到坑主要是因为官方文档不知道从何看起，没有明了健全的流程说明，微信支付现在分的块儿太多。