对axios再封装

技能 · 2020-07-03 · 499 人浏览
对axios再封装

老代码

// 引入axios
import axios from 'axios'

// 线上生产接口
// var root = 'https://xxx.xxxxx.com/';
// 线下测试接口
var root = 'http://192.168.1.6/';

// 设置响应时间 单位毫秒
axios.defaults.timeout = 20000;
// 设置接口URL
axios.defaults.baseURL = root;

// 设置请求头
axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded; charset=utf-8';


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

// 添加响应拦截器
axios.interceptors.response.use(function (response) {
  // 在响应后做些什么
  return response;
}, function (error) {
  // 在响应错误后做些什么
  return Promise.reject(error);
});

export default axios;

在main.js里引入

import axios from './config/http.js'
Vue.prototype.$ajax = axios
Vue axios 请求拦截 响应拦截
Theme Jasmine by Kent Liao