上一篇文章里面大致記錄了一下axios的基礎(chǔ)用法
這一篇文章主要記錄axios的進(jìn)階用法：實(shí)例芹彬、配置捎琐、攔截器、取消請(qǐng)求
實(shí)例
let instance = axios.create({
baseURL: 'http://localhost:9000/api',
timeout: 1000,
//url: '/contactList'
//method: 'get,post,put,patch,delete',
headers: {
token: ''
}, //請(qǐng)求頭
//params:{}, //拼接在url 上的請(qǐng)求參數(shù)
//data: {}, //放在請(qǐng)求體的請(qǐng)求參數(shù)
})
instance.get('/contactList',{
params: {
id: 1
}
}).then(res=>{
console.log(res)
}).catch(err=>{
console.log(res)
})
配置
axios的配置參數(shù)有哪些：
baseURL,timeout,url,method,headers,params,data,withCredentials....
axios全局配置
axios.defaults.timeout = 1000;
axios.defaults.baseURL = 'http://localhost:9000/api';
axios實(shí)例配置
let instance = axios.create();
instance.defaults.timeout = 3000
axios請(qǐng)求配置
instance.get('/contactList',{
timeout: 5000
}).then(res=>{
console.log(res)
}).catch(err=>{
console.log(res)
})
優(yōu)先級(jí)別：請(qǐng)求配置>實(shí)例配置>全局配置（即最后的超時(shí)時(shí)間是5000）
攔截器
攔截器：在請(qǐng)求或響應(yīng)被處理前攔截它們裹匙。分為請(qǐng)求攔截器、響應(yīng)攔截器
請(qǐng)求攔截器：
axios.interceptors.request.use(config=>{
//在發(fā)送請(qǐng)求前做些什么
//config.headers.token = '', //需要登錄攔截的請(qǐng)求
return config
}, err=>{
//在請(qǐng)求錯(cuò)誤的時(shí)候做些什么
return Promise.reject(err)
})
響應(yīng)攔截器
axios.interceptors.response.use(config=>{
//請(qǐng)求成功對(duì)響應(yīng)數(shù)據(jù)做處理
return res
}, err=>{
//響應(yīng)錯(cuò)誤做些什么
return Promise.reject(err)
})
比如在移動(dòng)端開(kāi)發(fā)時(shí)：在發(fā)送請(qǐng)求前需要加一個(gè)遮罩層末秃，在請(qǐng)求錯(cuò)誤或響應(yīng)結(jié)束的時(shí)候取消遮罩層概页、以及需要登錄攔截的請(qǐng)求接口，需要在請(qǐng)求之前练慕，給請(qǐng)求頭配置上相關(guān)信息惰匙，這些操作都可以加在攔截器里面。
