vue 中解決移動端使用 js sdk 在ios 上一直報invalid signature 的問題解決

最近項目需求,需要一個上傳多張圖片的功能,但是出現的問題是在安卓端是沒有問題的,但是在ios上一直都是 invalid signature,但是刷新頁面就沒有問題了。

Vue主打,router使用history模式,外加微信JSSDK套餐

排查了各種情況總是找不出原因,而且神奇的是在安卓上可以正常獲取位置,就只是在ios上一直“invalid signature”,打印出來的當前url跟簽名的url也明明是一致的,為什么還是簽名有問題呢!!???


頁面的結構如下:

SPA:

  • 頁面A
  • 頁面B

非常簡單,整個應用從A進入,然后跳轉到B,B需要獲取位置,我也只是在B里面配置微信的JSSDK,然后就遇到了前面所說的問題。然后,在某一次調試的時候,我就直接從B頁面刷新了,然后就可以了!

從B刷新加載的每一次都是那么絲滑,而從A到B,每一次都被槍斃,所以抱著這個問題,我來到了這個新世界 ---- 關于html5-History模式在微信瀏覽器內的問題

原來。。。

IOS:微信IOS版,微信安卓版,每次切換路由,SPA的url是不會變的,發起簽名請求的url參數必須是當前頁面的url就是最初進入頁面時的url

Android:微信安卓版,每次切換路由,SPA的url是會變的,發起簽名請求的url參數必須是當前頁面的url(不是最初進入頁面時的)

解決方案

判斷是不是ios或者是安卓 然后在 beforeRouteEnter 做操作。

beforeRouteEnter (to, from, next) {
  var u = navigator.userAgent;
  var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios終端
  // XXX: 修復iOS版微信HTML5 History兼容性問題
  if (isiOS && to.path !== location.pathname) {
    // 此處不可使用location.replace
    location.assign(to.fullPath)
  } else {
    next()
  }
}

這樣子就就解決了。

?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。