Axios
342字约1分钟
2025-11-21
准备
npm install axiosAxios
Axios请求别名方式

| 对比维度 | GET 请求 | POST 请求 |
|---|---|---|
| 核心用途 | 从服务器获取数据(查询、读取) | 向服务器提交数据(创建、修改、删除) |
| 数据传输位置 | 数据拼在 URL 末尾(可见) | 数据放在 请求体(Body) 中(不可见) |
| 数据大小限制 | 受 URL 长度限制(通常浏览器限制 2KB~8KB) | 理论无限制(由服务器配置决定) |
| 数据类型限制 | 仅支持 ASCII 字符(需 URL 编码特殊字符) | 支持任意类型(文本、图片、文件等) |
| 缓存特性 | 可被浏览器缓存(URL 不变则返回缓存结果) | 默认不缓存(需手动设置缓存策略) |
| 安全性 | 低(数据暴露在 URL 中,易被拦截、记录) | 较高(数据在请求体,相对隐蔽) |
| 幂等性 | 幂等(多次请求结果一致,不改变服务器状态) | 非幂等(多次请求可能重复提交,改变服务器状态) |
| 浏览器历史记录 | 会记录 URL(含数据) | 不记录请求体数据 |
<head>
<script src="js/axios.min.js"></script>
</head>
<body>
<form>
<input type="button" value="按钮1" onclick="dianji1()">
<input type="button" value="按钮2" onclick="dianji2()">
</form>
</body>
<script>
function dianji1() {
axios.get("http://yapi.xml/list").then((result) => {
console.log(result.data)
})
};
function dianji2() {
axios.post("http://yapi.xml/datalist","id=1").then((result) => {
console.log(result.data)
})
}
</script>