zoukankan      html  css  js  c++  java
  • 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("请刷新页面再试");
          }
        },

    后端签名的地址使用这个全局变量即可

  • 相关阅读:
    记一次博客被日的分析过程
    省钱版----查找 IoT 设备TTL线序__未完待续
    于bugku中游荡意外得到关于CBC翻转攻击思路
    清除浮动技巧总结
    程序猿的幸福
    Memcachedclientutils类
    leetcode 2 Add Two Numbers
    arduino小车入门教学——第三天(arduino基础)
    SAP MM模块 经常使用函数
    Java代码格式
  • 原文地址:https://www.cnblogs.com/6324/p/10478618.html
Copyright © 2011-2022 走看看