解决公众号微信SDK IOS调用API失败问题

缘由

微信公众号引用微信SDK API时，发现安卓可以正常使用API的功能（拍照，预览、定位等），但IOS总是报SDK invalid signature导致调用失败，基本上提示配置异常都是url的锅了

分析

首先我们知道，sdk初始化时需要拿我们当前的url作为签名url，随后交换获取wx.config的信息，再次调用wxsdk api时，会校验签名地址与签名地址是否一致

但是调用的签名路径其跟当前路径是一致，并没有问题

随后发现当存在路由切换的时候才会出现这种现象：
在SPA下

打开A，随后跳转到B，签名是在B实现的，就无法使用

直接打开B，正常使用

随后找出了问题所在，在IOS下，router切换的时候都是浏览器的历史记录，所以url其实都是一开始进入的url，每次签名只能使用首次打开SPA的url，也就是当你第一次打开A，再跳到B，也只能拿A去签名

解决

当然，解决办法可以很多，围绕着这个思路，抹平安卓与IOS SPA的差异性即可，我这里说一下我的做法（我使用的是React）

封装例子：

class wxTools {
	url = '';
	isAndroid = navigator.userAgent.indexOf('Android') > -1 || navigator.userAgent.indexOf('Adr') > -1; 	// 判断是否为安卓

	// 在SPA入口缓存一开始的真实url
	setWxSignUrl() {
		if (this.url === '') {
	// 使用#分割是因为如做分享等功能，微信会在重定向时加入参数影响url结果
			this.url = document.location.href.split('#')[0]
		}
	}
	// 真实界面获取url进行签名，如是安卓则直接使用，如IOS则取一开始的真实url
	getWxSignUrl() {
		return this.isAndroid ? document.location.href.split('#')[0] : this.url
	}
}

export default new wxTools();

入口初始化：

import wxTools from './wxTools';

useEffect(() => {
	wxTools.setWxSignUrl();
}, [])

调用例子：

import wxTools from './wxTools';
wxSignInit(){
	const signUrl = wxTools.getWxSignUrl();
	// TODO 拿signUrl去签名动作
}

done!!!