00:00
哈喽,大家好,这个小节我们来介绍一下Excel当中一个比较重要的功能,那就是拦截器。啊,拦截器它是什么呢?其实拦截器就是一些函数。啊,一些函数。而蓝晶气呢,它分为两大类。意大利呢,称之为请求拦截器。第二大类称之为响应来电器。那么这些请求拦截器,它有什么作用呢?请求来源器,它的作用是在发送请求之前。我们可以呢,借助一些回调啊,就是借助一些函数来对请求参数和内容做一些处理和检测。如果说都没有问题,再去发送请求。如果说有问题,这个请求我们可以直接停止取消。不让他去发送请求,所以说请求拦截器就像一道一道关卡一样子。
01:00
就是满足条件我放行啊,如果说所有的请求连都是OK的,我让你去发送请求。这是请求连接器它的一些作用。下边另外呢,是关于响应拦截器。当服务器返回来结果之后,我们知道是可以通过自个儿指定的指定的回调来处理结果的。那么响应来电器呢,它可以在我们处理结果之前。先对这个结果做一些预处理。比如说失败的啊,我们可以呢,对整个的失败结果做一个提醒,或者做一个记录。再比如说我们还可以对数据结果呢,做一些格式化的处理。然后呢,没有问题再交由啊,我们自己自定义的回调来去处理,如果说有问题,那直接在拦截器当中啊,在响应拦力器当中处理掉就可以了,就我们就不需要处理失败的结果。
02:00
所以说他们其实就像一道一道的关卡。啊,请求拦截器啊,可以对请求数据做处理啊,满足放行,不满足停止啊响应拦截器呢,也是一样子,对结果呢做处理啊,做检查,如果都没有问题,放行交由用户去处理,就交给我们程序,就交给我们自己去对这个成功的结果做一些,呃,就是个性化的处理,如果说失败了,失败我们就用统一的方式对错误的结果做处理。那好,这是当前呢,我们对请求拦截器和响应拦截器做这个介绍,那下边我们就来演示一下这玩意儿怎么来怎么去用啊。这块的话,为了方便,我们就不单单独去手写了,直接复制一份把它拿过来。东西比较多,所以说呢,我们这样来做啊。啊,就是复制过来之后,把注释一清空。写上这个中文注释添加。啊,比如添加设置吧,设置一个请求拦截器。
03:05
好,然后这一块我们先不加啊,这块也不加,我们做一个输出内容CAno.log。请求。拦截器。搞定啊,然后呢,下边这个地方,这是成功的一个情况啊成功。下边这个呢,是请求拦截器失败。好,那下边这个位置,咱们再来一个啊设置。响应拦截器。里边注释英文注释咱们也不看它了啊,直接再写一个输出内容响应拦截器。成功。这个地方。把它复制一份拿过来,响应拦截器失败。呃,你会发现一点啊,就是。我们教了一个方法,叫柚子。里边传来两个回调啊。这个成功的和失败的。
04:02
成功的和失败的啊,一看到成功和失败这么两个回调啊,你就应该想到这玩意儿它跟谁相关的,它跟promise相关。而且其内部原理也确实是由promise啊Z方法来去对这个成功和失败回调做指定的。好了,呃,完成之后呢,咱们下边开始发送一个请求。发送请求,来一个Excel括弧啊,Method等于一个get。然后URL啊,这里的话,咱们就给本地去发了啊HTTP,然后local host3000。再加一个posts去发一个请求。然后呢,一起来看看结果,Response。啊,Log打印一下成功的结果。那么这个代码的执行顺序是什么呢?目前来看啊,咱们没有失败的情况啊,所以说的话,他应他应该先到这儿。啊,先走这儿。走这个请求。
05:01
拦截器,然后呢,没有没有错误,哎,咱们就去发送请求,发送完请求之后呢,再交给响应拦截器去处理。啊就是,然后就是走哪走这个啊响应拦截器,最后呢,由我们去执行,呃,这个最终的结果处理,所以正确的结果应该是谁啊,应该是请求拦截器。啊,然后呢,响应连接器,然后呢,再是啊,我们自己指定的毁掉去处理。好,点开一起来看一看。刷新一面看这啊,请求拦截器成功,请求拦截器所呀是响应拦截器成功,最后是咱们的自定义回调处理啊,这里面看看能更加清楚一些,我这也做一个说明,Cons log。啊,自定义回调。处理。成功的结果。好,点开它刷新页面。好完成啊,完成之后呢,我们接着往前演示。啊,也就是说,呃,咱们先先先先别急啊,我再说明一下,就是请求在开始的时候,他先走哪先走这个成功的回调啊,成功的是是先走的是请求拦截器成功的回调。
06:11
然后呢,再去走响应来截器成功的回调,然后再去走自个儿的这个自定义的呃,成功的回调,那么假如说呢,我在这儿呢,不写return了,我写了一个什么呀,写了一个return promise.reject或者说我直接through了。参数出了问题。啊,在这你一定要对promise有一个比较,呃,就是清晰的一个理解啊,如果说对不理解的话呢,这块大家是呃很难搞懂的。看一下啊,假如说我这失败了,失败的话呢,咱们都知道它会返回一个失败的promise,失败promise的话呢,他在执行后续回调的时候呢,他就走不了成功了。这走不了,他只能走哪,他只能走失败的回调。
07:01
所以说它就会到这儿。所以这个代码它的运行内容应该是请求来电器成功,这个内容它先输出。下边的话就走不了成功了啊,因为这你抛出这抛出这个数据了,你就失败了,失败的话到这儿啊,走一个二。响应拦截器失败。而且你的返回结果也是一个失败的promise,那这样一来的话呢,咱们后续自己成功的回调就不能执行了。啊,就只能走这个失败回调了,我们可以来一个cash。好,来一个a reason。当然这个型材名字可以随便写,Cons log自定义失败的这个。这个回调。好,一起来看看效果。刷新页面瞅一眼看请求拦截器是成功的,响应拦截器呢失败的,自定义这个回到这块也是失败的。啊,所以它的顺序呢,就发生了变化啊,走到这儿。然后呢,走这儿,走到这儿之后呢,再走下边儿这个失败的。
08:02
这就是他的一个特点,其实这块跟promise就非常非常像了啊,非常非常像。好了,呃,至于其内部的原理是怎么一回事,咱们后边再讲的圆码再去说啊,这里还有一个小的小的点,我们演示一下啊,我把它复制一份。再加一个请求蓝音器啊,我们这儿呢去区分开这个呢是一号。一号请求燃器。然后这呢,咱们再来一个哎二号。啊,二号这个请求连接器啊,那这个地方咱也就不去写错误了啊,就先写成成功的。啊,满足这个就是先按照正常这个这个这个规则去走。然后响应连接器,咱们这儿也是一样。啊,这块呢,是一号。一号。然后下边这个响应拦截器二号。搞定。
09:00
这个代码我们一起来看看它的执行顺序啊,常规思考大家可能会这样去想,诶,我这是一号成功了啊,然后呢,请求燃器的话,这应该是二号,它执行,然后响应一号。然后呢,响应二号,就是顺序应该是1212,最后呢,走自个儿成功的这个回调。呃,是这样一个顺序,但是呢,这个结果跟咱们预想的不太一样,刷新页面瞅一眼。大家看这这个结果呢,是请求拦截器二号先执行。啊,是他。先执行。它是先执行的,然后呢,是谁呀,是他。他完了之后呢,才是他。也就是响应拦截器一号,然后呢,是响应拦截器二号。哎,就是这位这样的一个顺序,为什么是这样一个顺序呢,你先别急啊,咱们后边也是一样啊,在讲到圆满之后呢,你就知道为什么。这个请求拦截器是后镜先执行,而响应拦截器是先进先执行了,现象你先看到,然后后边我们再去给大家演示它的原理。
10:11
好,那在这儿的话,我们还需要讲一些内容。讲什么内容呢?就是这个config参数,以及response响应这个参数。Config是什么呢?Config。就是。这个配置对象。也就是说,在请求拦截器当中,我们是可以对config进行处理的。进行调整的。例如说我可以在这儿呢去修改。啊,修改config中的参数。举个例子啊,我们可以来一个con点等于对象A冒号100。然后return肯。这样一来,我就在请求拦截器当中对请求的参数做了一个设置,做完设置之后,我们来看看他到底有没有变化,注意之前的是没有加这个参数的,然后呢,我刷新页面瞅一眼,你看这A100就来了。
11:09
我在这加了一个参数,下边呢,我在请求拦截器二号里边也可以对内容做修改,比如说修改config这个参数。我还可以变啊,比如说con点啊,咱们加一个timeout,举个例子等于个2000,我这也可以加。啊,所以说在请求拦截器这个地方,是可以对请求参数去做设置的。而响应结果这块同样道理,不过呢,响应结果它的值是什么呢?它的值为啊,Excel生成的默认的。这一个响应的结果,我们可以先来看一看log,打印一下response。点开浏览器,刷新页面。点开CL你看一看。这就是Excel默认创建的那个响应结果,那我能不能在处理的时候呢,不去处理这个比较全的结果呢?我只处理其中的某一个部分,可不可以啊,可以,那你在响应拦截器的这个环节,在return结果的时候,你就不要把这个结果return,你可以换一换。
12:19
例如说啊,咱们点开这个散应蓝颜器一盒啊,我可以这样来做。啊,Return一个response点。这是什么意思啊,就是。你用户自定义回到这块,你在处理的时候,你就不需要再去处理那个响应状态码和状态字符串了。你直接去处理谁呀,直接去处理这个显体就可以了,你这个时候你看看结果刷写一面这里没有结果,为啥呢?因为咱们这里并没有输出,可以打开它来看一看效果。然后刷新页面瞅一眼,你看这儿。这里就只有谁啊,只有响应题。啊,没有那个响应行响应头的内容了。所以说在响应这个这个呃,拦截器里边,我们可以对响应结果去做一些处理。
13:03
当然你还可以做一些判断,做一些统一的这个。呃,这个错误的一些处理都是可以的。好了,到这儿的话,关于响应拦截器,我们就先说这么多,相信啊,大家在第一次接触完拦截器之后,多多少少都会有一些陌生,别急,在后边源代码的讲解当中,我们会自己模拟去实现一下这一个拦截器它的实现原理。啊,到时候大家都就会对这儿有一个更加清晰的认识。好了,关于功能介绍这块,我们就先到这儿。
我来说两句