Response.blob()

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

response.blob().then(function(myBlob) {
  // do something with myBlob
});

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.

Example

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.

var myImage = document.querySelector('img');

var myRequest = new Request('flowers.jpg');

fetch(myRequest)
.then(response => response.blob())
.then(function(myBlob) {
  var objectURL = URL.createObjectURL(myBlob);
  myImage.src = objectURL;
});

Specifications

Specification
Fetch Standard (Fetch) # ref-for-dom-body-blob①

Browser compatibility

	Desktop						Mobile
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	WebView Android	Chrome Android	Firefox for Android	Opera Android	Safari on IOS	Samsung Internet
`blob`	42	14	39	No	29	10.1	42	42	39	29	10.3	4.0