Vinson

Vinson

Axios

发表于 2023-09-01
Vinson
阅读量 24

axios 常用操作

全局配置

axios.defaults.baseURL = 'https://some-domain.com/api/' // 配置全局前缀
axios.defaults.timeout = 5000
axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';
js

创建实例

const instance = axios.create({
  // 公有前缀
  // baseURL: 'https://some-domain.com/api/',
  // 超时时间
  timeout: 1000,
  // 请求头
  // headers: {'X-Custom-Header': 'foobar'},

  // 跨域携带 cookie
  // withCredentials: true,
});
js

注意
withCredentials = true时,后端返回的响应头Access-Control-Allow-Origin不能为*,需要指定origin

请求响应拦截

// 请求拦截器
axios.interceptors.request.use(config => {
  // 在发送请求之前做些什么
  console.log('请求',config);
  return config;
}, error => {
  // 对请求错误做些什么
  return Promise.reject(error);
});


// 响应拦截器
axios.interceptors.response.use(response => {
  console.log('响应',response);
  // 对响应数据做点什么
  return response;
}, error => {
  // 对响应错误做点什么
  return Promise.reject(error);
});
js

并发

function getUserAccount() {
 return axios.get('/user/12345');
}

function getUserPermissions() {
 return axios.get('/user/12345/permissions');
}

axios.all([getUserAccount(), getUserPermissions()])
 .then(axios.spread((acct, perms) => {
 // 两个请求现在都执行完成
}));
js


评论
来发一针见血的评论吧!
表情

快来发表评论吧~

推荐文章
  • 测试文章

    20点赞10评论

  • webpack5(一)

    20点赞10评论