Vue单页面应用，IOS下JSSDK签名失败解决方案

问题描述：

---

Vue-router用的是history模式，在某个页面要应用jssdk，应用其中的录音等方法。Android下无任何问题，但是再IOS下会提示签名错误(invalid signature)。

报错信息

获取当前页面的url

问题根源

---

Vue-router进行路由切换的时候，总会操作浏览器的历史记录，从而相应页面url变化

在JSSDK文档中有这么一段话

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

这是因为在IOS上，无论路由切换到哪个页面，实际真正有效的的签名URL是【第一次进入应用时的URL】

比如我进入应用的首页是：http://localhost:8081/patientIndex 要应用录音的页面在：http://localhost:8081/myVisitDetail  那么在IOS上，无论你跳到录音页面中间跳多少次，真正有效的URL仍然是首页的URL。

解决方案

---

既然需要的是首页的URL，那么我们就可以在路由跳转的时候保存一下进入首页的URL，然后在录音页面判断如果是IOS系统，那么就使用我们当时记录的URL，如果不是那么就正常获取当前页面的URL就可以了，下面上代码

main.js进入路有前判断如果没有就记录URL

录音页面判断机型取不同的URL

将获取的URL传给接口返回配置信息

结束语

根据上述方法，IOS下的JSSDK报错的问题就解决了，但是在实际项目中，因为公众号没办法直接跳到我的首页，只能跳转到http://localhost:8081/ 就导致在路由守卫中我获取的URL是http://localhost:8081/ ，签名仍然报错。所以我就只好将获取URL的方法写在我的首页面中，路由守卫中做了一下处理

指定跳转到首页