技术分享-商城篇-订单支付微信篇（十二）

B2C商城微信支付全解析：H5支付、小程序支付、JSAPI支付与APP支付

引言

在之前的文章中，我们聊了B2B2C的商城相关功能模块，如：首页布局、商品、购物车、购物结算、订单支付等，但是B2C商城的订单支付方式的选择，我们在国内目前使用最多的就是微信支付和支付宝支付，而随着移动互联网的快速发展，微信支付已成为B2C商城中不可或缺的支付方式之一。本期我们先从微信支付开始聊一下支付业务逻辑、技术架构、注意事项以及数据安全等方向，详细阐述H5支付、小程序支付、JSAPI支付和APP支付在B2C商城中的应用，后期还会对支付宝、云闪付等单开文章进行详述。

以上提供一张微信支付流程图，详细接口和对应端，见官方文档

业务逻辑

我们在提交购物结算，生成订单的时候，就需要通过支付接口生成支付链接，相应的步骤如：用户下单、生成支付请求（平台需要自己构造一个商户交易号，便于和微信支付平台做数据匹配，如对账和异步）、获取支付请求URL（小程序、JSAPI以及APP省略，这几个方式都是通过构造支付信息，拉起微信客户端进行支付）、页面跳转（H5）、用户支付（需要当前用户微信openid，注意：微信每一个端openid可能不一致，所以为了确保用户唯一性，微信官方提供了unionid，需要开通微信开放平台，然后把app、微信公众号、小程序等绑定到开放平台即可）、页面支付结果通知（取消或成功，对应跳转不同的地址）、支付状态更新（异步处理，所以需要在支付后台配置支付回调地址，必须），以下把每个支付方式，拆开列出不同步骤，方便各位阅读。

H5支付

H5支付主要适用于在手机浏览器中直接打开的网页支付场景。用户在商城网页中选择商品并完成下单后，通过H5支付页面调用微信支付接口完成支付。其业务逻辑主要包括以下几个步骤：

1. 用户下单：用户在商城网站选择商品并提交订单。
2. 生成支付请求：商城后台调用微信支付统一下单接口，获取预支付交易会话标识（prepay_id）。
3. 页面跳转：将用户重定向到微信支付页面，并传入预支付信息。
4. 用户支付：用户在微信支付页面输入支付密码完成支付。
5. 支付结果通知：微信支付服务器异步通知商城后台支付结果。

小程序支付

小程序支付是在微信小程序内部完成的支付方式，具有更好的用户体验和转化率。其业务逻辑主要包括：

1. 用户下单：用户在小程序内选择商品并提交订单。
2. 统一下单：小程序后端调用微信支付的统一下单接口，获取prepay_id。
3. 签名生成：根据prepay_id生成签名，并返回给小程序前端。
4. 发起支付：小程序前端调用微信支付API，发起支付请求。
5. 支付结果处理：微信支付服务器异步通知小程序后端支付结果，小程序前端显示支付结果。

JSAPI支付

JSAPI支付是在微信内嵌的网页中完成的支付方式，适用于公众号等场景。其业务逻辑与H5支付类似，但需要在微信内打开网页：

1. 用户下单：用户在公众号内选择商品并提交订单。
2. 统一下单：公众号后台调用微信支付的统一下单接口，获取prepay_id。
3. 页面跳转：公众号将用户引导至支付页面，并传入prepay_id等信息。
4. 用户支付：用户在支付页面完成支付。
5. 支付结果通知：微信支付服务器异步通知公众号后台支付结果。

APP支付

APP支付是指用户在手机APP内通过微信SDK调用支付接口完成的支付方式。其业务逻辑主要包括：

1. 用户下单：用户在APP内选择商品并提交订单。
2. 统一下单：APP后台调用微信支付的统一下单接口，获取prepay_id。
3. 生成支付参数：APP后台根据prepay_id生成支付参数。
4. 发起支付：APP通过微信SDK调用支付接口，展示支付页面给用户。
5. 用户支付：用户在支付页面完成支付。
6. 支付结果通知：微信支付服务器异步通知APP后台支付结果。

技术架构

微信支付技术架构

微信支付的技术架构包括前台调用和后台处理两个主要部分。前台调用主要指客户端（iOS、Android、Web等）和服务器之间的数据传输，包括通信协议和数据加密。后台处理主要涉及支付流程和数据的处理，包括订单处理、交易记录查询等。

微信支付采用HTTPS协议进行通信，确保数据在传输过程中的安全和完整性。微信支付采用对称加密和非对称加密相结合的方式进行数据加密，保证数据传输的安全性。同时，微信支付采用云计算架构，确保支付服务的高可用性和效率。

具体实现

• H5支付和JSAPI支付：通过微信提供的JS API调用支付接口，需要在支付页面中嵌入微信支付相关的JS代码。
• 小程序支付：基于微信小程序的支付能力，通过小程序的API接口完成支付。
• APP支付：在APP中集成微信SDK，通过SDK调用支付接口，实现支付功能。

