VUE2封装axios请求

在你的utils下面新建一个request.js

import Vue from 'vue'

import axios from 'axios';  
axios.defaults.headers['Content-Type'] = 'application/json;charset=utf-8'
const instance = axios.create({  
    baseURL: process.env.VUE_APP_BASE_API,  
    timeout: 30000  
});  
instance.interceptors.request.use(  
    function (config) {  
        // Check if token exists  
        const token = localStorage.getItem('token');  
        console.log(token);
        if (token) {  
            config.headers.Authorization = `${token}`;
        }  
        return config;  
    },  
    function (error) {  
        console.error('Request Interceptor Error:', error);  
        return Promise.reject(error);  
    }  
);  
instance.interceptors.response.use(  
    function (response) {  
        if(response.status==200 && response.data &&  response.data.code == 200){
            // 对响应数据做点什么  
            console.log('响应数据')
            return response;    
        } else {
            console.log('报错')
            Vue.prototype.$message({
                message: response.data.message,
                type: 'error'
            });
            return Promise.reject()
        }
    },  
    function (error) {  
        // Handle response error  
        if (error.response) {  
            // 服务器响应了请求，但返回了错误的状态码  
            // 检查状态码  
            switch (error.response.status) {  
                case 400:  
                    console.error('Bad Request', error.response.data);  
                    break;  
                case 401:  
                    console.error('Unauthorized', error.response.data);  
                    window.location.href='/login'
                    break;  
                case 403:  
                    console.error('Forbidden', error.response.data);  
                    break;  
                case 404:  
                    console.error('Not Found', error.response.data);  
                    break;  
                case 500:  
                    console.error('Internal Server Error', error.response.data);  
                    break; 
                // 添加更多的 case 来处理其他 HTTP 状态码  
                default:  
                    console.error('Response Interceptor Error:', error.response.data);  
            }  
        } else if (error.request) {  
            // 请求已经发起，但没有收到响应  
            console.error('No response received', error.request);  
            return
        } else {  
            // 设置请求时触发了错误  
            console.error('Error', error.message);  
        }  
        // 总是返回拒绝的 Promise  
        return Promise.reject(error);  
    }  
);
export default instance;

在你的api中将各个请求封住起来

import instance from "@/utils/request";

// 微信授权登录
const wxLogin = (params) => {
  return instance('/weChat/wx/login', params, 'POST')
}

在页面中使用

import {wxLogin} from '@/api/login'

login(){
    let obj = {
        
    }
    wxLogin(obj).then(res=>{
        console.log('res',res)
    })
}