vue上传图片压缩

import axios from "axios";
import QS from 'qs';
import config from "../../config";

axios.defaults.baseURL = config.API_URI;

axios.defaults.timeout = 10000;

axios.defaults.withCredentials = true;


axios.interceptors.request.use(
    config => {
        //请求之前(可以设置token)
        // if (localStorage.getItem('token')){  // 判断是否存在token，如果存在的话，则每个http header都加上token
        //  config.headers.common['Token'] = localStorage.getItem('token') || ''
        // }
        return config;
    },
    error => {
        alert(error);
        return Promise.reject(error);
    }
);


 axios.interceptors.response.use(
     response => {
        //数据拿到之后
        if (response.status === 200) {
            return Promise.resolve(response);
        } else {
            return Promise.reject(response);
        }
    },
    error => {
        alert("Http请求失败，请联系管理员");
        return Promise.reject(error.response);
    }
);

//成功方法
function successfun(res) {
    //处理后台返回的非200错误
    if (res.code === 0) {
        return res;
    } else {
        alert(res.msg);
        return res;
    }
}

//错误方法
function errorfun(res) {
    if (res.code != 1) {
        alert(res.msg);
        return res;
    }
}

export default {
    postImg(url, data) {
        //post请求
        return axios({
            method: "post",
            url,
            data: data,
            headers: {
                'Content-Type': 'multipart/form-data'
            }
        }).then(
            res => {
                return successfun(res.data);
            },
            err => {
                return errorfun(err);
            }
        );
    },
    post(url, data) {
        //post请求
        return axios({
            method: "post",
            url,
            data: QS.stringify(data),
        }).then(
            res => {
                return successfun(res.data);
            },
            err => {
                return errorfun(err);
            }
        );
    },
    get(url, params) {
        //get请求
        return axios({
            method: "get",
            url,
            params,
        }).then(
            res => {
                return successfun(res.data);
            },
            err => {
                return errorfun(err);
            }
        );
    }
};

第一个文件，afterRead方法是vant框架的上传获取原生文件流
第二个文件，设置多一个方法postImg，设置headers