/* 全局使用axios */
import axios from 'axios'
/* 给全局的额axios配置了一个基本的地址 */
/* 组件里面的地址只需要写path就可以了 比如this.$axios.post('login',... */
// axios.defaults.baseURL = 'http://timemeetyou.com:8889/api/private/v1/';
// /* 给组件内的所有使用$axios的 请求头上都加上了Authorization和对应的token值 */
// /* 后台会根据你的请求头上的token值来判断你是管理员 还是普通用户,管理员就给管理员应该有的数据
// 普通用户就给普通用户应该给的数据 */
// axios.defaults.headers.common['Authorization'] = 'token123';
// axios.interceptors.request.use(function (config) {
// console.log('loading......')
// // 在发送请求之前做些什么
// return config;
// }, function (error) {
// // 对请求错误做些什么
// return Promise.reject(error);
// });
// Vue.prototype.$axios = axios;
/* 上面这种方式 会对所有的组件 都造成影响 */
/* 而下面的创建实例化的方式,只会对使用全局$axios的请求造成影响,
不会对局部使用的axios请求造成影响 */
/* axios创建一个axios实例化对象 */
var instance = axios.create({
baseURL: 'http://timemeetyou.com:8889/api/private/v1/',
timeout: 1000, /*在超时前所有请求都会等待1秒 */
// headers: {'Authorization': 'token123'}
});
// 添加请求拦截器
/* 顺序是发送请求之前 */
instance.interceptors.request.use(function (config) {
console.log('loading打开......')
// config.headers.Authorization = 'token123'
console.log(config);
// 在发送请求之前做些什么
return config;
}, function (error) {
// 对请求错误做些什么
console.log('请求error',error);
return Promise.reject(error);
});
// 添加响应拦截器
/* 顺序是 拿到响应数据之前 */
instance.interceptors.response.use(function (response) {
console.log('loading关闭')
// 对响应数据做点什么
return response.data;
}, function (error) {
/* 请求状态是404 或者 500 或者failed的状态*/
// 对响应错误做点什么
/* console.log('响应error',error); */
/* 响应拦截 会在组件先一步执行 */
/* 组件内部也需要catch一下,这样才能阻止报错,方便下面代码执行 */
return Promise.reject(error);
});
Vue.prototype.$axios = instance;
/* 局部组件 使用 mock数据 使用局部的axios方式 */
/* app组件 使用 登录接口 使用全局的axios方式 */
/* 分别实现 拿到对应的数据 */