一.什么是axios?
- 是一个基于Promise 用于浏览器和 nodejs 的 HTTP 客户端 简单的理解就是ajax的封装
- 在使用Vue.js框架开发前端项目时 会经常发送ajax请求服务端接口 在开发过程中 需要对axios进一步封装 方便在项目中的使用
二、为什么要对axios进行封装
- 可以更方便的管理和修改axios请求域名,假设是一个庞大的项目,只是修改域名就会花费很多的时间和精力,如果对axios进行封装,便能省去了很多的步骤
第一步:
首先在开始之前,先安装axios插件
- 在src目录下创建utils文件夹,里面创建一个http.js文件,文件内容如下:
// 首先引入axios插件
import axios from "axios";
// 引入element-plus插件
import { ElMessage } from 'element-plus'
// 网址是后台管理系统的接口
const http = axios.create({
baseURL: "https://www.liulongbin.top:8888/api/private/v1",
timeout: 10000
})
// 请求拦截
http.interceptors.request.use(config => {
let token = localStorage.getItem('token') || ''
config.headers.Authorization = token
return config
}, err => {
throw new Error(err)
})
// 响应拦截