单页面应用接入微信填坑之一（微信分享）

起因：使用react+react-router做了一个单页面应用，需接入微信支付与分享等功能。由于是个人第一次接触微信接入加之是单页面应用所以遇到了很多问题。所以这里记一下其中之一：分享功能！

微信官方说法：

所有需要使用JS-SDK的页面必须先注入配置信息，否则将无法调用（同一个url仅需调用一次，对于变化url的SPA的web app可在每次url变化时进行调用,目前Android微信客户端不支持pushState的H5新特性，所以使用pushState来实现web app的页面会导致签名失败，此问题会在Android6.2中修复）。

问题：

我根据这段话的意思每当URL地址变化我就调用了一次wx.config，于是就出现了以下几种状况：
1：安卓微信6.2.7版
无法成功分享

2：安卓微信6.5.7版
每次都能成功分享

3：iOS版微信
无法成功分享

解决办法：

1：安卓微信6.2.7版
将第一次进入页面的地址保存，之后每次页面改变（即URL变化），就调用一次config。url使用第一次进入页面的URL

2：安卓微信6.5.7版
每次URL变化都调用config，但是URL使用当前url

3：iOS版微信
只需要进入第一个页面之后调用一次

原因：

安卓微信由于版本问题不支持pushState的问题已在6.3.31修复了，所以只需要根据系统和微信版本做出相应的分享操作就行了。

这里给出两个方法用于判断：
是否为安卓客户端

function isAndroid() {
    var u = window.navigator.userAgent;
    return u.indexOf('Android') > -1 || u.indexOf('Linux') > -1;
}

微信版本是否大于6.3.31

function weixinVersion() {
    var str = window.navigator.userAgent;
    var v0 = [6,3,31];
    var regExp = /MicroMessenger\/([\d|\.]+)/;
    if (regExp.exec(str)===null) {return}
    var v1 = regExp.exec(str)[1].split('.');
    if (v1.length >= 4) {
        v1 = v1.slice(0,3);
    }
    v1 = v1.map(function(v){
        return parseInt(v, 10);
    });
    if (v1[0] > v0[0]) {
        return true;
    }
    if (v1[0] === v0[0] && v1[1] > v0[1]) {
        return true;
    }
    if (v1[0] === v0[0] && v1[1] === v0[1] && v1[2] >= v0[2]) {
        return true;
    }
    return false;
}

差不多讲完了，如果有没说清楚的地方，可以留言，希望能少让人掉坑里吧。
下一篇会讲以下微信接入支付遇到的坑。