H5商城的支付接入比封闭形态复杂，原因只有一个：同一套页面会在不同的浏览器环境里被打开，而每个环境能用的支付方式不同。用户可能从微信群点进来（微信内置浏览器）、从短信点进来（iOS Safari）、从信息流广告点进来（各家App的内置浏览器）。因此H5商城的后端必须实现「按环境分支」的统一下单逻辑，前端要能正确识别当前环境。本文按环境拆解需要申请什么、配置什么、怎么联调，并给出一张能挡掉大部分上线故障的域名配置核对表。
一、按环境区分的三种支付方式
| 用户所在环境 | 使用的支付方式 | openid来源 | 关键配置 |
|---|---|---|---|
| 微信内置浏览器（微信内打开H5） | 微信JSAPI支付（网页版） | OAuth2网页授权 | 公众号网页授权域名、商户平台JSAPI支付授权目录 |
| 普通手机浏览器（Safari、Chrome等） | 微信H5支付（会拉起微信客户端） | 不需要openid | 商户平台H5支付授权域名、场景信息（网站URL与名称） |
| 普通手机浏览器或支付宝内 | 支付宝手机网站支付 | 不需要openid | 支付宝开放平台应用、签约手机网站支付、应用网关与回调地址 |
后端应设计成一个统一下单接口，由前端上报当前环境（或后端按User-Agent判断），再选择对应的下单类型。三种方式的订单在数据库里应共用同一张订单表与同一套状态机，只在支付流水上记录通道差异，否则对账和退款会变得很难处理。
二、微信侧接入步骤
2.1 商户号申请与主体一致性
先申请微信支付商户号，需要营业执照、法人身份证、对公账户与经营类目证明，审核一般3-10个工作日；部分类目（食品、医疗器械、图书音像等）需补充行业许可，会再增加1-2周。这里有一条硬性要求必须提前确认：商户号主体、公众号主体、域名备案主体必须是同一家公司，任何一处不一致都会在关联或报备环节被退回，而这种问题往往要重新走一遍资质流程，代价很大。
2.2 微信内打开时：JSAPI支付
流程是：用户在微信内打开H5页面 → 后端引导走OAuth2网页授权（静默授权即可获取openid）→ 拿到openid后调统一下单接口，指定JSAPI类型 → 后端返回支付参数（含二次签名）→ 前端通过微信内置的JS桥调起收银台 → 用户付款 → 微信异步回调通知后端。
需要配置两处域名，位置不同、很容易漏掉其中之一：①公众号后台的「网页授权域名」，不配就拿不到openid；②商户平台的「JSAPI支付授权目录」，需要填到实际发起支付的页面所在目录，注意路径大小写与末尾斜杠。由于不在封闭容器内，H5还要自己处理登录态保持（授权后的会话怎么存）、支付完成后的回跳页面、以及支付中断（用户点了取消或切走了App）时订单状态如何收敛。
2.3 微信外打开时：H5支付
流程是：用户在Safari等浏览器提交订单 → 后端调统一下单指定H5支付类型，并传入场景信息（网站URL与名称）→ 接口返回一个支付中间页地址 → 前端跳转过去，系统会拉起微信客户端完成付款 → 付款后按配置的回跳地址返回商城。
要点有三个：①H5支付需要在商户平台单独开通并配置授权域名，未开通时调用会直接报错；②拉起微信客户端的过程受各浏览器策略影响，需要在真机上逐个浏览器验证，并准备好「未安装微信」或「拉起失败」时的兜底提示；③由于跳出了浏览器，回来后的订单状态要以后端查询结果为准，不能依赖前端回跳参数判断是否付款成功。
三、支付宝手机网站支付
在支付宝开放平台创建应用并签约「手机网站支付」，配置应用网关、回调地址与密钥（推荐使用应用公钥证书模式）。前端通过表单提交或SDK调起，会跳转到支付宝收银台或拉起支付宝App，付款后按配置回跳。服务端需要处理的部分与微信同构：异步通知的接收与验签、幂等处理、主动查询订单、退款与对账。
微信外场景不宜只接微信支付：相当一部分用户更习惯支付宝，只提供微信H5支付会丢掉订单。建议在普通浏览器同时给出微信H5支付与支付宝手机网站支付，并按当前环境给出默认推荐（微信内默认JSAPI，其他浏览器把两个选项都展示出来），把选择权留给用户而不是强行跳转。
四、上线前的域名配置核对表
「开发完成但支付调不通」是H5项目最集中的一类卡点，多数原因在配置而非代码。建议在联调前把下面这张表打印出来，逐项对照实际生产域名打勾：
- □ 公众号后台 — 网页授权域名（决定能否拿到openid）
- □ 公众号后台 — JS接口安全域名（决定微信内分享卡片是否正常）
- □ 商户平台 — JSAPI支付授权目录（注意路径层级与末尾斜杠）
- □ 商户平台 — H5支付授权域名（微信外场景必须单独开通）
- □ 支付宝开放平台 — 应用网关与授权回调地址
- □ 微信支付异步通知地址（必须HTTPS，且生产与测试环境分开）
- □ 支付宝异步通知地址（同上，分环境）
- □ 域名已完成ICP备案，且备案主体与商户主体一致
- □ HTTPS证书有效且证书链完整，无混合内容告警
- □ 退款回调与对账文件下载的服务端任务已配置
另外强调一点：测试环境与生产环境必须使用不同的回调地址。共用回调是很隐蔽的一类故障源——测试下的单把生产订单改了状态，或者反过来，排查时非常耗时。
五、安全与合规要点
- 金额一律以服务端为准：下单时前端只传商品ID与数量，价格、优惠、运费全部在服务端重新计算，不应信任前端传来的金额
- 密钥与证书不落前端：API密钥、商户证书只存在服务端并按环境隔离，不进代码仓库、不写在聊天记录里；离职人员的访问权限要及时清理
- 回调必须验签且幂等：验签失败一律拒绝并记录；同一笔通知可能被重复投递，处理逻辑要保证重复执行不会重复发货或重复退款
- 以主动查询兜底：不能只依赖异步通知，应有定时任务对「已发起支付但状态未终态」的订单主动查询，避免漏单
- 类目与协议核对：虚拟商品、预售、跨境、代收代付等场景在开通前要核对经营类目与签约协议，事后被认定超范围经营可能导致通道暂停
- 风控预案：H5链接可任意传播，同IP集中下单、退款率异常、页面被镜像盗用都可能触发平台限制。上线时就应做好下单频控与异常订单告警，并预先记录支付服务商的申诉入口与联系人
六、多入口下的账号统一
同一个用户很可能今天从短信在Safari里下单、明天从微信群点进来用JSAPI支付、以后又在小程序里买。如果每个入口各自建账号，会直接导致三个后果：会员等级和积分对不上、优惠券在一个入口领了另一个入口用不了、客服查不到用户的历史订单。
解决办法是在设计阶段就定好跨端唯一键。可行的方案是以手机号作为主账号标识（在下单或注册环节引导完成手机号验证），同时把微信侧的UnionID、支付宝侧的用户标识作为绑定关系存储，一个主账号下可挂多个第三方身份。这样无论用户从哪个入口进来，落到的都是同一个会员。相应地，订单查询与退款入口在所有端都要能看到全部订单，否则客服工单量会明显上升。
七、上线验证与常见故障排查
上线当天的验证顺序建议是：先在微信内用真实小额金额下一笔单走完支付，再在Safari里下一笔走H5支付，再下一笔用支付宝，然后把这三笔全部实际退款一遍，最后核对商户后台的对账单与自己系统的流水是否一致。三条通道都验证过、退款也通过，才算支付真正可用。
几类高频故障的定位方向：调起时报「商家参数格式有误」或类似提示，通常是支付授权目录或H5支付域名与当前页面不匹配；拿不到openid，检查网页授权域名配置与授权回调地址；支付成功但订单状态没变，检查异步通知地址是否可从公网访问、验签是否通过、是否被测试环境抢先处理；微信外拉不起客户端，先确认H5支付是否已开通，再逐个浏览器真机验证。
核心要点
- H5需按环境实现三套支付：微信内JSAPI、微信外H5支付、支付宝手机网站支付
- 商户号主体、公众号主体、域名备案主体必须是同一家公司
- 配置错误是主要卡点，上线前用域名核对表逐项打勾
- 测试与生产的异步通知地址必须分开，避免互相串改订单状态
- 金额在服务端计算，回调验签且幂等，并用主动查询兜底
- 以手机号做跨端唯一键，绑定各平台身份，避免一人多账号
八、下一步怎么推进
准备接入支付前，先确认三件事能省掉大量返工：主体资质是否统一（营业执照、公众号、域名备案是否同一家公司）、经营类目是否需要额外许可（决定商户审核时长）、生产域名是否已确定并完成备案（所有支付配置都依赖它）。整体排期与各阶段交付物见H5商城开发周期与流程，支付费率与短信等持续成本见H5商城后期维护成本，其他高频疑问见H5商城开发常见问题FAQ，也可以通过页面右下角的客服微信索取这份域名核对表的电子版。
