Web/API/Body/blob

From Get docs
< Web/API‎ | Body


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.

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 [[../../../../../../../mdn.github.io/fetch-examples/fetch-request/index|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 Status Comment
FetchThe definition of 'blob()' in that specification. Living Standard

Browser compatibility

Update compatibility data on GitHub

Desktop Mobile
Chrome Edge Firefox Internet Explorer Opera Safari Android webview Chrome for Android Firefox for Android Opera for Android Safari on iOS Samsung Internet

blob

Experimental'

Chrome Full support 42


Full support 42


Full support 41

Disabled'

Disabled' From version 41: this feature is behind the Experimental Web Platform Features preference. To change preferences in Chrome, visit chrome://flags.

Edge

Full support ≤18

Firefox Full support 39


Full support 39


Full support 34

Disabled'

Disabled' From version 34: this feature is behind the dom.fetch.enabled preference. To change preferences in Firefox, visit about:config.

IE

No support No

Opera Full support 29


Full support 29


Full support 28

Disabled'

Disabled' From version 28: this feature is behind the Experimental Web Platform Features preference.

Safari

Full support 10.1

WebView Android

No support No

Chrome Android

Full support 42

Firefox Android

No support No

Opera Android Full support 29


Full support 29


Full support 28

Disabled'

Disabled' From version 28: this feature is behind the Experimental Web Platform Features preference.

Safari iOS

Full support 10.3

Samsung Internet Android

Full support 4.0

Legend

Full support  
Full support
No support  
No support
Experimental. Expect behavior to change in the future.'
Experimental. Expect behavior to change in the future.
User must explicitly enable this feature.'
User must explicitly enable this feature.


See also