vue history 微信jssdk受權失敗解決辦法

bug再現：

前提保證後端簽名都正確，個人是正確的，前端時不時會出現受權失敗的狀況。

IOS微信訪問vue history模式的頁面，

A頁面，須要微信受權，調用jssdk使用掃描二維碼接口，打開方式：直接從url進入或者別的頁面進入。

B頁面，支付頁，打開方式：須要從別的頁面進入。

直接訪問A頁面：微信受權正常掃一掃正常使用。從別的頁面進入A頁面，受權失敗，提示【invalid signature】。

B頁面一直正常。

問題緣由：

ios的微信在vue使用history模式時，當前的「地址欄」的url不是真實的當前頁面的URL，而是第一次進入的url，也就是說，

當用戶在操做頁面的時候，不管進了幾個頁面，跳轉到哪裏，當前頁面是什麼，當前地址欄的url始終是第一次進入的url。

解決辦法：

在vue-router的index.js裏

router.afterEach(async (to, from) => {

  if (window.__wxjs_is_wkwebview) { // IOS
    if (window.entryUrl == '' || window.entryUrl == undefined) {
      var url = baseLocation  +
        to.fullPath
      window.entryUrl = url
      console.log('IOS', window.entryUrl)
    } else {
      console.log('IOS2', window.entryUrl)
    }
  } else { // 安卓
    window.entryUrl = baseLocation +
      to.fullPath
  }

})

意思是定義一個全局變量，這個變量等於第一次進入的地址

在須要受權的頁面裏：

    async wxInit() {
      console.log("受權地址", window.entryUrl);
      //這裏單獨提出來
      let data = await http.go(
        api.getSignature,
        { url: window.entryUrl },
        true
      );
      if (data.no == 1) {
        await wx.config({
          debug: false,
          appId: data.obj.appid,
          timestamp: data.obj.timestamp,
          nonceStr: data.obj.noncestr,
          signature: data.obj.signature,
          jsApiList: ["scanQRCode"]
        });
      } else {
        this.$toast("請刷新頁面再試");
      }
    },

後端簽名的地址使用這個全局變量便可