Response: blob() method

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.

Note: This feature is available in Web Workers.

The blob() method of the Response interface takes a Response stream and reads it to completion. It returns a promise that resolves with a Blob.

Syntax

js
blob()

Parameters

None.

Note: If the Response has a Response.type of "opaque", the resulting Blob will have a Blob.size of 0 and a Blob.type of empty string "", which renders it useless for methods like URL.createObjectURL().

Return value

A promise that resolves with a Blob.

Exceptions

DOMException AbortError

The request was aborted.

TypeError

Thrown for one of the following reasons:

Examples

In our fetch request example (run fetch request live), we create a new request using the Request() constructor, then use it to fetch a JPG. When the fetch is successful, we read a Blob out of the response using blob(), put it into an object URL using URL.createObjectURL(), and then set that URL as the source of an <img> element to display the image.

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;
  });

Specifications

Specification
Fetch
# ref-for-dom-body-blob①

Browser compatibility

Report problems with this compatibility data on GitHub
desktopmobileserver
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
Deno
Node.js
blob

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support

See also