Vue history路由模式下SDK微信授权爬坑总结

微信分享的流程：

1. 进入某个页面后将该页面的 url 通过 sha1 算法加密后传给微信，微信会返回一个验证签名。
2. 在从后端拿到返回的签名配置后，需要调用 js-sdk 的 wx.config 将拿到的配置进行 js-sdk 的初始化。
3. 初始化完成后需要调用 js-sdk 的 wx.ready 方法。

授权失败如果提示 config:invalid signature ，这个错误一般是由于 url 传递不正确导致的，当然也可能有其他的原因。

vue-router 默认采用的是 hash 模式

这种模式下路由后面会加上一个 # 号，在传给微信请求签名的时候需要把这个 # 去掉，比如：

location.href.split('#')[0]

vue-router  history 模式 

在 router.afterEach 中通过 location.href 拿到的 url 是要跳出的页面的 url 而不是要进入的页面的 url，可以通过以下代码来观察拿到的 url 

router.afterEach((to, from) => {
    alert('to-----------' + to.fullPath)
    alert('from-----------' + from.fullPath)
    alert('router-----------' + location.href)
})

模式url 可以通过域名加路由的方式拼接出来，注意子域名(/mob)

location.origin + '/mob' + to.fullPath

特别注意：在 ios 中，只能用第一次进入应用时的 url 去请求签名才能验证成功，这是因为Vue项目在切换页面时，IOS中浏览器的url并不会改变，依旧是第一次进入页面的地址，所以需要将第一次进入应用的 url 在store里存起来，当路由变化时还是使用第一次的 url 去请求签名。而 Android 不需要这样特殊处理，这也是微信授权的一个深坑

 // 判断是否是ios微信浏览器  
 if (window.__wxjs_is_wkwebview === true) {
    url = store.state.url
  }