1 files changed, 156 insertions, 0 deletions
diff --git a/files/es/mozilla/add-ons/webextensions/intercept_http_requests/index.html b/files/es/mozilla/add-ons/webextensions/intercept_http_requests/index.html
new file mode 100644
index 0000000000..a87d079ecd
--- /dev/null
+++ b/files/es/mozilla/add-ons/webextensions/intercept_http_requests/index.html
@@ -0,0 +1,156 @@
+---
+title: Interceptar peticiones HTTP
+slug: Mozilla/Add-ons/WebExtensions/Intercept_HTTP_requests
+tags:
+  - Complementos
+  - Cómos
+  - WebExtensions
+  - extensiones
+translation_of: Mozilla/Add-ons/WebExtensions/Intercept_HTTP_requests
+---
+<div>{{AddonSidebar}}</div>
+
+<p>Para interceptar peticiones HTTP, utilice la API {{WebExtAPIRef("webRequest")}}. Esta API le permite agregar escuchadores de evento para varias etapas en la realización de las solicitudes HTTP. En los escuchadores, tu puedes:</p>
+
+<ul>
+ <li>Obtener acceso a la solicitud y respuesta de las cabeceras y cuerpos</li>
+ <li>Cancelar y redireccionar las solicitudes</li>
+ <li>Modificar las solicitudes y respuestas de las cabeceras</li>
+</ul>
+
+<p>En este artículo se verán los tres diferentes usos del módulo <code>webRequest</code>:</p>
+
+<ul>
+ <li>Registro de solicitudes de URLs a medida que se realizan.</li>
+ <li>Redireccionar las solicitudes.</li>
+ <li>Modificar las cabeceras de las solicitud.</li>
+</ul>
+
+<h2 id="Registrar_solicitudes_de_URLs">Registrar solicitudes de URLs</h2>
+
+<p>Crea un nuevo directorio llamado "requests". En ese directorio, crea un archivo llamado "manifest.json" el cual debe poseer el siguiente contenido:</p>
+
+<pre class="brush: json">{
+  "description": "Demostrar webRequests",
+  "manifest_version": 2,
+  "name": "webRequest-demo",
+  "version": "1.0",
+
+  "permissions": [
+    "webRequest"
+  ],
+
+  "background": {
+    "scripts": ["background.js"]
+  }
+}</pre>
+
+<p>Luego, crea un archivo llamado "background.js" con el siguiente contenido:</p>
+
+<pre class="brush: js">function logURL(requestDetails) {
+  console.log("Cargando: " + requestDetails.url);
+}
+
+browser.webRequest.onBeforeRequest.addListener(
+  logURL,
+  {urls: ["&lt;all_urls&gt;"]}
+);
+
+</pre>
+
+<p>En este punto se utiliza {{WebExtAPIRef("webRequest.onBeforeRequest", "onBeforeRequest")}} para llamar la función <code>logURL()</code> junstamente después de realizar la solicitud. La función <code>logURL()</code> se apropia de la solicitud URL del objeto de eventos y lo registra en la consola del navegador. <code>El </code><a href="/es/Add-ons/WebExtensions/Match_patterns">patrón</a><code> {urls: ["&lt;all_urls&gt;"]}</code> signinifica que se pueden interceptar todas las solicitudes HTTP de todas las URLs.</p>
+
+<p>Para probarlo, <a href="/esAdd-ons/WebExtensions/Temporary_Installation_in_Firefox">instala la WebExtension</a>, <a href="/es/docs/Tools/Browser_Console">abre la consola del navegador</a>, y abre algunas páginas Web. En la consola del navegador, deberías ver las URLs de cualquier recurso que el navegador solicita:</p>
+
+<p>{{EmbedYouTube("X3rMgkRkB1Q")}}</p>
+
+<h2 id="Redireccionar_solicitudes">Redireccionar solicitudes</h2>
+
+<p>Ahora utilice <code>webRequest</code> para redireccionar todas las solicitudes HTTP. Primero, reemplace manifest.json con lo siguiente:</p>
+
+<pre class="brush: json">{
+
+  "description": "Demostrar webRequests",
+  "manifest_version": 2,
+  "name": "webRequest-demo",
+  "version": "1.0",
+
+  "permissions": [
+    "webRequest", "webRequestBlocking"
+  ],
+
+  "background": {
+    "scripts": ["background.js"]
+  }
+
+}</pre>
+
+<p>El único cambio fue la adición de los <code><a href="/es/docs/Mozilla/Add-ons/WebExtensions/manifest.json/permissions">permisos</a></code> <code>"webRequestBlocking"</code>. Se necesita preguntar por este extra-permiso todas las veces que se está activamente modificando una solicitud.</p>
+
+<p>Luego, reemplace "background.js" con esto:</p>
+
+<pre class="brush: js">var pattern = "https://mdn.mozillademos.org/*";
+
+function redirect(requestDetails) {
+  console.log("Redireccionando: " + requestDetails.url);
+  return {
+    redirectUrl: "https://38.media.tumblr.com/tumblr_ldbj01lZiP1qe0eclo1_500.gif"
+  };
+}
+
+browser.webRequest.onBeforeRequest.addListener(
+  redirect,
+  {urls:[pattern], types:["image"]},
+  ["blocking"]
+);</pre>
+
+<p>De nuevo, se utiliza el escuchador de evento {{WebExtAPIRef("webRequest.onBeforeRequest", "onBeforeRequest")}} para ejecutar una función justamente antes de que cada solicitud sea realizada. Esta función reemplazará el objetivo URL con <code>redirectUrl</code> que está definido en la función.</p>
+
+<p>Esta vez no se está interceptando cada solicitud: la opción <code>{urls:[pattern], types:["image"]}</code> especifica que solo se debería interceptar solicitudes (1) de URLs que residen bajo "https://mdn.mozillademos.org/" (2) para recursos de imágenes. Vea {{WebExtAPIRef("webRequest.RequestFilter")}} para más información sobre esto.</p>
+
+<p>Dése cuenta también, que se esta pasando la opción llamada <code>"blocking"</code>: se necesita pasar cada vez que se requiera modificar la solicitud. Esto hace que la función del escuchador bloquee la solicitud de la red, así que el navegador espera que el escuchador retorne antes de continuar. Vea la documentación {{WebExtAPIRef("webRequest.onBeforeRequest")}} para conocer más sobre <code>"blocking"</code>.</p>
+
+<p>Para probarlo, abra una página de MDN que contenga bastantes imágenes (por ejemplo <a href="https://developer.mozilla.org/en-US/docs/Tools/Network_Monitor">https://developer.mozilla.org/en-US/docs/Tools/Network_Monitor</a>), <a href="/en-US/Add-ons/WebExtensions/Temporary_Installation_in_Firefox#Reloading_a_temporary_add-on">recargue la WebExtension</a>, y luego recargue la página de MDN:</p>
+
+<p>{{EmbedYouTube("ix5RrXGr0wA")}}</p>
+
+<h2 id="Modificar_las_cabeceras_de_la_solicitud">Modificar las cabeceras de la solicitud</h2>
+
+<p>Finalmente se utilizará <code>webRequest</code> para modificar las cabeceras de las solicitudes. En este ejempo se modificará la cabecera "User-Agent" así que el navegador se identificará por sí mismo como Opera 12.16, pero solamente cuando se visitan páginas de "http://useragentstring.com/".</p>
+
+<p>El "manifest.json" puede permanecer igual que el ejemplo anterior.</p>
+
+<p>Reemplace "background.js" con el siguiente código:</p>
+
+<pre class="brush: js">var targetPage = "http://useragentstring.com/*";
+
+var ua = "Opera/9.80 (X11; Linux i686; Ubuntu/14.10) Presto/2.12.388 Version/12.16";
+
+function rewriteUserAgentHeader(e) {
+  for (var header of e.requestHeaders) {
+    if (header.name == "User-Agent") {
+      header.value = ua;
+    }
+  }
+  return {requestHeaders: e.requestHeaders};
+}
+
+browser.webRequest.onBeforeSendHeaders.addListener(
+  rewriteUserAgentHeader,
+  {urls: [targetPage]},
+  ["blocking", "requestHeaders"]
+);</pre>
+
+<p>Aquí se utiliza el escuchador de eventos {{WebExtAPIRef("webRequest.onBeforeSendHeaders", "onBeforeSendHeaders")}} para ejecutar una función juntamente antes de que la solicitud de las cabeceras sean enviadas.</p>
+
+<p>La función escuchadora será llamada solamente por solicitudes de URLs que coincidan con el <a href="/es/Add-ons/WebExtensions/Match_patterns">patrón </a><code>targetPage</code>. Dése cuenta de nuevo que <code>"blocking"</code> se ha pasado como una opción. También se pasó <code>"requestHeaders"</code>, lo cual significa que al escuchador pasará un array conteniendo las cabeceras de la solicitud que se espera enviar. Vea {{WebExtAPIRef("webRequest.onBeforeSendHeaders")}} para más información en estas opciones.</p>
+
+<p>La función escuchadora busca la cabecera "User-Agent" en el array de la solicitud de cabeceras, reemplaza el valor con el valor de la variable <code>ua</code>, y regresa el array modificado. Este array modificado será el enviado al servidor.</p>
+
+<p>Para comprobarlo, abra <a href="http://useragentstring.com/">useragentstring.com</a> y verifique que identifica al navegador como Firefox. Luego recargue el complemento, recargue <a href="http://useragentstring.com/">useragentstring.com</a>, y compruebe que Firefox es identificado ahora como Opera:</p>
+
+<p>{{EmbedYouTube("SrSNS1-FIx0")}}</p>
+
+<h2 id="Aprenda_más">Aprenda más</h2>
+
+<p>Para aprender más sobre todas las cosas que puede hacer con la API <code>webRequest</code>, vea su propia <a href="/en-US/Add-ons/WebExtensions/API/WebRequest">documentación de referencia</a>.</p>