Nuxt中Axios拦截的配置
首先你的项目中必须有axios的包，一般在创建项目的时候都会选择一起安装上，但是不排除有的小伙伴创建项目时没有安装，如果没有安装的，用以下命令安装
npm install axios --save-dev
安装不成功，可以切换淘宝镜像(cnpm)，安装成功后在nuxt.config.js中加入以下代码进行配置
modules: [
'@nuxtjs/axios',
]
配置完modules后，需要在配置axios的baseurl，
import axios from 'axios'
const instance = axios.create({baseURL:'默认地址'});
// 添加请求拦截
instance .interceptors.request.use(function (config) {
// 在发送请求之前做些什么
return config;
}, function (error) {
// 对请求错误做些什么
return Promise.reject(error);
});
// 添加响应拦截
instance .interceptors.response.use(function (response) {
// 对响应数据做点什么
return response;
}, function (error) {
// 对响应错误做点什么
return Promise.reject(error);
});
export default instance
我们可以在请求拦截中添加发送请求前的操作，例如在header中加入token请求，可以在相应拦截中做请求后的操作，例如整理数据格式、进行错误处理等，我们并把instance给暴露出来。
通过上面的步骤我们的拦截就配置好了，接下来要回到nuxt.config.js中进行全局配置
plugins: [
'~/plugins/axios',
],
在以后的请求操作中使用 instance.get或instance.post就可以直接请求数据并做Axios中配置好的操作。
上一篇
