一. 微信公众号支付的流程

公众号的页面会在微信环境下打开,所以默认已经有登录态。openID、AppID、AppSecret 都能拿到,申请开通商家支付之后会有 PayKey 和 mch_id (商家帐号,类似 101000000 之类的数字)。

商家要完成一次支付需要首先完成下列步骤:

  1. PrePay 接口。

    获取 prepay_id (服务器端)。请求微信的统一下单接口(我们叫他 PrePay接口),生成 prepay_id。

  2. Wx.config 接口。

    根据 jssdk 的文档生成 wx.config 参数并注入到前端 js 中,请求 chooseWXPay 的权限。

  3. Pay.config 接口

    生成 pay.config 注入到前端页面的 js 中,然后调用 jssdk 中的 chooseWXPay 来唤起微信支付。

  4. 回调接口

    获取微信支付的回调(异步的),确认支付结果。

其中步骤 1、 2、 3 是最坑的。

二. 接口之间的关系

要唤起支付必须同时满足三个条件:

  1. 从接口 a 取到 prepay_id

  2. 发起支付的前端页面同时配置好正确的 wx.config 和 chooseWXPay

  3. 发起支付的前端页面配置过支付域名和目录信任

三. 为什么说官网文档是苟曰的

  1. PrePay 接口的 sign Hash 方法必须跟 pay.config 的 sign Hash 方法保持一致。推荐 MD5。

  2. PayConfig 的 sign 计算的时候要带上支付 Key ,就是商家支付后台设置的 pay key。

  3. Wx.config 中的 timestamp、noneStr 必须跟 PayConfig 中的 timestamp、noneStr 一致。

换句话说:

要用 chooseWXPay 唤起支付,必须保证 sign 的 Hash 方法同 PrePay 接口的 Hash 方法一致,同时
timestamp、noneStr 参数同 WXconfig 接口保持一致。

四. 官方文档中的坑:

  1. 参数遗漏

遗漏了一个 key (商家支付后台设置的支付 key)
正确的参数模板:

    signTemp := "appId=%s&nonceStr=%s&package=%s&signType=%s&timeStamp=%d&key=%s"signString := fmt.Sprintf(signTemp, payObj.AppID, noneStr, "prepay_id=" + prePayID, signType, ts, payObj.PayKey)logs.GetLogger().Println(signString)paySign := util.MD5Sum(signString)
  1. 前后矛盾。

    支付文档中写到唤起的方式是: WeixinJSBridge.invoke ,但是 jssdk 中却是 chooseWXPay。

  2. 提示信息坑爹。

    choosewxpay fail 没有任何有价值的信息,同时微信web开发者工具无法唤起模拟唤起。

五. 教训和总结

  1. 微信前端的小明同学都说这个很坑。我打热线电话打不进去,找不到开发接口人,发邮件没人回复;

  2. 这种完全依赖第三方的功能,如果文档无法提供完整的信息,开发者很头大。

  3. 大公司内部的文档没有统一标准,jssdk 和微信支付属于不同的部门,互相之间权责不清。

以上证明: RTFM 名符其实。这篇文章背后消耗了很多的咖啡和香烟,各位如果觉得有帮助请打裳几毛。

EOF