注意事项

1. 域名备案与安全：所有涉及支付的域名必须经过ICP备案，且配置在微信支付的安全域名列表中。
2. 商户号与密钥：商户需要申请并配置微信支付商户号和相关密钥，确保支付接口的安全调用。
3. 支付参数：支付参数的生成和签名必须严格按照微信支付的要求进行，确保支付的安全性和正确性。
4. 用户授权：在支付过程中，需要确保用户授权，避免未授权支付行为的发生。
5. 支付结果处理：及时并准确地处理支付结果，确保订单状态的正确更新。

数据安全

订单支付，我们除了实现基本支付逻辑外，还需要对提交给微信等第三方平台数据做相应安全处理，避免被有心人钻空子，给大家来一个零元购，比如我曾经见过一个电商系统，对方的商城没有做对支付金额校验和处理，直接通过前端把支付金额传输过去，后端以裸奔形式完全不对支付金额做校验，导致被人以0.01元的价格，通过抓包接口，通购全站商品，且在最后支付回调也没有对支付金额进行验证（最后这整个团队都被一起撸了，这种低级错误我遇到过不少，都是前后端为了省事，把敏感数据完全暴露给别人，且有前端提交，这种情况接口被抓包暴露之后，就等于给平台炒成不可估量损失等等，还有很多），而要解决以上问题也很简单，我列出几个方案：

1. CSRF：全称Cross-site request forgery攻击，以每次临时token进行入参，并对token进行效期控制以及使用后过期处理等；
2. 数据加密：把前端提交的敏感信息通过对称加密或非对称加密方式加密之后传输（对于支付可以使用RSA非对称加密，并动态生成加密密钥），防止同一个公钥被窃取
3. 敏感信息处理：如：订单信息、支付金额等，交由后端自己取，以订单ID或者订单号[建议使用订单号]
4. 用户越权：用户越权这个问题也是经常性被忽视，我们在日常开发中，会使用数据ID来入参，但是由数据库生成的自增ID是按序列叠加生成的，所以很多敏感信息就是被这种方式给窃取，解决方式就是：敏感接口若是必须登录后才能操作，后端做好RBAC控制权限，对涉及用户的接口，都必须加入鉴权处理，并在取值时，携带上当前用户ID，就可避免越权事件发生

说了这么多，主要就是强调，系统的安全如同生命一样重要，后面我可能会开单章文章来详细聊一下系统安全这块，聊会正题，我们只需解决自己系统安全问题，其实在微信端，他们安全性做的非常好，我简单列了几个微信支付在数据安全方面保障措施，以供各位参考：

6. 数据加密：所有敏感数据（如用户信息、支付信息等）在传输过程中均采用SSL/TLS加密技术，确保数据在公网上传输时不会被窃听或篡改。同时，微信支付内部也采用高强度的加密算法对数据进行加密存储，防止数据泄露。

7. 访问控制：微信支付系统实施严格的访问控制策略，确保只有经过授权的用户或系统才能访问敏感数据和执行关键操作。这包括基于角色的访问控制（RBAC）、基于属性的访问控制（ABAC）等机制，以及多因素认证（MFA）等安全措施。

8. 安全审计：微信支付系统具备全面的安全审计功能，能够记录并分析所有关键操作和系统事件，以便在发生安全事件时进行追溯和调查。这些审计记录包括登录活动、支付请求、API调用等，有助于及时发现并应对潜在的安全威胁。

9. 风险评估与监控：微信支付团队定期进行风险评估和监控，通过自动化工具和人工分析相结合的方式，识别并评估潜在的安全风险。一旦发现异常行为或安全漏洞，将立即采取措施进行修复和加固。

10. 合规性管理：微信支付严格遵守相关法律法规和行业标准，如《网络安全法》、《支付清算管理办法》等，确保业务运营的合规性。同时，微信支付还积极与监管部门沟通合作，共同维护支付市场的健康稳定。

11. 用户教育与保护：微信支付注重用户教育，通过官方网站、APP推送、客服热线等多种渠道向用户普及支付安全知识，提高用户的安全意识和自我保护能力。同时，微信支付还提供了多种安全措施，如支付密码、指纹识别、面部识别等，确保用户账户和资金的安全。

总结

B2C商城中的微信支付方式多样，包括H5支付、小程序支付、JSAPI支付和APP支付等，每种方式都有其独特的业务逻辑和技术实现。在使用微信支付时，需要从业务逻辑、技术架构、注意事项和数据安全等多个方面进行综合考虑和规划。通过合理的系统设计和严格的安全措施，可以确保微信支付在B2C商城中的稳定、高效和安全运行。同时，商户和用户也需要提高安全意识，共同维护支付环境的安全稳定。第三方支付，不论是微信支付、支付宝支付还是其他什么支付，只要学会其中一个，其他平台的支付对接都是大同小异，都可以触类旁通，本篇内容就暂时聊到这儿，若有疑问可以字评论区@我或者私聊本人也可，感谢大家阅读，谢谢。