arraybuffer 是 fetch api 中操作原始字节最底层的选择，可通过 response.arraybuffer() 获取，配合 uint8array 等视图读写，支持流式处理大文件及直接作为请求体发送二进制数据。
Fetch API 默认将响应体转为高级抽象（如 JSON、文本或 Blob），但若需直接操作原始字节，ArrayBuffer 是最轻量、最底层的选择。它让你绕过自动编码解析，精准控制二进制数据的读写与转换。
用 arrayBuffer() 获取原始字节
Fetch 响应对象提供 arrayBuffer() 方法，返回一个 Promise，解析为 ArrayBuffer 实例——即一段连续的、未解释的内存块。
示例：
fetch('/image.png')
.then(response => response.arrayBuffer())
.then(buffer => {
console.log(buffer.byteLength); // 如 12480
console.log(buffer.constructor === ArrayBuffer); // true
});
用 Uint8Array 或其他视图读写字节
ArrayBuffer 本身不可直接读取；必须通过类型化数组（如 Uint8Array、Int32Array、Float64Array）创建“视图”来访问内容。
常见操作：
-
按字节遍历：用
Uint8Array查看每个 byte（0–255） -
读取结构化数据：如从 buffer 开头读取 4 字节整数 →
new Int32Array(buffer, 0, 1)[0] - 修改内容：直接赋值给视图索引，会同步反映在底层 buffer 中
示例（检查 PNG 签名）：
response.arrayBuffer().then(buffer => {
const view = new Uint8Array(buffer);
if (view[0] === 0x89 && view[1] === 0x50 && view[2] === 0x4e && view[3] === 0x47) {
console.log('Valid PNG');
}
});
流式处理大文件：配合 ReadableStream 和 getReader()
对超大响应（如百 MB 视频或模型文件），一次性加载到内存可能引发 OOM。Fetch 的 response.body 是 ReadableStream，可分块读取并逐段转为 ArrayBuffer。
关键步骤：
- 调用
response.body.getReader()获取流读取器 - 循环
reader.read()，每次得到{ done, value }，其中value是Uint8Array - 用
value.buffer或value.slice().buffer获取对应ArrayBuffer
注意：value 是临时视图，若需长期持有 buffer，建议拷贝（如 value.slice().buffer）。
发送二进制数据：用 ArrayBuffer 作为请求体
Fetch 支持直接传入 ArrayBuffer、TypedArray 或 DataView 作为 body，无需额外封装。
示例（上传加密后的 raw 数据）：
const data = new Uint8Array([0x01, 0x02, 0x03, 0x04]);
fetch('/upload', {
method: 'POST',
body: data.buffer, // 直接传 ArrayBuffer
headers: {
'Content-Type': 'application/octet-stream'
}
});
浏览器会自动设置正确的 Content-Length，服务端收到的就是原始字节流。
