00:00
大家好,我是学习地的特约讲师高洛峰,上节课咱们看到了创建实例的一个方式,这样的话,我们可以请求多个API的时候,不同域的API的时候呢,我们用到实例是比较好的,而且呢,每个可以单独设置这种呃,超时时间,那这节课我们看一下。呃,拦截器,这也是啊,A给我们提供的一个非常有用的一个功能,那拦截器呢,分为请求拦截器和响拦截器,什么意思呢?你比如说。我们这块是一个服务器的接口,这服务器接口这是我们的浏览器,我们浏览器,那我们浏览器里边呢,我们有R好吗?来画个图R,那它从这个位置请求服务器的时候,请求服务器,那服务器这个接口把数据带我返回来,它有两条路对吧?那请求拦截器什么意思?就是在请求没达到服务器之前,我们在这会拦截对吧?拦截它为什么?就看我们请求的数据里边,里边比如说我们请求的时间比较长,在这里边设置一些呃请求的动画啊对吧,一些处理,然后呢,响应的时候,我们可以服务器响应的时候,在没到达浏览器之前,那我们在这块可以处理,然后比如说处理这些数据啊,对吧?处理token的过期时间呢都可以,那请求拦截器呢,通常我们跟token合在一起用的比较多,比如说判断这个token存不存在对吧?如果存在的话,那我们就直接放行,让他可以登录,如果不存在的话,比如说我们加上token,对吧,然后再让他去请求,或者是直接让他重新登录等等。
01:27
这就是请求拦截器和讲拦截器两种,用起来呢也比较简单。我们如果直接用X来做拦截器的话,那是所有的都拦截对不对?但是呢,我们现在也可以单独为某一个实例做拦截器,比如说我在这个请求之前,那我针对这个实例进行一个拦截器。比如说work里边通过这个。通过这个方法里边,比如说我们做请求拦截器,就是request。Request,然后点又通过这个方法来设置拦截器,这里边呢一共有两个参数,一个呢是呃,第一个参数就是处理拦截的,我们可以写上写处理拦截的一些配置,然后呢,第二个参数就是如果错了对吧,有错误拦截的时候有错误怎么办?对吧?我们可以到这里面去。
02:18
处理,那如果这块。正常的一个拦截,那我们在这里边可以打印一个。啊,请求的拦截。蓝。接。成功处理一下,放行。等等,你想在这块处理什么,比如说加动画对吧,请求都加动画,你都可以在这做,然后直接那然几八音,当然了,咱们在登录的时候,对吧,处理套肯定是比较多的,那那个时候呢,我会在这块呃,专门处理登录,到时候再告诉你,你只现在你需要了了解的就是拦截器,在到达服务器之前拦截一下,补充一下数据对吧,加一些东西,也就是咱们在这块为每个请求带上参数对吧,比如淘N啊,时间戳啊,一些头信息设置啊,你比如说像这个。
03:04
我们配置的对吧。比如说我们先判断这个,呃,Token对吧,先从这window对象里边,这边我们看有没有这个token,判断有to存在,并且头里边加上这个了,对不对,那我们就是自动的放行。对吧,对,我们还得加上一个放行,不加放行都过不去,对吧,你在这块相一个节道了,你把它截住了,你不放行是不是一直卡在这啊,所以在这块如果放行的话,那我们直接返回这个肯can肺中,这相当于放行,这就相当于我们请求的所有的东西,直接放行,直接返回就可以了。那我们看一下现在有请求拦截器了。请求拦截器了,那我们现在在执行请求,通过这个实例执行请求的时候,它就会有这个的输出啊,先输入它再请求我们打包运行一下。来我们访问。刷新一下。你看请求拦截器拦截成功处理一下放心对吧,然后我们看这里边其他的我们注释掉吧。就放在这吧,下边你看还有这么多请求呢,对不对,这么多请求。
04:05
当然了。这个实例的时候,请求会调用它对吧。回调内容,这是请求拦截器,那么还可以配置响应拦截器。你可以通过这实例,也可以全局的所有的配置通过它第二。你。通过它点有里边的参数是一样的。IG。配置一下请求拦截器,假如说有错误的话,可以到这里边去执行,当然这个不用catch catch是在呃,这个实例后边的啊,你不用在这块后面加catch。只有通过Z和那个catch他俩是呃合作体,这个呢,不是就错误是在这里边去使用的啊。然后我们在这里边输出一下。这里边写上。从。服务器将数据。带回来了。带回来了对吧,放行应该说处理放行,那怎么处理呢?比如说我们判断服务器中返回的状态,状态码,那我们只放行,比如状态码是200的,其他的不放行等等,全可以在这处理。
05:11
来,我们看一下响应的时候会不会有。刷新一下,我得先打包,我把下边的所有的。这些都做到什么,看着过。数量。就留这一个,就留这一个,这样的话咱们看的比较清楚。来我们抓新一下,你看请求拦截,拦截成功它会自动执行到这执行对不对,但是呢,我们这块没有定义,没有数据,为什么?因为我们把它截到了,对不对,截到了我们没有放行啊,所以这里边我们得放行一下,放行才可以,虽然服务器发挥了数据,但是全给他截住了,没有一个放行的,对吧,所以我们放行它才能够过来,我们在这块才能够接到这个数据。请求回来的时候,在这个执行之前,对吧,先执行这个。
06:01
这叫想起,我还得打包。然后我们运行一下。啊,这回数据就回来了,对不对,你比如说这里边数据我们可以,因为这里边据我们都可以去找得到的,这个肯代表的不就是所有的数据嘛,对吧,那比如说有头信息要被的信息啊等等等等,那我们这里边直接就让它被要被其他数据我不要对吧。不然的话,其他数据我在页面里边用不上,服务器工返工这么多数据干嘛呀,那我们再编一下,你看放行只放行处理完之后根据条件判断,只放行我需要的数据。来上新。你看这里边儿就变得很简单了,只有这个数据了,对吧,只留了里面那个,当然了,我们可以根据这里边呢,它这个里边的头信息判断状态码,然后去处理,也就是在课件里边这块,你看判断通过这个。我们判断它里边的状态码对吧,然后呢,返回这块继续往下一次执行。咱们是直接反应跟他写法差不多少对吧,如果状态码不是二开头的情况就不是成功的,不是成功的,那我们让他到错误处理里边去,它就会直接跳转到下边的这个里边去处理。
07:08
就是在小安器里面处理的。好,这节课我们也比较简单,就是处理呃,它的一个拦截器的原因,好,谢谢大家,这节课我们就讲到这里。
我来说两句