使用async和await对axios及接口进一步优化封装

      我们在使用axios进行请求时,会遇到不同的数据格式,或者说我们想处理获取数据的回调地域,而我们对于axios请求及接口封装的不够彻底的话,是无法满足以上需求的,所以,今天我们对axios进一步封装。

      首先看一下请求接口时,后端需要的不同的数据格式:

      1、get,delete请求(一种类型,不同点处理)

            (1)、普通格式,及key1=vlaue,及正常的对象,这样我们只需要向后端传递普通对象即可。

            (2)、包含数组,及key1=value&ids=1(arr[0])&&ids=2(arr[0]),这样的数据格式普通传参无法满足,稍后看下对这块的处理

使用async和await对axios及接口进一步优化封装

      2、post、put请求(三种数据格式)

            (1)、上传格式,一般类型为formData数据格式,

使用async和await对axios及接口进一步优化封装

            (2)、json格式,请求体为对象,后端接收object

使用async和await对axios及接口进一步优化封装

            (3)、默认格式,为key1=value1 key2=value2方式,为formData数据格式,

使用async和await对axios及接口进一步优化封装

         为了解决以上格式,我们进一步对axios进行封装。引入及请求时头部信息

使用async和await对axios及接口进一步优化封装

         我们在request拦截器中对不同请求方式判断传参:

使用async和await对axios及接口进一步优化封装

        使用async和await对axios及接口进一步优化封装

 针对response进行数据拦截使用async和await对axios及接口进一步优化封装

 使用async和await对axios及接口进一步优化封装

 使用async和await对axios及接口进一步优化封装

 这样的封装即可满足后端需要的参数格式,同时使用async和await可以解决回调地域,自己的代码,懒得再写,所以截图。抱歉