Fetch API 的响应体默认为 ReadableStream，需调用 text()、json() 或 arrayBuffer() 等方法获取内容；text() 自动按 Content-Type 解码但仅可调用一次；json() 内部调用 text() 并解析，建议配合 res.ok 使用；二进制数据应使用 arrayBuffer() 或 blob() 避免乱码。
Fetch API 返回的响应体（Response body）默认是 ReadableStream，不能直接读取内容。要获取文本或二进制数据，需调用对应的方法（如 text()、json()、arrayBuffer() 等），这些方法返回 Promise，必须用 await 或 .then() 处理。
获取纯文本（HTML / plain text / XML）
适用于返回 HTML 页面、日志、配置文件、XML 等非结构化或简单结构化文本。
- 用
response.text()获取字符串，自动按响应头中的Content-Type字符集（如utf-8）解码 - 若服务器未正确设置
charset，可手动处理：先用arrayBuffer()读取原始字节，再用TextDecoder指定编码（如gbk） - 注意：
text()只能调用一次；多次调用会 reject，因为流已被消耗
示例：
const res = await fetch('/api/log.txt');
const content = await res.text(); // 自动按 utf-8 解码
console.log(content);
获取 JSON 数据
虽然本质也是文本，但 response.json() 是专用方法，会自动解析并校验 JSON 格式。
立即学习“Java免费学习笔记（深入）”；
- 内部先调用
text()，再执行JSON.parse()；失败时抛出语法错误 - 建议始终用
res.ok判断 HTTP 状态是否成功（200–299），避免 4xx/5xx 响应误解析 - 不推荐先
text()再手动JSON.parse()，除非需要预处理原始字符串
示例：
const res = await fetch('/api/data');
if (!res.ok) throw new Error(`HTTP ${res.status}`);
const data = await res.json(); // 自动解析，失败则 reject
获取二进制数据（图片 / PDF / ZIP / 音频等）
对非文本资源，应使用 arrayBuffer()、blob() 或 formData()，避免字符编码干扰。
-
arrayBuffer()：返回原始字节缓冲区，适合进一步用Uint8Array、FileReader或 WebAssembly 处理 -
blob()：返回 Blob 对象，可直接用于URL.createObjectURL()显示图片、下载文件，或传给File构造函数 - 不要用
text()读取图片/PDF——会导致乱码甚至解析失败
示例（下载并显示图片）：
const res = await fetch('/photo.jpg');
const blob = await res.blob();
const url = URL.createObjectURL(blob);
document.getElementById('img').src = url;
区分类型与安全处理小技巧
响应类型可通过 response.headers.get('content-type') 检查，但不可完全依赖；更稳妥的方式是根据接口契约明确预期格式。
- 服务端应正确设置
Content-Type（如application/json、image/png），便于客户端判断 - 对未知响应，可先用
res.arrayBuffer()读取前几个字节（“魔数”）识别真实类型（如89 50 4E 47表示 PNG） - 所有 body 方法都只能调用一次；如需多次使用，可缓存结果（如把
arrayBuffer()结果存为变量）
