AJAX vs axios vs fetch

一、AJAX

AJAX(Asynchronous JavaScript And XML):一种在 不刷新页面 的情况下向服务器请求数据并更新网页部分内容的技术。

核心是使用浏览器提供的 XMLHttpRequest 对象。

二、axios

Axios 是一个基于 Promise 的 HTTP 请求库,可以用于浏览器和 Node.js。

核心优势是:语法简洁、默认 JSON、支持拦截器、取消请求、请求/响应转换等。

10、请求头添加token

1)常见的其他请求头写法(根据后端习惯):

写法 使用场景
config.headers['Authorization'] = 'Bearer ' + token 最标准的 JWT 携带方式
config.headers['token'] = token 一些轻量后台接口喜欢自定义
config.headers['x-access-token'] = token 较老项目或模拟 HTTP 扩展字段
config.headers['X-Token'] = token 后端使用大写风格的自定义字段
config.headers['Auth'] = token 一些临时测试服务或简化项目
config.headers.Authorization = token 对应 config.headers['Authorization'],语法等价但更简洁

2)后端为什么使用不同字段名?

头字段 背后逻辑
Authorization HTTP 标准认证头,推荐
token / x-token 避免浏览器自动携带敏感头或绕过某些中间件拦截
自定义字段 某些服务架构设计不采用标准认证机制(如微服务、IoT、私有协议)

3)实战封装建议(支持多种方式)

三、fetch

相关推荐
万少1 小时前
HarmonyOS 开发必会 5 种 Builder 详解
前端·harmonyos
橙序员小站3 小时前
Agent Skill 是什么?一文讲透 Agent Skill 的设计与实现
前端·后端
炫饭第一名6 小时前
速通Canvas指北🦮——基础入门篇
前端·javascript·程序员
王晓枫6 小时前
flutter接入三方库运行报错:Error running pod install
前端·flutter
符方昊6 小时前
React 19 对比 React 16 新特性解析
前端·react.js
ssshooter6 小时前
又被 Safari 差异坑了:textContent 拿到的值居然没换行?
前端
曲折6 小时前
Cesium-气象要素PNG色斑图叠加
前端·cesium
Forever7_6 小时前
Electron 淘汰!新的桌面端框架 更强大、更轻量化
前端·vue.js
Angelial7 小时前
Vue3 嵌套路由 KeepAlive:动态缓存与反向配置方案
前端·vue.js
jiayu7 小时前
Angular学习笔记24:Angular 响应式表单 FormArray 与 FormGroup 相互嵌套
前端