iOS 的微信浏览器有一个巨坑,使用 pushState 改变 url 后,此时 location.href 确实变化了,但是微信浏览器认为地址还是打开页面时的地址,这个可以从“在 Safari 中打开”看到。

所以下面的代码就会导致 JSSDK 在 pushState 后验证失败,报错 invalid signature,原因如上。

import wx from 'weixin-js-sdk';

export function initWX() {
    getConfigFromServer(location.href.split('#')[0])
        .then((response) => {
            wx.config(response);
        });
}

// ...监听路由变化
$router.onUpdate(() => {
    initWX();
});

解决方法

首先按照正常的地址进行计算签名,如果失败,就按照页面刚进入时的地址来计算。

// 进入应用时先记录进入时的地址
global.originalUrl = location.href.split('#')[0];

// initWX方法添加error事件
export function initWX(url = location.href.split('#')[0]) {
    getConfigFromServer(url)
        .then((response) => {
            wx.config(response});
            wx.error(() => {
                initWX(global.originalUrl);
            });
        });
}

--再怎么看都没有啦|´・ω・)ノ--