微信内部浏览器 H5 支付(JSAPI 支付)和微信外部浏览器 H5 支付总结

微信内部浏览器 H5 支付（JSAPI 支付）和微信外部浏览器 H5 支付总结

一、微信内部浏览器 H5 支付（JSAPI 支付）

使用场景：
用户通过微信扫码、关注公众号等方式进入商家 H5 页面，并在微信内调用 JSSDK 完成支付。
关键区别：
微信支付需要获取 openid，而分享不需要。openid 是微信用户在公众号 appid 下的唯一用户标识，用于永久标记一个用户，同时也是微信 JSAPI 支付的必传参数。
支付方式：
使用微信浏览器内置对象 WeixinJSBridge：
代码示例：通过 WeixinJSBridge.invoke 方法调用微信支付，需要传入 appId、timeStamp、nonceStr、package、signType 和 paySign 等参数。
注意事项：WeixinJSBridge 内置对象在其他浏览器中无效，需检测其是否存在并做好兼容处理。
使用微信 JS-SDK：
步骤一：绑定域名 - 在微信公众平台设置 JS 接口安全域名。
步骤二：引入 JS 文件 - 在页面中引入微信 JS-SDK 文件。
步骤三：通过 config 接口注入权限验证配置 - 配置 appId、timestamp、nonceStr、signature 和 jsApiList 等参数。
步骤四：通过 ready 接口处理成功验证 - 在 config 验证成功后执行相关操作。
步骤五：使用 chooseWXPay 接口调用微信支付 - 传入 timestamp、nonceStr、package、signType 和 paySign 等参数发起支付请求。

二、微信外部浏览器 H5 支付

使用场景：
用户在微信以外的手机浏览器请求微信支付的场景，用于唤起微信支付。
注意事项：
H5 支付不建议在 APP 端使用，如需在 APP 中使用微信支付，应接入 APP 支付。
在 APP 内嵌的 H5 页面使用微信 H5 支付时，支付成功回调可能存在问题，如安卓手机可能跳转到首页而非指定支付成功页。
解决方案：
通过保存待支付的订单号，调用后台接口轮询订单支付状态。
在 iOS 设备上，可能遇到支付成功后跳出第三方 APP 打开 Safari 浏览器的问题，需通过判断历史记录长度进行特殊处理。
开发步骤：
参考微信官方体验 demo 进行开发，确保兼容微信内部 JSAPI 支付和微信外部 H5 支付。
在代码中实现兼容逻辑，根据支付环境（微信浏览器或外部浏览器）选择合适的支付方式。

三、总结

微信内部浏览器 H5 支付（JSAPI 支付）和微信外部浏览器 H5 支付在支付场景、关键区别、支付方式及开发步骤上均有所不同。开发者需根据实际需求选择合适的支付方式，并注意处理各种兼容性和回调问题，以确保支付流程的顺畅进行。

热门标签