aboutsummaryrefslogtreecommitdiff
path: root/files/es/web/api/response
diff options
context:
space:
mode:
authorPeter Bengtsson <mail@peterbe.com>2020-12-08 14:41:45 -0500
committerPeter Bengtsson <mail@peterbe.com>2020-12-08 14:41:45 -0500
commit1109132f09d75da9a28b649c7677bb6ce07c40c0 (patch)
tree0dd8b084480983cf9f9680e8aedb92782a921b13 /files/es/web/api/response
parent4b1a9203c547c019fc5398082ae19a3f3d4c3efe (diff)
downloadtranslated-content-1109132f09d75da9a28b649c7677bb6ce07c40c0.tar.gz
translated-content-1109132f09d75da9a28b649c7677bb6ce07c40c0.tar.bz2
translated-content-1109132f09d75da9a28b649c7677bb6ce07c40c0.zip
initial commit
Diffstat (limited to 'files/es/web/api/response')
-rw-r--r--files/es/web/api/response/index.html128
-rw-r--r--files/es/web/api/response/ok/index.html66
-rw-r--r--files/es/web/api/response/response/index.html75
-rw-r--r--files/es/web/api/response/status/index.html73
4 files changed, 342 insertions, 0 deletions
diff --git a/files/es/web/api/response/index.html b/files/es/web/api/response/index.html
new file mode 100644
index 0000000000..11e18a501c
--- /dev/null
+++ b/files/es/web/api/response/index.html
@@ -0,0 +1,128 @@
+---
+title: Response
+slug: Web/API/Response
+tags:
+ - API
+ - Experimental
+ - Fetch
+ - Interface
+ - Referencia
+ - Respuesta
+translation_of: Web/API/Response
+---
+<div>{{APIRef("Fetch API")}}</div>
+
+<p>La interfaz <strong><code>Response</code></strong> de la <a href="/en-US/docs/Web/API/Fetch_API">Fetch API</a> representa la respuesta a una petición.</p>
+
+<p>Tú puedes crear un nuevo objeto <code>Response</code> usando el  constructor{{domxref("Response.Response()")}}, pero es más probable encontrar un objeto Response siendo devuelto como resultado de la operación de otra API, por ejemplo un service worker {{domxref("Fetchevent.respondWith")}}, o un simple {{domxref("GlobalFetch.fetch()")}}.</p>
+
+<h2 id="Constructor">Constructor</h2>
+
+<dl>
+ <dt>{{domxref("Response.Response","Response()")}}</dt>
+ <dd>Crea un nuevo objeto <code>Response</code>.</dd>
+</dl>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<dl>
+ <dt>{{domxref("Response.headers")}} {{readonlyinline}}</dt>
+ <dd>Contiene el objeto {{domxref("Headers")}} asociado con la respuesta.</dd>
+ <dt>{{domxref("Response.ok")}} {{readonlyinline}}</dt>
+ <dd>Contiene un estado indicando si la respuesta fue exitosa (estado en el rango  200-299) o no.</dd>
+ <dt>{{domxref("Response.redirected")}} {{ReadOnlyInline}}</dt>
+ <dd>Indica si la respuesta es o no el resultado de una redirección; eso es, su lista de URL tiene más de una entrada.</dd>
+ <dt>{{domxref("Response.status")}} {{readonlyinline}}</dt>
+ <dd>Contiene el código de estado de la respuesta (e.g., <code>200</code> si fue exitosa).</dd>
+ <dt>{{domxref("Response.statusText")}} {{readonlyinline}}</dt>
+ <dd>Contiene el mensaje de estado correspondiente al código de estado (e.g., <code>OK</code> para el Código <code>200</code>).</dd>
+ <dt>{{domxref("Response.type")}} {{readonlyinline}}</dt>
+ <dd>Contiene el tipo de respuesta (e.g., <code>basic</code>, <code>cors</code>).</dd>
+ <dt>{{domxref("Response.url")}} {{readonlyinline}}</dt>
+ <dd>Contiene la URL de respuesta.</dd>
+ <dt>{{domxref("Response.useFinalURL")}}</dt>
+ <dd>Contiene un valor booleano indicando si ésta es la URL final de respuesta.</dd>
+</dl>
+
+<p><code>Response</code> implementa {{domxref("Body")}}, de modo que además contiene las propiedades que se detallan a continuación:</p>
+
+<dl>
+ <dt>{{domxref("Body.body")}} {{readonlyInline}}</dt>
+ <dd>Un simple método get que expone un {{domxref("ReadableStream")}} de los contenidos del body.</dd>
+ <dt>{{domxref("Body.bodyUsed")}} {{readonlyInline}}</dt>
+ <dd>Almacena un {{domxref("Boolean")}}  en el cuál declara si el body ya fue enviado como respuesta anteriormente.</dd>
+</dl>
+
+<h2 id="Methods">Methods</h2>
+
+<dl>
+ <dt>{{domxref("Response.clone()")}}</dt>
+ <dd>Clona un Objeto Respuesta.</dd>
+ <dt>{{domxref("Response.error()")}}</dt>
+ <dd>Devuelve un nuevo objeto Respuesta asociado a un error de red.</dd>
+ <dt>{{domxref("Response.redirect()")}}</dt>
+ <dd>Crea una nueva respuesta con un URL distinto.</dd>
+ <dd><code>Response</code> iimplementa {{domxref("Body")}}, de modo que además contiene los métodos que se detallan a continuación:</dd>
+</dl>
+
+<dl>
+ <dt>{{domxref("Body.arrayBuffer()")}}</dt>
+ <dd>Toma un flujo {{domxref("Response")}} y lo lee hasta completarlo. Devuelve una promesa que resuelve con un {{domxref("ArrayBuffer")}}.</dd>
+ <dt>{{domxref("Body.blob()")}}</dt>
+ <dd>Toma un flujo {{domxref("Response")}} y lo lee hasta completarlo. Devuelve una promesa que resuelve con un {{domxref("Blob")}}.</dd>
+ <dt>{{domxref("Body.formData()")}}</dt>
+ <dd>Toma un flujo {{domxref("Response")}} y lo lee hasta completarlo. Devuelve una promesa que resuelve con un objeto {{domxref("FormData")}}.</dd>
+ <dt>{{domxref("Body.json()")}}</dt>
+ <dd>Recibe un flujo {{domxref("Response")}} y lo lee hasta completarlo. Devuelve una promesa que resuelve como {{jsxref("JSON")}} el texto del Body enviado.</dd>
+ <dt>{{domxref("Body.text()")}}</dt>
+ <dd>Recibe un flujo {{domxref("Response")}} y lo lee hasta completarlo. Devuelve una promesa que resuelve con un {{domxref("USVString")}} (texto).</dd>
+</dl>
+
+<h2 id="Examples">Examples</h2>
+
+<p>En nuestro <a href="https://github.com/mdn/fetch-examples/tree/gh-pages/basic-fetch">ejemplo básico de ferch</a> (<a href="http://mdn.github.io/fetch-examples/basic-fetch/">ejecutar el ejemplo</a>) usamos una llamada <code>fetch()</code> para descargar una imagen y mostrarla en una etiqueta {{htmlelement("img")}} . La llamda a <code>fetch()</code> call devuelve una promesa, la cual resuelve a un objeto<code>Response</code> asociado a la operación fetch.</p>
+
+<p>Observa como ya que lo que estamos solicitando es una imagen, necesitamos ejecutar {{domxref("Body.blob")}} ({{domxref("Response")}} implements body) para darle a la respuesta su tipo MIME correcto.</p>
+
+<pre class="brush: js notranslate">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;
+});</pre>
+
+<p>También puedes usar el constructor {{domxref("Response.Response()")}} para crear tus objetos <code>Response</code> personalizados:</p>
+
+<pre class="brush: js notranslate">var myResponse = new Response();</pre>
+
+<h2 id="Especificaciones">Especificaciones</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>Definición inicial</td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
+
+
+
+<p>{{Compat("api.Response")}}</p>
+
+<h2 id="Ver_también">Ver también</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>
diff --git a/files/es/web/api/response/ok/index.html b/files/es/web/api/response/ok/index.html
new file mode 100644
index 0000000000..1bff7fe5db
--- /dev/null
+++ b/files/es/web/api/response/ok/index.html
@@ -0,0 +1,66 @@
+---
+title: Response.ok
+slug: Web/API/Response/ok
+translation_of: Web/API/Response/ok
+---
+<div>{{APIRef("Fetch")}}<br>
+La propiedad de solo lectura <code><strong>ok</strong></code> de la interfaz {{domxref("Response")}} contiene un Booleano que indica si la respuesta fue exitosa (estado en un rango de 200 a 299)  o no.</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">var <var>miOK</var> = <var>respuesta</var>.ok;</pre>
+
+<h3 id="Valor">Valor</h3>
+
+<p>Un {{domxref("Boolean")}}.</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<p>En nuestro <a href="https://github.com/mdn/fetch-examples/tree/master/fetch-response">ejemplo de Fetch Response</a> (véase <a href="http://mdn.github.io/fetch-examples/fetch-response/">Fetch Response en vivo</a>) creamos un nuevo {{domxref("Request")}} usando el constructor {{domxref("Request.Request","Request()")}}, pasando una ruta a un JPG. Luego traemos esta petición usando {{domxref("GlobalFetch.fetch","fetch()")}}, extraemos un blob de la respuesta usando {{domxref("Body.blob")}}, creamos un objeto URL usando {{domxref("URL.createObjectURL")}}, y mostrar esto en un {{htmlelement("img")}}.</p>
+
+<div class="note">
+<p><strong>Nota:</strong>  en la parte superior del bloque de <code>fetch()</code> imprimimos el valor de <code>ok</code> en la consola.</p>
+</div>
+
+<pre class="brush: js">var imagen = document.querySelector('img');
+
+var peticion = new Request('flowers.jpg');
+
+fetch(peticion).then(function(respuesta) {
+ console.log(respuesta.ok); //retorna true si la respuesta fue exitosa
+ respuesta.blob().then(function(miBlob) {
+ var objectoURL = URL.createObjectURL(miBlob);
+ imagen.src = objectURL;
+ });
+});</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+ <tr>
+ <th scope="col">Especificación</th>
+ <th scope="col">Estado</th>
+ <th scope="col">Comentario</th>
+ </tr>
+ <tr>
+ <td>{{Spec2('Fetch')}}</td>
+ <td>{{Spec2('Fetch')}}</td>
+ <td>Definición inicial</td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+
+
+<p>{{Compat("api.Response.ok")}}</p>
+
+<h2 id="Ver_también">Ver también</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>
diff --git a/files/es/web/api/response/response/index.html b/files/es/web/api/response/response/index.html
new file mode 100644
index 0000000000..f967d677f2
--- /dev/null
+++ b/files/es/web/api/response/response/index.html
@@ -0,0 +1,75 @@
+---
+title: Response()
+slug: Web/API/Response/Response
+translation_of: Web/API/Response/Response
+---
+<div>{{APIRef("Fetch")}}</div>
+
+<p>El constructor <code><strong>Response()</strong></code> crea un nuevo objeto {{domxref("Response")}}</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">var <var>miRespuesta</var> = new Response(<var>cuerpo</var>,<em>opciones</em>);</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><em>cuerpo</em> {{optional_inline}}</dt>
+ <dd>Un objeto que define el cuerpo de la respuesta. Puede ser <code>null</code>, o uno de los siguientes elementos:
+ <ul>
+ <li>{{domxref("Blob")}}</li>
+ <li>{{domxref("BufferSource")}}</li>
+ <li>{{domxref("FormData")}}</li>
+ <li>{{domxref("ReadableStream")}}</li>
+ <li>{{domxref("URLSearchParams")}}</li>
+ <li>{{domxref("USVString")}}</li>
+ </ul>
+ </dd>
+ <dt><em>opciones</em> {{optional_inline}}</dt>
+ <dd>Un objeto que contiene las opciones de personalización para la respuesta HTTP. Las opciones posibles son:
+ <ul>
+ <li><code>status</code>: El código de estado HTTP, p.e.: <code>200</code>.</li>
+ <li><code>statusText</code>: El mensaje de estado asociado con el código de estado HTTP, p.e.: <code>OK</code>.</li>
+ <li><code>headers</code>: Cualquier cabecera que quieras añadir a la respuesta. Puede ser un objeto {{domxref("Headers")}} o un objeto literal de {{domxref("ByteString")}} pares claves/valor (ver <a href="/en-US/docs/Web/HTTP/Headers">Cabeceras HTTP</a> para más información).</li>
+ </ul>
+ </dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>En nuestro <a href="https://github.com/mdn/fetch-examples/tree/master/fetch-response">ejemplo Fetch Response</a> (ver <a href="http://mdn.github.io/fetch-examples/fetch-response/">Fetch Response live</a>) creamos un nuevo objeto <code>Response</code> usando el constructor, pasándole un nuevo objeto {{domxref("Blob")}} como cuerpo, y un objeto con <code>status</code> y<code>statusText</code> como opciones:</p>
+
+<pre class="brush: js">var miBlob = new Blob();
+var opciones = { "status" : 200 , "statusText" : "Flipante!" };
+var miRespuesta = new Response(miBlob,opciones);</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+ <tr>
+ <th scope="col">Especificación</th>
+ <th scope="col">Estado</th>
+ <th scope="col">Comentarios</th>
+ </tr>
+ <tr>
+ <td>{{SpecName('Fetch','#dom-response','Response()')}}</td>
+ <td>{{Spec2('Fetch')}}</td>
+ <td>Definición inicial</td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<div class="hidden">La tabla de compatibilidad de esta página está generada a partir de datos estructurados. Si deseas contribuir a los datos, por favor échale un vistazo a <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos un pull request.</div>
+
+<p>{{Compat("api.Response.Response")}}</p>
+
+<h2 id="Relacionado">Relacionado</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>
diff --git a/files/es/web/api/response/status/index.html b/files/es/web/api/response/status/index.html
new file mode 100644
index 0000000000..eecaf02967
--- /dev/null
+++ b/files/es/web/api/response/status/index.html
@@ -0,0 +1,73 @@
+---
+title: Response.status
+slug: Web/API/Response/status
+tags:
+ - API
+ - Experimental
+ - Fetch
+ - Property
+ - Reference
+ - Response
+ - status
+translation_of: Web/API/Response/status
+---
+<div>{{APIRef("Fetch")}}</div>
+
+<p>La propiedad de solo lectura <strong><code>status</code></strong> de la interfaz {{domxref("Response")}} contiene el código de estado de la respuesta (ejm., <code>200</code> para un éxito).</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">var <var>myStatus</var> = <var>response</var>.status;</pre>
+
+<h3 id="Valor">Valor</h3>
+
+<p>Un número (para ser preciso, uno corto sin signo).</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<p>En nuestro <a href="https://github.com/mdn/fetch-examples/tree/master/fetch-response">ejemplo Fetch Response</a> (ver <a href="http://mdn.github.io/fetch-examples/fetch-response/">Fetch Response en vivo</a>) nosotros creamos un nuevo objeto {{domxref("Request")}} usando el constructor {{domxref("Request.Request","Request()")}}, pasándole una ruta JPG. Luego buscamos esta solicitud usando  {{domxref("GlobalFetch.fetch","fetch()")}}, extraemos un blob de la respuesta usando {{domxref("Body.blob")}}, creamos un objeto URL fuera de ella usando {{domxref("URL.createObjectURL")}}, y mostramos esto en un {{htmlelement("img")}}.</p>
+
+<p>Tenga en cuenta que en la parte superior del bloque  <code>fetch()</code> registramos el valor de la respuesta  <code>status</code> en la consola.</p>
+
+<pre class="brush: js">var myImage = document.querySelector('img');
+
+var myRequest = new Request('flowers.jpg');
+
+fetch(myRequest).then(function(response) {
+ console.log(response.status); // returns 200
+ response.blob().then(function(myBlob) {
+ var objectURL = URL.createObjectURL(myBlob);
+ myImage.src = objectURL;
+ });
+});</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+ <tr>
+ <th scope="col">Especificación</th>
+ <th scope="col">Estatus</th>
+ <th scope="col">Comentario</th>
+ </tr>
+ <tr>
+ <td>{{SpecName('Fetch','#dom-response-status','status')}}</td>
+ <td>{{Spec2('Fetch')}}</td>
+ <td>Definición inicial</td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div class="hidden">La tabla de compatibilidad en esta página se genera a partir de datos estructurados. Si desea contribuir a los datos, consulte <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíenos una solicitud de extracción.</div>
+
+<p>{{Compat("api.Response.status")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/API/ServiceWorker_API">API de Servicio Worker</a></li>
+ <li><a href="/en-US/docs/Web/HTTP/Access_control_CORS">Control de acceso HTTP (CORS)</a></li>
+ <li><a href="/en-US/docs/Web/HTTP">HTTP</a></li>
+</ul>