在 react 项目中使用微信 JS-SDK 填坑笔记

---

UPDATE

现在 android 的微信（6.3.31）已经修好了，需要按照文档说的传入当前页面的url，也就是没吃豆重新 config 一次，但是苹果的微信只要在进入页面的时候 config 一次就可以了，微信管接口的估计是个锤子。

---

在做图片上传的时候，图片太大老是上传失败，在产品汪（☁️）的建议下用了微信的 JS-SDK，微信会处理压缩，而且还有顺带连预览也解决了，好开心。

后来一发布，整组人感觉不好了。主要问题出现在 url 的配置上。

微信的官方文档是这样说的:

同一个url仅需调用一次，对于变化url的SPA的web app可在每次url变化时进行调用,目前Android微信客户端不支持pushState的H5新特性，所以使用pushState来实现web app的页面会导致签名失败，此问题会在Android6.2中修复

实际测试中发现，配置的 url 并不是调用微信 js 的时候所在页面的地址（也就是通过 location.href 获得的地址），而是在进入到网站的第一个页面的地址，这是第一个问题

第二问题是在苹果手机的微信上面，只要调用 wx.config 一次就可以了，但是在 android 的手机，在页面跳转之后，要重新调用 wx.config（url 依然是进入网站的第一个页面的地址，要保存在一个变量里面），"X5 浏览器"， 我他妈就呵呵了。如果用了 react-router 的话，直接在 Route 组件上绑定一个 onChange 方法就可以了

function routeChange(pre, next) {  wx.config(getWxConfig());}