axios 封装上传文件的请求方法
作者：倪默遥
今天小编就为大家分享一篇axios 封装上传文件的请求方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
axios 和 ajax 都支持异步请求，两者使用方法大同小异，在此使用 axios 上传文件的请求。使用的时候只需要在响应的 vue 组件中引入就可以。
import Vue from 'vue';
import VueCookie from 'vue-cookie';
import axios from 'axios';
// import toastr from '../assets/toastr.min';
// Vue.use(axios)
let http = {};
// let _baseURL = '/vpaas'
let _baseURL = 'http://localhost:8080/vpaas'
let ContentType = "application/json";
let uploadFileType = "multipart/form-data";
http.baseURL = _baseURL;
/**
* 上传文件的请求
* @param url
* @returns {AxiosPromise}
*/
http.uploadFile = function (url, data) {
let config = {
//请求的接口，在请求的时候，如axios.get(url,config);这里的url会覆盖掉config中的url
url: url,
//基础url前缀
baseURL: _baseURL,
transformResponse: [function (data1) {
var data = data1;
if (typeof data1 == "string") {
data = JSON.parse(data1);
}
//这里提前处理返回的数据;
if (data.message && (data.data === 'login.invalid.token')) {
window.localStorage.removeItem("access-user");
alert("超时请重新登陆");
window.location.href = '/';
}
return data;
}],
//请求头信息
headers: {'access-user': window.localStorage.getItem('access-user'), 'Content-Type': uploadFileType},
//跨域请求时是否需要使用凭证
withCredentials: true,
// 返回数据类型
responseType: 'json', //default
};
return axios.post(url, data, config);
};
以上这篇axios 封装上传文件的请求方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。