RTFM:腾讯微信公众号H5页面使用微信支付爬坑记相关推荐

  1. 微信公众号H5页面开发--微信JS-SDK引用

    微信公众号H5页面开发–微信JS-SDK引用 微信提供了微信公众号开发者手册,官方地址:https://mp.weixin.qq.com/ 公众号内许多复杂的业务场景,都是通过网页形式来提供服务,这时 ...

  2. 前端实现微信公众号h5页面跳转小程序-成功案例

    微信公众号h5页面跳转小程序-成功案例 微信公众号h5页面跳转小程序-成功案例,标题已经明确说明,h5页面可以正常跳转微信小程序 官网说可以,不是我说的 文章目录 微信公众号h5页面跳转小程序-成功案 ...

  3. 微信公众号h5页面跳转小程序

    微信公众号h5页面跳转小程序 文章目录 微信公众号h5页面跳转小程序 前言 一.注意 二.使用步骤 步骤一:绑定域名 步骤二:引入环境 步骤三:初始配置 前言 问:h5 页面可以跳转至微信小程序吗? ...

  4. 利用python生成微信h5_Python + Appium 微信公众号 H5 页面自动化测试

    本文内容在以下环境运行成功: Windows10 Python2.7 android-sdk_r24.4.1 Appium-windows-1.15.1 chromedriver_2.40 小米手机 ...

  5. 微信公众号H5页面支付JSAPI

    1:在微信环境下,我们需要获取到code,拿code去获取openid,在获取openid的时候有2种参数分别是:snsapi_base和snsapi_userinfo,snsapi_base只为获取 ...

  6. 微信公众号H5页面获取用户昵称头像等信息(Java)

    H5页面获取微信用户信息操作流程 (一)获取微信权限,由微信用户确认 (二)获取相应的ACCESS_TOKEN和OPENID信息 (三)根据ACCESS_TOKEN和OPENID信息获取相应的用户信息 ...

  7. 微信公众号H5页面开发怎么获取用户openid

    微信公众号里会嵌套h5页面然后跳转,有时候我们就需要用到用户的openid,今天就为大家介绍一下公众号h5页面怎么获取openid 首先,需要用到公众号的appid,其次需要去公众号里配置好h5页面的 ...

  8. 微信公众号h5页面禁止用户调整字体大小

    微信公众号内 h5页面,使用计算后的单位 rem 时,用户调整字体大小会导致页面字体.元素的宽高变大活变小,导致页面布局错乱 使其拖拽后禁止修改页面基础字体大小 this.prohibitAndroi ...

  9. 微信公众号H5页面实现扫一扫功能

    uniappH5实现扫一扫功能 最近遇到一个需求,H5页面使用扫码绑定设备功能,因为uniapp uni.scanCode API H5不支持,网上找了很多方案不合适,因为这个项目是在公众里面运行的, ...

最新文章

  1. 在物理机上用u盘安装linux遇到的问题
  2. 2016 ICPC World Finals -Ceiling Function
  3. apache kafka源码分析-Producer分析---转载
  4. 电脑换ip_代理ip地址怎么换
  5. GG and MM(every sg 游戏)
  6. 均值滤波器类型_均值滤波适用于处理什么样的噪声
  7. Python实例 61,62
  8. 《C++0x漫谈》系列之:右值引用
  9. Numpy | Python列表与Numpy数组对比
  10. 小米平板5采用120Hz高刷LCD屏:纯平中框+侧面指纹
  11. html5 原生 弹窗,HTML5 Popmotion.js实现的弹窗控件
  12. 物联网99%是中小企业 引发赚快钱担忧
  13. [BZOJ 1025] [SCOI2009] 游戏 【DP】
  14. 支持下一代分布式应用链开发的区块链服务互联网
  15. java实现word文档形式导出(含多级表头)
  16. 安兰德《源泉》读后感:愿年轻人都能有志气
  17. jupyter notebook import tensorflow as tf 报错解决
  18. TBschedule入门
  19. 树莓派PICO入门:电脑连接简易树莓派PICO单片机,烧录,使用python进行简单代码操作。
  20. 【点灯科技+esp8266+小爱同学】实现语音控制的米思齐代码和arduino代码

热门文章

  1. 排队论模型(七):排队系统的优化
  2. 微信链接修改图片_微信链接修改图标
  3. C++的字符串输入方式
  4. Vue 实现拖拽模块(二)自定义拖拽组件位置
  5. Review KD(2)
  6. 面向大数据异构系统的神威并行存储系统
  7. Docker修改无法启动的容器的配置文件
  8. 23电工杯数学建模B题
  9. BitmapFactory压缩图片
  10. Windows系统各个版本的ISO镜像下载地址