.首先引入 axios
importaxiosfrom'axios'
2.创建一个实例
constapi=axios.create({
baseURL:'',// 所有请求的公共地址部分
timeout:3000// 请求超时时间 这里的意思是当请求时间超过5秒还未取得结果时 提示用户请求超时
})
3.request拦截器
// 请求相关处理 请求拦截 在请求拦截中可以补充请求相关的配置// interceptors axios的拦截器对象
api.interceptors.request.use(config=>{// config 请求的所有信息// console.log(config);returnconfig// 将配置完成的config对象返回出去 如果不返回 请求讲不会进行
},err=>{// 请求发生错误时的相关处理 抛出错误
Promise.reject(err)
})
4.response拦截器
api.interceptors.response.use(res=>{// 我们一般在这里处理,请求成功后的错误状态码 例如状态码是500,404,403// res 是所有相应的信息console.log(res)returnPromise.resolve(res)},err=>{// 服务器响应发生错误时的处理Promise.reject(err)})
5.暴漏出去
export default api
封装接口
import api from'../index.js'; 下面是简写的形式// getXXX 自定义的接口名字exportconstgetXXX=(params)=>api.get(`/apigb/v1/component`,{params})exportconstpostXXX=(params)=>api.post(`/apigb/v1/component/update-info`,params)
// 下面是详细的写法exportconstxxxx=(params)=>api({url:'',// 请求地址method:'post',// 请求方式// data: params, // (一般post请求,我们习惯使用 data属性来传参)params:params//(一般get请求,我们习惯使用params属性来传参)// 注意:data,和 params 两个属性传参使用,并不是固定的,也可以调换使用。})