API是约定的通信规则；JavaScript用fetch或XMLHttpRequest调用Web API；fetch更现代简洁，需手动处理cookie、JSON解析、HTTP错误及URL参数，POST传JSON须设Content-Type并序列化body。
API 不是某种工具或代码，它是一套约定好的通信规则——就像餐厅的菜单，你点菜（发请求），厨房按标准流程做（服务器处理），再把成品端给你（返回数据）。JavaScript 本身不“有” API，但它能通过 fetch 或 XMLHttpRequest 调用 Web API 发起网络请求。
什么时候该用 fetch 而不是 XMLHttpRequest
fetch 是现代浏览器的标准方案，语法简洁、基于 Promise，适合绝大多数场景；XMLHttpRequest 主要用于需要精细控制上传进度、取消请求或兼容 IE10/11 的老项目。
-
fetch默认不带 cookie，需显式加credentials: 'include'才能携带登录态 -
fetch返回的Response对象不是 JSON，必须调用.json()（或.text()）才能读取内容，否则只是个流对象 -
fetch只在网络错误（如断网、DNS 失败）时 reject，HTTP 状态码 404、500 不会触发 catch，得手动检查response.ok
fetch 发 GET 请求的典型写法和常见坑
最简 GET 示例：
fetch('/api/users')
.then(res => {
if (!res.ok) throw new Error(`HTTP ${res.status}`);
return res.json();
})
.then(data => console.log(data))
.catch(err => console.error('请求失败:', err));
- URL 中的查询参数必须手动拼接或用
URLSearchParams构造，fetch不自动处理对象参数 - 中文或特殊字符要先
encodeURIComponent，否则可能被截断或报 400 - 如果后端返回的是纯文本（比如 CSV）、XML 或 Blob，别硬调
.json()，会抛错
POST 提交 JSON 数据时必设的两个头
发送 JSON 必须同时满足：
fetch('/api/login', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({ email: 'a@b.c', password: '123' })
立即学习“Java免费学习笔记（深入）”；
-
'Content-Type': 'application/json' 告诉后端“我传的是 JSON”，否则后端可能解析为空对象
-
body 必须是字符串，JSON.stringify() 不可省略；直接传对象会变成 [object Object]
- 如果后端要求 form-data，就别用
JSON.stringify，改用 FormData 实例，且不要设 Content-Type（浏览器会自动生成带 boundary 的头）
真正容易出问题的，往往不是语法，而是对状态码、响应体类型、跨域限制、cookie 携带逻辑这些隐性契约的理解偏差。多看一眼 res.headers.get('content-type') 和 res.status，比反复重试更省时间。
