什么是axios
axios 是一个基于Promise 用于浏览器和 nodejs 的 HTTP 客户端,它本身具有以下特征:
- 从浏览器中创建 XMLHttpRequest
- 从 node.js 发出 http 请求
- 支持 Promise API
- 拦截请求和响应
- 转换请求和响应数据
- 取消请求
- 自动转换JSON数据
- 客户端支持防止 CSRF/XSRF
为啥要封装axios
1 | 在vue项目中,和后台交互获取数据这块,我们通常使用的是axios库,它 |
如何封装axios
在src目录下新建utils文件,然后在其下新建request.js,来封装axios
1 | import axios from 'axios' |
如何使用封装好的axios
- 在src目录下新建api文件统一管理接口
- 然后写接口将其暴露出去
- 在vuex中调用
api案列
新建users.js作为user模块1
2
3
4
5
6
7
8
9
10
11
12import request from '@/utils/request'
/**
* 登录请求
* @param {传的token} data
*/
export function login (data) {
return request({
url: 'login',
method: 'post',
data
})
}
token方法的抽离
这里我抽离放在utils文件夹下1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16//引入js-cookie 为啥不用localStorage或者sessionStorage,当然你也可以用,习惯而已
import Cookies from 'js-cookie'
const TokenKey = 'Admin-Token'
export function getToken () {
return Cookies.get(TokenKey)
}
export function setToken (token) {
return Cookies.set(TokenKey, token)
}
export function removeToken () {
return Cookies.remove(TokenKey)
}
Δ~~~~Δ
ξ •ェ• ξ
ξ ~ ξ
ξ ξ
ξ “~~~~〇
ξ ξ
ξ ξ ξ~~~ξ ξ
ξ_ξξξ ξξξ_ξ
ヽ(´•ω•)ノ
| /
UU”
本文结束谢谢大家的阅读,每天进步一点点!-前端小学生