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.
Returns
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.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(function(response) { return response.blob(); }) .then(function(myBlob) { var objectURL = URL.createObjectURL(myBlob); myImage.src = objectURL; });
Specifications
Specification | Status | Comment |
---|---|---|
Fetch The definition of 'blob()' in that specification. |
Living Standard |
Browser compatibility
Feature | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
---|---|---|---|---|---|---|
Basic support | 42 [1] |
(Yes) | 39 (39) [2] | No support |
29 [3] |
No support |
Feature | Android | Edge | Firefox Mobile (Gecko) | Firefox OS (Gecko) | IE Phone | Opera Mobile | Safari Mobile | Chrome for Android |
---|---|---|---|---|---|---|---|---|
Basic support | No support | (Yes) | No support | No support | No support | No support | No support | No support |
[1] Behind a preference in version 41.
[2] Behind a preference starting with version 34.
[3] Behind a preference in version 28.
See also
Document Tags and Contributors
Tags:
Contributors to this page:
chrisdavidmills,
ishasaran,
erikadoyle,
omriBernstein,
fscholz,
kscarfone
Last updated by:
chrisdavidmills,