vue项目中微信jssdk在ios签名失败

一、问题描述

  1. vue项目中微信jssdk签名时,在安卓和ios是有差异的,签名时使用的url=window.location.href.split('#')[0],此时在安卓没问题,在ios会导致签名失败。因为在安卓中应该拿去签名的URL就是每个页面的URL,在ios中拿去签名的URL应该是微信分享时的URL(这个是我自己猜的),微信会对ios页面链接做处理,我们复制到的链接有时是刚进入项目时的链接而不是当前页面的链接,多刷新几次的话可能就是当前页面的链接,总之这个是ios微信的bug,官方建议使用 hash路由解决,官方文档说明  https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/iOS_WKWebview.html

      

  2. 报错config:require subscribe,关注公众号后才能签名。

二、解决方案

  1. 使用hash路由

    使用hash路由时安卓ios都是没问题的,这也是官方的建议。

  2. history路由里使用 <a href=""></a>

    简单暴力使用a标签去跳转签名的页面,也就是说A->B,在B页面做签名的话,在A页面的跳转方式不用vue路由跳转,改用a标签跳转,这个时候获取到的URL是可以签名的。但是因为我们使用的是a标签去跳转的,所以在B页面用vue路由离开守卫监听不到回退事件,在B页面有用户未保存需要提示的话就不行了,否则可以使用此方法。

三、其他方案

  有人说在刚进入页面的时候保存URL在其他页面做签名,那如果在别的页面刷新几次的话还是会签名失败的;
  有人说在全局的路由守卫里做ios的判断用对应的完整URL做签名,反正我没测试成功。。。

原文地址:https://www.cnblogs.com/zhangruiqi/p/11596196.html