在哪里封装:
封装axios,src文件夹下新建一个util的文件夹,这个文件夹就是放一些工具的,可以在这里面封装axios。新建一个js文件,这里是在http.js文件里封装axios
封装axios的第一种方案:函数法
方法:先导入axios,然后按照函数封装的办法封装,要有返回值,然后export导出对象,对象里面是各种函数。
在外部使用:
导入http文件:
因为http文件导出的是一个对象,所以用的时候像下面这样;
axios第二种封装办法:axios自带的封装方法
以后不用axios来请求,而是用axios创建的实例http来请求:
// 2-对于数据的封装方法:
import axios from 'axios'
const http = axios.create({
baseURL: 'https://m.maizuo.com',
timeout: 10000,
headers: {
'X-Client-Info':
'{"a":"3000","ch":"1002","v":"5.2.1","e":"16661470114057618813288449","bc":"440100"}'
}
})
export default http
用axios.create()创建一个实例http,以后这个http实例就代表axios本身了。这个用的是axios自己的一种方式,来做的自定义配置。导出http即可使用。
参数说明:
baseURL:指的是网址的域名+(端口号)
timeout:请求数据限制的时间范围
headers:数据验证里的“X-Client-Info”,这个字段是大多时候是重复的
上面代码的含义是:
每次往baseURL这个地址发请求,如果请求10s数据没回来就超时了,每次请求都会带上这个headers。
使用方式:
这样在使用的时候就可以拿http直接来用了,url中把公共的域名去掉(也就是去掉baseURL里的域名),headers中把相同的x-Client-Info去掉:(每个网站信息不一样也正是因为‘X-Host’字段不一样。)