vue 封装axios详细教程

首先安装：

npm install axios --save

创建api文件，在下面创建config.js文件

在main.js引入axios和config.js

import http from '@/api/config'

import axios from 'axios';

Vue.prototype.axios = axios

每次请求方式是：this.axios.post/git

在config.js里写，如下：

import axios from "axios";
axios.defaults.withCredentials = true //跨域
axios.defaults.headers.post['Content-Type'] = 'application/x-www=form-urlencoded'

if (process.env.NODE_ENV === "development") {
    console.log("开发环境")
    axios.defaults.baseURL = 'https://apidev.awhfjt.com';
} else {
    console.log("生产环境")
    axios.defaults.baseURL = 'https://api.awhfjt.com';
}

const service = axios.create({
    timeout: 5000,
    withCredentials: true,
});

// request拦截器
axios.interceptors.request.use(
    config => {
        console.log(config)
        //携带请求头
        config.headers.common = {
            name:123
        }
        return config;
    },
    error => {
        console.log(error);
    }
);

// 响应拦截器
axios.interceptors.response.use(
    res => {
        console.log(res)
    },
    error => {
        console.log(error)
        return Promise.reject(error);
    }
);

export default service;
请求方式如下：