Response: blob() メソッド
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2017.
構文
js
blob()
引数
なし。
メモ: Response の Response.type が "opaque" の場合、結果の Blob の Blob.size は 0、Blob.type は空文字列 "" になり、URL.createObjectURL() のようなメソッドでは役に立たなくなります。
返値
Blob で解決するプロミスです。
例外
DOMExceptionAbortError-
リクエストが中止された場合。
TypeError-
以下のいずれかの原因で発生します。
- レスポンス本体が妨害またはロックされている場合。
- 本体コンテンツをデコードする際にエラーが発生した場合（例えば、
Content-Encodingヘッダーが不正な場合など）。
例
fetch request の例 (fetch request をライブで実行) では、Request() コンストラクターを使用して新しいリクエストを作成し、それを使用して JPG を読み取ります。読み取りが成功したら、blob() を使用してレスポンスから Blob を読み取り、それを URL.createObjectURL() を使用してオブジェクト URL に入れ、その URL を <img> 要素のソースとして設定して画像を表示します。
js
const myImage = document.querySelector("img");
const myRequest = new Request("flowers.jpg");
fetch(myRequest)
.then((response) => response.blob())
.then((myBlob) => {
const objectURL = URL.createObjectURL(myBlob);
myImage.src = objectURL;
});
仕様書
| Specification |
|---|
| Fetch # ref-for-dom-body-blob① |