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


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



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.


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

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


Specification Status Comment
The definition of 'blob()' in that specification.
Living Standard

Browser compatibility

BCD tables only load in the browser

See also