fetch是现代浏览器发起网络请求的标准方式，基于Promise支持async/await；需调用.json()等方法解析Response；HTTP错误需手动检查res.ok；发送Cookie需设置credentials选项。
JavaScript 的 fetch 是现代浏览器中发起网络请求的标准方式，比传统的 XMLHttpRequest 更简洁、更易用，且基于 Promise，天然支持 async/await。
基本用法：GET 请求获取数据
最常见的是用 GET 方法请求 JSON 数据，比如从公开 API 获取用户列表：
- 调用
fetch(url)返回一个 Promise，它解析为Response对象 -
Response不是最终数据，需调用.json()、.text()等方法读取响应体 - 每个读取方法也返回 Promise，所以通常要链式调用或用
await
示例：
async function getUser() {
try {
const res = await fetch('https://jsonplaceholder.typicode.com/users/1');
if (!res.ok) throw new Error(`HTTP ${res.status}`);
const user = await res.json(); // 注意：.json() 必须调用，否则得不到对象
console.log(user.name); // "Leanne Graham"
} catch (err) {
console.error('请求失败:', err.message);
}
}
发送 POST 请求并提交 JSON 数据
向服务器提交数据时，需要设置请求头和请求体：
立即学习“Java免费学习笔记（深入）”；
- 设置
headers：指定'Content-Type': 'application/json' - 使用
body: JSON.stringify(data)发送序列化后的 JSON - 方法默认是 GET，POST 需显式写
method: 'POST'
示例：
async function createUser(name, email) {
const res = await fetch('https://jsonplaceholder.typicode.com/users', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({ name, email, username: name.toLowerCase() })
});
return res.json();
}
处理错误与状态码
fetch 只在网络完全失败（如断网、域名错误）时才 reject，**HTTP 错误状态（如 404、500）不会触发 catch**，需手动检查：
- 用
res.ok判断是否为 200–299 范围的状态码 - 用
res.status获取具体状态码，做精细化处理（如 401 跳登录页） - 注意：一旦调用
res.json()等方法，响应体只能读一次，不可重复使用
带凭证（如 Cookie）的请求
默认情况下，fetch 不发送 Cookie，跨域也不会携带认证信息。如需发送，加 credentials 选项：
-
credentials: 'same-origin'：同源请求自动带 Cookie（默认值） -
credentials: 'include'：始终发送 Cookie（含跨域），后端需允许（CORS 响应头含Access-Control-Allow-Credentials: true） -
credentials: 'omit'：从不发送（等价于不设该字段）
示例（登录后请求用户信息）：
const res = await fetch('/api/profile', {
credentials: 'include' // 让浏览器带上 session cookie
});
