2018年9月

疑问

如果之前做过微信jssdk，初看文档会发现没有什么，流程无非就是后端签名，返还给前端

但是仔细想了想，没有配置物品的价值信息呀，在公众号h5页面也只是返还了签名

回头看看请求参数发现了端倪

微信订单id

一开始看示例值我理解的随便一串数字，其中的prepay_id为统一下单接口返回结果中的参数

重新开始书写逻辑

在这里我们使用的是h5支付，返回结果为 https://wx.tenpay.com/cgi-bin/mmpayweb-bin/checkmweb?prepay_id=wx151809054027204613d0ca330422xxxxxx&package=287231xxxx

只能采用截取url的方式了，获取到的prepay_id为wx151809054027204613d0ca330422xxxxxx

将prepay_id发回后端进行签名，返回

{
  "code": 1,
  "msg": "获取微信浏览器支付签名成功",
  "data": {
    "appId": "wx54c4e3c9a7xxxxxx",
    "timeStamp": "1537007685",
    "nonceStr": "5b9ce0458db30",
    "package": "prepay_id=wx151809054027204613d0ca330422xxxxxx",
    "signType": "MD5",
    "paySign": "A819D6551E9E3FE62BE612FA96000000"
  }
}

现在前端就可以愉快的使用WeixinJSBridge和JSSDK了

相关链接:

微信内H5调起支付
微信统一下单

出现invalid signature错误的情况真的很迷

  1. 文档最开始说不需要转义，后来我看到错误相关，说需要encodeURIComponent(location.href.split('#')[0])
  2. wx.config()中的nonceStr与后端进行签名时的noncestr不一样
  3. 动态获取url这个地方描述的很迷，没明确说明是需要使用后端提供签名的接口还是，前端发起请求时的url

总之就是，要使用ajax签名，前端需要encodeURIComponent(location.href.split('#')[0])将当前url作为参数，传入后端签名接口，后端如果是php，需要urldecode($_GET['url'])，再来获取jsapi_ticket进行签名，返回参数