BUG 记录: 微信 H5 授权后重定向页面显示问题

情景:

微信 H5 ,需微信授权项目,
在 mixins 的 globalFunction 中(自己写的),写了如下代码:

created(){
  let sessionId = this.getSessionId() || this.getUrlParam('sessionId');
  if(!sessionId) this.getAuthorize();
  else sessionStorage.setItem('sessionId', sessionId);
},
methods: {
  // 获取授权
  getAuthorize(){
    console.log('getAuthorize');
    this.$api.authLogin({redirectUrl: 'http://xxx.com/index.html#/'}).then((res)=>{
    window.location.replace(res.data);
  })
},

而 this.$api.authLogin 请求就是后台执行重定向到微信授权,然后重定向回参数 redirectUrl 的地址(也就是 res.data)。

问题:
http://xxx.com/index.html#/index 页面打开后,会全局都请求获取授权,然后发现授权回来的页面空了,开始以为是 index.vue 哪里有代码错误,导致页面出不来,折腾无果。后来检查这个页面的链接发现,没有 hash 值,也就是:http://xxx.com/index.html#/ ,猛然想起授权后的重定向,检查发现,当时写的 redirectUrl 值为 http://xxx.com/index.html#/,所以,这个页面是没有加载 index.vue 的,并不是出错了,仅仅是没加载。
但我明明在 router 的 routes 里面写了 '/' 的重定向规则的,为什么...
猛然又想起了什么...今天同事问我这个 '/' 的用处,我注释掉了后给他看了一遍执行结果的区别。然后居然就忘了解开注释。

// 重定向
// {
//   path: '/',
//   redirect: '/index'
// },

Ctrl + /  !!!


搞定。。。。。。
 

另外,这句代码可以优化一下,减少一次重定向,

this.$api.authLogin({redirectUrl: 'http://xxx.com/index.html#/index'})


仅记录。
 

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值