Body - Web API 接口参考编辑

Fetch API 中的 Body mixin 代表响应/请求的正文，允许你声明其内容类型是什么以及应该如何处理。

Body被Request 和Response实现，并为这些对象提供了一个相关联的主体（字节流），一个已使用的标志（最初未设置）和一个MIME类型（最初为空字节序列）。

属性

Body.body 只读: 一个简单的getter用于暴露一个ReadableStream类型的主体内容。
Body.bodyUsed 只读: 一个Boolean 值指示是否body已经被标记读取。

方法

Body.arrayBuffer(): 使Response挂起一个流操作并且在完成时读取其值，它返回一个Promise对象，其resolve参数类型是ArrayBuffer。此操作会将bodyUsed状态改为已使用（true）。
Body.blob(): 使Response挂起一个流操作并且在完成时读取其值，它返回一个Promise对象，其resolve参数类型是Blob。此操作会将bodyUsed状态改为已使用（true）。
Body.formData(): 使Response挂起一个流操作并且在完成时读取其值，它返回一个Promise对象，其resolve参数类型是FormData表单。此操作会将bodyUsed状态改为已使用（true）。
Body.json(): 使Response挂起一个流操作并且在完成时读取其值，它返回一个Promise对象，其resolve参数类型是使用JSON解析body文本的结果。此操作会将bodyUsed状态改为已使用（true）。
Body.text(): 使Response挂起一个流操作并且在完成时读取其值，它返回一个Promise对象，其resolve参数类型是USVString（文本）。此操作会将bodyUsed状态改为已使用（true）。

范例

在基本 fetch 使用实例 (查看运行效果) 中，我们使用简单的 fetch 请求获取一张图片并将其使用 <img> 标签展示。你可能注意到当我们请求一张图片，需要使用 Body.blob (Response 实现 body 接口以发送正确的MIME类型给服务器进行识别。

HTML 内容

<img class="my-image" src="https://www.wenjiangs.com/wp-content/uploads/2020/mozilla/frwiki-1.5x.png">

JS 内容

var myImage = document.querySelector('.my-image');
fetch('flowers.jpg').then(function(response) {
  return response.blob();
}).then(function(response) {
  var objectURL = URL.createObjectURL(response);
  myImage.src = objectURL;
});

你也可以使用 Response.Response() 构造函数创建自定义的 Response 对象。