Web/API/Body/body

From Get docs
< Web/API‎ | Body

This is an experimental technologyCheck the Browser compatibility table carefully before using this in production.


The body read-only property of the Body mixin is a simple getter used to expose a ReadableStream of the body contents.

Syntax

var stream = response.body;

Value

A ReadableStream.

Example

In our [[../../../../../../../mdn.github.io/dom-examples/streams/simple-pump/index|simple stream pump]] example we fetch an image, expose the response's stream using response.body, create a reader using ReadableStream.getReader(), then enqueue that stream's chunks into a second, custom readable stream — effectively creating an identical copy of the image.

const image = document.getElementById('target');

// Fetch the original image
fetch('./tortoise.png')
// Retrieve its body as ReadableStream
.then(response => response.body)
.then(body => {
  const reader = body.getReader();

  return new ReadableStream({
    start(controller) {
      return pump();

      function pump() {
        return reader.read().then(({ done, value }) => {
          // When no more data needs to be consumed, close the stream
          if (done) {
            controller.close();
            return;
          }

          // Enqueue the next data chunk into our target stream
          controller.enqueue(value);
          return pump();
        });
      }
    }
  })
})
.then(stream => new Response(stream))
.then(response => response.blob())
.then(blob => URL.createObjectURL(blob))
.then(url => console.log(image.src = url))
.catch(err => console.error(err));

Specifications

Specification Status Comment
FetchThe definition of 'body' 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

body

Experimental'

Chrome

Full support 52

Edge

Full support ≤18

Firefox Full support 65


Full support 65


Full support 57

Disabled'

Disabled' From version 57: this feature is behind the dom.streams.enabled preference (needs to be set to true) and the javascript.options.streams preference (needs to be set to true). To change preferences in Firefox, visit about:config.

IE

No support No

Opera

Full support 39

Safari

Full support 11.1

WebView Android

Full support 52

Chrome Android

Full support 52

Firefox Android Full support 65


Full support 65


Full support 57

Disabled'

Disabled' From version 57: this feature is behind the dom.streams.enabled preference (needs to be set to true) and the javascript.options.streams preference (needs to be set to true). To change preferences in Firefox, visit about:config.

Opera Android

Full support 41

Safari iOS

Full support 11.3

Samsung Internet Android

Full support 6.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