前端代码
axios.request({
...// 请求config
}).then(
res => console.log('success',res),
err => console.log('err',err)
)
如上,这是一个普通的请求,一个请求成功回调,一个请求失败回调,当服务器响应时会打印对应的信息
需求
若后端返回错误码401,前端重新进行登录授权
问题
通常情况下,前端请求后台接口,如果参数不正确或者验证不通过,后端会返回响应码200,然后具体的错误码和错误信息放在response里;但是这次做项目时,后端用了某框架做了封装,遇到验证失败时,response里依然是错误码,错误信息,但是请求的响应码是401,这就导致前端的ajax请求进入error处理回调,为了正常实现上面的判断401进行重登陆需求,讲道理,只要在err的callBack里 判断response.响应码是不是401就行了,所以我测试了一下,在控制台打印错误详情

好吧,输出的是个Error对象,居然没有response,这可怎么办,没有办法判断响应码怎么实现这个需求呢?
没办法,试了各种方法,拦截器,设置validateStatus,都不能根本解决问题,但是原生xhr随便就可以做的判断,axios怎么可能做不了呢?于是开始探索源码之路…
首先,再看一下控制台的输出
发现栈中,最后是在createError.js中,于是在axios包目录下找到了这个文件

点进去,查看代码

通过源码,不难发现,原来在回调中,把response放在error的属性里了,但是error对象在打印时默认是看不到内部属性的,所以才会误以为没有response,结果通过判断err.response判断响应信息就能实现需求了!
博客围绕前端请求展开,需求是后端返回401错误码时前端重新登录授权。但项目中后端封装使响应码为401时,前端ajax进入error回调且打印的Error对象无response。经探索axios源码,发现response在error属性里,通过判断err.response可实现需求。

711

被折叠的 条评论
为什么被折叠?



