实用干货！基于H5做APP微信支付！

昨天说了添加购物车，今天就来说说用户把商品加入购物车后想要支付的时候该怎么做。这个很重要，重要到用户的钱到底能不能到你的手里，所以一定要专心做哟。

一 摘要

写在前面：这里HTML5集成微信支付跟iOS,安卓集成微信支付过程是一样的,iOS微信集成参考之前的文章.

http://blog.csdn.net/baihuaxiu123/article/details/51415717

这里引用之前文章的集成过程.如下:

商户系统和微信支付系统主要交互说明：

步骤1：用户在商户APP中选择商品，提交订单，选择微信支付。

步骤2：商户后台收到用户支付单，调用微信支付统一下单接口。参见统一下单API。

步骤3：统一下单接口返回正常的prepay_id，再按签名规范重新生成签名后，将数据传输给APP。参与签名的字段名为appId，partnerId，prepayId，nonceStr，timeStamp，package。注意：package的值格式为Sign=WXPay

步骤4：商户APP调起微信支付。步骤5：商户后台接收支付通知。步骤6：商户后台查询支付结果。

二 效果

1)横屏效果

2)竖屏效果

三 具体代码实现

1)全局变量

var payType; //支付方式：200 微信支付， 310 到店支付

var fromType; //代表从哪里过来的

var orderNbr; // 订单号

var orderId; // 订单id

var orderPrice; // 订单价格

var orderName; // 订单价格

var projectId; // 项目id

var serviceType; // 服务类型

var merchantId; // 商家id

var parentId;12345678910

2)实现过程

3)赋值

4)选择支付模式

5)支付

6)支付成功或失败时返回的状态

7)我的订单里付款，根据订单orderId改变订单状态

8)跳转到我的订单

9)返回事件

四 结束

集成差不多就完成了,这个集成跟iOS或安卓集成过程是一样的,这里大家可以参考一下.

对H5感兴趣的同学可以作者的个人微信订阅号LiuYuGang。想要源代码的同学点击这里可进去复制。

喜欢你就点赞，有用你就收藏，认识程序员你就转发。

我们是一群热爱IT的年轻人，如果你也爱IT、爱移动端开发，欢迎加入我们，让我们共同为梦想发声。

关注“蓝鸥”，推送IT技术与资讯让你做一个有逼格的工程师！