[拜托大家帮帮我]vue项目,登陆后进入首页调某个接口会自动触发退出登录,但是其他页面调这个接口就没事?

我的问题:如题,登录系统后,进入首页,会自动触发退出登录,初次进入首页时,会调用3个接口:queryonequerytwoqueryhaha
经我排查后,发现是因为一个接口queryhaha
首页会加载queryhaha,然后这个接口就会触发我在前端封装的响应拦截器,提示登录失效。
我debugger了一下,发现这个接口响应的状态码是410,并且这个410是number类型的,而前端做的校验是半等==,所以会进入if判断走登陆失效。
其实我只要把半等==改成全等===,就可以解决这个问题,全等既要值一样还要类型一样。

但是有个地方我想不明白,我觉得这是服务器响应给我的状态码有问题,所以导致一登陆首页调用queryhaha这个接口,就会触发登录失效。
但是这个接口的数据,正常返回了,我也拿到页面上正常渲染了,所以就是:这个接口既走了if的登陆失效,又走了else的return res.data。

然后我又看了network和localstorage,我发现当触发登录失效后,走退出登录的接口logout,竟然没有触发localstorage.removeItem的userinfo和token,也就是说此时localstorage里面还保留着token。
接而我又查验了network,发现走了退出登录的接口logout之后,首页页面又重新加载了一次,然后又正常调用了queryonequerytwoqueryhaha这三个接口,这次queryhaha没有报410,也没有触发退出登录,其他功能也十分正常。

我想不通,怎么会这样,而且这个接口在其他模块也有调用过,但是都没有报410触发登录失效,就偏偏在首页触发了。
我几乎可以确定应该就是queryhaha这个接口的问题,因为首页只要不调这个接口,就不会触发登录失效。
可是我不明白,这是为什么,之前写这个项目的前端离职了,我是刚入职的,才写了几个模块,然后最新提交的模块,就是首页,领导说把我项目写坏了,他回退了一下后端的版本,说后端没有问题,就是前端的问题。

我都急死了,我就写写页面,登录我也没碰,并且我调试过程中一直正常,项目怎么就坏了呢,加上我目前排查到的情况,我只要把判断登录失效的==换成===就不会在有这个bug,可是我不明白,我想弄清楚原因。
为什么第一次调用接口服务器返回了410;
为什么触发了退出登录localstrage却没有被清除;
为什么首页又自动加载了一次;
为什么其他页面调用这个接口就不会触发410;

下面是我在前端封装的响应拦截器,其实也不是我封装的,是之前离职的那个前端写的,天地良心,我真的没动他的代码,请大家帮我看看。
image.png
我上面alert的都在页面出现了,按理说localstorage.removeItem应该是生效的,偏偏浏览器里面就是还存在token。

下面第一张是我在首页调用这个接口的写法,第二张是我在其他模块调用这个接口的写法,写法上其实我觉得没什么区别,只是一个异步,一个同步,我也有尝试把首页的接口改成异步调用,但还是会触发登录失效的操作。
image.pngimage.png

下面是我debugger的截图,调用queryhaha接口的时候第一次确实返回了410
image.png

这一张是我首页的加载network
image.png

拜托大家帮我看看,我真是要疯了,巨想之后这个事情的问题在哪,我回退到过之前那个前端最后一次提交的git,他在首页调用queryhaha这个接口确实是没出现这种问题,我不懂啊,我根据领导的要求重构了首页,改个页面怎么会把项目搞坏了呢?

阅读 3.7k
2 个回答

你既然发现了原来的版本没问题,可以对比一下新的和旧的代码调用queryhaha时的请求参数,请求头等信息,以及返回信息,看看是哪里不一样了,也许之前返回的不是410 ?。那个localstorage还存在token,你们是不是多iframe啥的?首页重新加载,chrome的Network里点击请求,是能看调用堆栈和调用文件的。

首先 第1 单独拿出来看是否报错 第2 你的拦截器是否正常,做了token 失效验证没有 第三 你在错误 回调里面处理 如果返回是401的时候 直接清除token 跳出登录页面
image.png

推荐问题