The Response
interface of the Fetch API represents the response to a request.
You can create a new Response
object using the Response.Response()
constructor, but you are more likely to encounter a Response object being returned as the result of another API operation, for example a service worker Fetchevent.respondWith
, or a simple GlobalFetch.fetch()
.
Response()
Response
object.Response.headers
Read only
Headers
object associated with the response.Response.ok
Read only
Response.redirected
Read only
Response.status
Read only
200
for a success).Response.statusText
Read only
OK
for 200
).Response.type
Read only
basic
, cors
).Response.url
Read only
Response.useFinalURL
Response
implements Body
, so it also has the following properties available to it:
Body.body
Read only
ReadableStream
of the body contents.Body.bodyUsed
Read only
Boolean
that declares whether the body has been used in a response yet.Response.clone()
Response
object.Response.error()
Response
object associated with a network error.Response.redirect()
Response
implements Body
, so it also has the following methods available to it:
Body.arrayBuffer()
Response
stream and reads it to completion. It returns a promise that resolves with an ArrayBuffer
.Body.blob()
Response
stream and reads it to completion. It returns a promise that resolves with a Blob
.Body.formData()
Response
stream and reads it to completion. It returns a promise that resolves with a FormData
object.Body.json()
Response
stream and reads it to completion. It returns a promise that resolves with the result of parsing the body text as JSON
.Body.text()
Response
stream and reads it to completion. It returns a promise that resolves with a USVString
(text).In our basic fetch example (run example live) we use a simple fetch()
call to grab an image and display it in an <img>
tag. The fetch()
call returns a promise, which resolves with the Response
object associated with the resource fetch operation. You'll notice that since we are requesting an image, we need to run Body.blob
(Response
implements body) to give the response its correct MIME type.
var myImage = document.querySelector('.my-image'); fetch('flowers.jpg').then(function(response) { return response.blob(); }).then(function(blob) { var objectURL = URL.createObjectURL(blob); myImage.src = objectURL; });
You can also use the Response.Response()
constructor to create your own custom Response
object:
var myResponse = new Response();
Specification | Status | Comment |
---|---|---|
Fetch The definition of 'Response' in that specification. | Living Standard | Initial definition |
Feature | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
---|---|---|---|---|---|---|
Basic support | 42 | (Yes) |
34 (34) [1] 39 (39) | No support | 29 | 10.1 |
Body.formData attribute | 60 | ? | ? | No support | 47 | ? |
redirected attribute | 57 | ? | 49 (49) | No support | 44 | No support |
Feature | Android Webview | Chrome for Android | Edge | Firefox Mobile (Gecko) | Firefox OS (Gecko) | IE Phone | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|---|---|---|
Basic support | 42 | 42 | (Yes) | 34.0 (34) [1] 39.0 (39) | ? | No support | 29 | No support |
Body.formData attribute | 60 | 60 | ? | ? | ? | No support | 47 | No support |
redirected attribute | 57 | 57 | ? | 49.0 (49) | ? | No support | 44 | No support |
[1] This was implemented behind a preference until Firefox 39.
© 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/Response