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
}); None.
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.A promise that resolves with a Blob.
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;
});
| Specification | Status | Comment |
|---|---|---|
| Fetch The definition of 'blob()' in that specification. | Living Standard |
| Desktop | ||||||
|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | |
| Basic support | 42
|
Yes | 39
|
No | 29
|
No |
| Mobile | |||||||
|---|---|---|---|---|---|---|---|
| Android webview | Chrome for Android | Edge Mobile | Firefox for Android | Opera for Android | iOS Safari | Samsung Internet | |
| Basic support | No | No | Yes | No | No | No | No |
© 2005–2018 Mozilla Developer Network and individual contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/Body/blob