vue 中简单封装 axios

最新推荐文章于 2023-10-11 12:30:00 发布

再敲一行就睡觉

最新推荐文章于 2023-10-11 12:30:00 发布

阅读量620

点赞数 6

分类专栏： Vue采坑文章标签： vue ajax axios

本文链接：https://blog.csdn.net/one_punchman_zxl/article/details/117791851

版权

本文介绍了如何在Vue项目中封装axios，并进行了简单的测试，包括post和get请求的示例。同时，针对跨域问题，提供了在SpringMVC.xml中配置以及在Vue的vue.config.js中配置的方法，确保后端能正常获取cookie。

摘要由CSDN通过智能技术生成

把axios注入到Vue中

import axios from 'axios';
Vue.prototype.$axios = axios;

import axios from 'axios'

axios.defaults.timeout = 5000;                        //响应时间
axios.defaults.headers.post['Content-Type'] = 'application/json;charset=UTF-8'; //配置请求头
axios.defaults.withCredentials= true; //带cookie
axios.defaults.baseURL = 'http://localhost:8080/';   //配置接口地址

//POST传参序列化(添加请求拦截器)
axios.interceptors.request.use((config) => {
   
	//在这里可以添加序列化代码，根据后端而定，我用的SSM后端接受Json对象，假如需要序列化可以用qs组件
    return config;
},(error) =>{
   
    console.log('错误的传参')
    return Promise.reject(error);
});

//返回状态判断(添加响应拦截器)
axios.interceptors.response.use((res) =>{
   
    //对响应数据做些事