diff options
Diffstat (limited to 'files/pl/web/api/response/index.html')
-rw-r--r-- | files/pl/web/api/response/index.html | 132 |
1 files changed, 132 insertions, 0 deletions
diff --git a/files/pl/web/api/response/index.html b/files/pl/web/api/response/index.html new file mode 100644 index 0000000000..394a5a4a4d --- /dev/null +++ b/files/pl/web/api/response/index.html @@ -0,0 +1,132 @@ +--- +title: Response +slug: Web/API/Response +tags: + - API + - Experimental + - Fetch + - Fetch API + - Interface + - NeedsTranslation + - Reference + - Response + - TopicStub +translation_of: Web/API/Response +--- +<div>{{APIRef("Fetch API")}}</div> + +<p>The <strong><code>Response</code></strong> interface of the <a href="/en-US/docs/Web/API/Fetch_API">Fetch API</a> represents the response to a request.</p> + +<p>You can create a new <code>Response</code> object using the {{domxref("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 {{domxref("Fetchevent.respondWith")}}, or a simple {{domxref("GlobalFetch.fetch()")}}.</p> + +<h2 id="Constructor">Constructor</h2> + +<dl> + <dt>{{domxref("Response.Response","Response()")}}</dt> + <dd>Creates a new <code>Response</code> object.</dd> +</dl> + +<h2 id="Properties">Properties</h2> + +<dl> + <dt>{{domxref("Response.headers")}} {{readonlyinline}}</dt> + <dd>Contains the {{domxref("Headers")}} object associated with the response.</dd> + <dt>{{domxref("Response.ok")}} {{readonlyinline}}</dt> + <dd>Contains a boolean stating whether the response was successful (status in the range 200-299) or not.</dd> + <dt>{{domxref("Response.redirected")}} {{ReadOnlyInline}}</dt> + <dd>Indicates whether or not the response is the result of a redirect; that is, its URL list has more than one entry.</dd> + <dt>{{domxref("Response.status")}} {{readonlyinline}}</dt> + <dd>Contains the status code of the response (e.g., <code>200</code> for a success).</dd> + <dt>{{domxref("Response.statusText")}} {{readonlyinline}}</dt> + <dd>Contains the status message corresponding to the status code (e.g., <code>OK</code> for <code>200</code>).</dd> + <dt>{{domxref("Response.trailers")}}</dt> + <dd>Contains a {{domxref("Promise")}} resolving to a {{domxref("Headers")}} object associated with the response with {{domxref("Response.headers")}} for values of the HTTP {{HTTPHeader("Trailer")}} header.</dd> + <dt>{{domxref("Response.type")}} {{readonlyinline}}</dt> + <dd>Contains the type of the response (e.g., <code>basic</code>, <code>cors</code>).</dd> + <dt>{{domxref("Response.url")}} {{readonlyinline}}</dt> + <dd>Contains the URL of the response.</dd> + <dt>{{domxref("Response.useFinalURL")}}</dt> + <dd>Contains a boolean stating whether this is the final URL of the response.</dd> +</dl> + +<p><code>Response</code> implements {{domxref("Body")}}, so it also has the following properties available to it:</p> + +<dl> + <dt>{{domxref("Body.body")}} {{readonlyInline}}</dt> + <dd>A simple getter used to expose a {{domxref("ReadableStream")}} of the body contents.</dd> + <dt>{{domxref("Body.bodyUsed")}} {{readonlyInline}}</dt> + <dd>Stores a {{domxref("Boolean")}} that declares whether the body has been used in a response yet.</dd> +</dl> + +<h2 id="Methods">Methods</h2> + +<dl> + <dt>{{domxref("Response.clone()")}}</dt> + <dd>Creates a clone of a <code>Response</code> object.</dd> + <dt>{{domxref("Response.error()")}}</dt> + <dd>Returns a new <code>Response</code> object associated with a network error.</dd> + <dt>{{domxref("Response.redirect()")}}</dt> + <dd>Creates a new response with a different URL.</dd> +</dl> + +<p><code>Response</code> implements {{domxref("Body")}}, so it also has the following methods available to it:</p> + +<dl> + <dt>{{domxref("Body.arrayBuffer()")}}</dt> + <dd>Takes a {{domxref("Response")}} stream and reads it to completion. It returns a promise that resolves with an {{domxref("ArrayBuffer")}}.</dd> + <dt>{{domxref("Body.blob()")}}</dt> + <dd>Takes a {{domxref("Response")}} stream and reads it to completion. It returns a promise that resolves with a {{domxref("Blob")}}.</dd> + <dt>{{domxref("Body.formData()")}}</dt> + <dd>Takes a {{domxref("Response")}} stream and reads it to completion. It returns a promise that resolves with a {{domxref("FormData")}} object.</dd> + <dt>{{domxref("Body.json()")}}</dt> + <dd>Takes a {{domxref("Response")}} stream and reads it to completion. It returns a promise that resolves with the result of parsing the body text asĀ {{jsxref("JSON")}}.</dd> + <dt>{{domxref("Body.text()")}}</dt> + <dd>Takes a {{domxref("Response")}} stream and reads it to completion. It returns a promise that resolves with a {{domxref("USVString")}} (text).</dd> +</dl> + +<h2 id="Examples">Examples</h2> + +<p>In our <a href="https://github.com/mdn/fetch-examples/tree/master/basic-fetch">basic fetch example</a> (<a href="http://mdn.github.io/fetch-examples/basic-fetch/">run example live</a>) we use a simple <code>fetch()</code> call to grab an image and display it in an {{htmlelement("img")}} tag. The <code>fetch()</code> call returns a promise, which resolves with the <code>Response</code> object associated with the resource fetch operation. You'll notice that since we are requesting an image, we need to run {{domxref("Body.blob")}} ({{domxref("Response")}} implements body) to give the response its correct MIME type.</p> + +<pre class="brush: js">const image = document.querySelector('.my-image'); +fetch('flowers.jpg').then(function(response) { + return response.blob(); +}).then(function(blob) { + const objectURL = URL.createObjectURL(blob); + image.src = objectURL; +});</pre> + +<p>You can also use the {{domxref("Response.Response()")}} constructor to create your own custom <code>Response</code> object:</p> + +<pre class="brush: js">const response = new Response();</pre> + +<h2 id="Specifications">Specifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + <tr> + <td>{{SpecName('Fetch','#response-class','Response')}}</td> + <td>{{Spec2('Fetch')}}</td> + <td>Initial definition</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + + + +<p>{{Compat("api.Response")}}</p> + +<h2 id="See_also">See also</h2> + +<ul> + <li><a href="/en-US/docs/Web/API/ServiceWorker_API">ServiceWorker API</a></li> + <li><a href="/en-US/docs/Web/HTTP/Access_control_CORS">HTTP access control (CORS)</a></li> + <li><a href="/en-US/docs/Web/HTTP">HTTP</a></li> +</ul> |