開發封裝使用axios請求

import axios from 'axios'
class Ajax {
    constructor() {
        this.config = {
            timeout: 10000,
            headers: {},
            auth: {},
        }
        this.codeMessage = {
            200: "服務器成功返回請求的數據。",
            201: "新建或修改數據成功。",
            202: "一個請求已經進入後臺排隊(異步任務)。",
            204: "刪除數據成功。",
            400: "發出的請求有錯誤,服務器沒有進行新建或修改數據的操作。",
            401: "用戶沒有權限(令牌、用戶名、密碼錯誤)。",
            403: "用戶得到授權,但是訪問是被禁止的。",
            404: "發出的請求針對的是不存在的記錄,服務器沒有進行操作。",
            406: "請求的格式不可得。",
            410: "請求的資源被永久刪除,且不會再得到的。",
            422: "當創建一個對象時,發生一個驗證錯誤。",
            500: "服務器發生錯誤,請檢查服務器。",
            502: "網關錯誤。",
            503: "服務不可用,服務器暫時過載或維護。",
            504: "網關超時。",
        }
        this.init()
    }

    init() {
        this.ajax = axios.create({
            ...this.config
        })
        this.ajax.interceptors.request.use(function (config) {
            // 在發送請求之前做些什麼
            return config
        }, function (error) {
            // 對請求錯誤做些什麼
            return Promise.reject(error)
        })
        this.ajax.interceptors.response.use(function (response) {
            // 對響應數據做點什麼
            if (!response) {
                console.log("您的網絡發生異常,無法連接服務器")
            }
            return response;
        }, function (error) {
            // 對響應錯誤做點什麼
            const response = error.response
            const status = response.status
            if (status === 401) {
                console.log(this.codeMessage[status])
            } else if (status >= 400 && status < 500) {
                console.log(this.codeMessage[status])
            } else if (status >= 500) {
                console.log(this.codeMessage[status])
            }
            return Promise.reject(error)
        })
    }
}
export default new Ajax().ajax

不喜勿噴,謝謝

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章