axios 使用实例

axios在vue项目中使用

axios基本的使用，就能够直接跳过了，能够参考一下官网,在本身vue spa 项目中用到了axios,所以记录一下。

Creating an instance

在项目中个人用法是建立一个实例

// Init Axios
Vue.prototype.$http = axios.create({
    baseURL: process.env.API_URL
});

这个好处是我能够定制本身的公共配置项，官网也说明，only the url is required,之后全部的请求均可以基于这个配置项

Config order of precedence

这里还能够有配置优先

Vue.prototype.$http.defaults.timeout=2500;

 Vue.prototype.$http.get('/request',{
  timeout:5000
})

interceptors

这个功能是我最喜欢的一个功能，对我而言，后端借口也是本身写的，那么来讲，本身定义json 格式状态码都是有规定，那么在项目中，在请求和相应的时候，能够事先拦截作处理，直接上代码：

• 请求拦截：

//config 就是defaults.js里面全部的配置
Vue.protype.$http.interceptors.request.use(config=>{
 //配合jwt 
 var token=window.localStorage.getItem('jwtToken');

  if(token){
       config.headers.Authorization=`Bearer ${token}`;
  }
  return config;

},error=>{
  return Promise.reject(error);
})

• 响应拦截：

axios.interceptors.response.user(res=>{

//相关处理
return res.data;

},error=>{

   return Promise.reject(error);
})

实质上这些处理已经够用了，若是没有你想要的，好比定制更多的配置项，这些均可以上官网上找到

good luck