aboutsummaryrefslogtreecommitdiff
path: root/files/es/web/api/navigatoronline/eventos_online_y_offline
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/navigatoronline/eventos_online_y_offline
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/navigatoronline/eventos_online_y_offline')
-rw-r--r--files/es/web/api/navigatoronline/eventos_online_y_offline/index.html91
1 files changed, 91 insertions, 0 deletions
diff --git a/files/es/web/api/navigatoronline/eventos_online_y_offline/index.html b/files/es/web/api/navigatoronline/eventos_online_y_offline/index.html
new file mode 100644
index 0000000000..d4f8a77824
--- /dev/null
+++ b/files/es/web/api/navigatoronline/eventos_online_y_offline/index.html
@@ -0,0 +1,91 @@
+---
+title: Eventos online y offline
+slug: Web/API/NavigatorOnLine/Eventos_online_y_offline
+tags:
+ - AJAX
+ - DOM
+ - Desarrollo_Web
+ - Todas_las_Categorías
+translation_of: Web/API/NavigatorOnLine/Online_and_offline_events
+---
+<p>{{ Fx_minversion_header(3) }}
+<a href="es/Firefox_3_para_desarrolladores">Firefox 3</a> implementa <a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/#offline">eventos Online/Offline</a> de la <a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/">especificacióbn WHATWG Web Applications 1.0</a>.
+</p>
+<h3 id="Descripci.C3.B3n" name="Descripci.C3.B3n"> Descripción </h3>
+<p>Para poder construir una aplicación web offline-funcional, necesitas conocer cuándo está tu aplicación realmente offline. Además, también necesitas conocer cuándo vuelve la aplicación al estado 'online' nuevamente. A efectos prácticos, los requisitos son los siguientes:
+</p>
+<ol><li> Necesitas conocer cuándo el usuario vuelve a estar online, para que puedas re-sincronizar con el servidor.
+</li><li> Necesitas conocer cuándo el usuario está offline, para así estar seguro de poner en cola las peticiones al servidor para más tarde.
+</li></ol>
+<p>Es este proceso el que los eventos online/offline ayudan a trivializar.
+</p><p>Tu aplicación web quizás necesite establecer que ciertos documentos se mantengan en la caché de recursos offline. Para hacerlo, incluye elementos <code>LINK</code> en tu sección <code>HEAD</code> de la siguiente manera:
+</p>
+<pre class="eval"><span class="nowiki">&lt;link rel="offline-resource" href="mi_recurso&gt;</span>
+</pre>
+<p>Cuando Firefox 3 o superiores procesan el HTML, esto causará que el recurso referenciado se mantenga en caché para su uso offline en un recurso especial de la caché.
+</p>
+<h3 id="API" name="API"> API </h3>
+<h4 id="navigator.onLine" name="navigator.onLine"> <code>navigator.onLine</code> </h4>
+<p><code><a href="es/DOM/window.navigator.onLine">navigator.onLine</a></code> es una propiedad que mantiene un valor <code>true</code>/<code>false</code> (<code>true</code> para online, <code>false</code> para offline). Esta propiedad se actualiza siempre que el usuario cambia hacia "Modo sin conexión" seleccionando el menú correspondiente (Archivo -&gt; Trabajar sin conexión en Firefox).
+</p><p>Además, esta propiedad se debería actualizar siempre que el navegador no sea capaz de conectarse a la red. De acuerdo con la especificación:
+</p>
+<blockquote>
+El atributo <code>navigator.onLine</code> debe devolver false si el agente de usuario no contactará con la red cuando el usuario siga los enlaces o cuando un script solicite una página remota (o sepa que intentarlo fallaría)...
+</blockquote>
+<p>Firefox 2 actualiza esta propiedad cuando cambia desde/hacia el modo offline del navegador, y cuando pierde/recupera la conectividad de la red en Windows y Linux.
+</p><p>Esta propiedad existía en versiones más antiguas de Firefox e Internet Explorer (la especificación surgió a partir estas implementaciones previas), así que puedes comenzar a usarla inmediatamente. La detección automática del estado de la red se implementó en Firefox 2.
+</p>
+<h4 id="eventos_.22online.22_y_.22offline.22" name="eventos_.22online.22_y_.22offline.22"> eventos "<code>online</code>" y "<code>offline</code>" </h4>
+<p><a href="es/Firefox_3_para_desarrolladores">Firefox 3</a> introduce dos nuevos eventos: "<code>online</code>" y "<code>offline</code>". Estos dos eventos son iniciados en el <code>&lt;body&gt;</code> de cada página cuando el usuario cambia de modo online a offline. Además, los eventos emergen desde <code>document.body</code> a <code>document</code>, terminando en <code>window</code>. Ambos eventos son no-cancelables (no se puede evitar que el usuario pase a modo online u offline).
+</p><p>Puedes registrar <i>listeners</i> para estos eventos de varias maneras habituales:
+</p>
+<ul><li> Usando <code><a href="es/DOM/element.addEventListener">addEventListener</a></code> en <code>window</code>, <code>document</code> o <code>document.body</code>
+</li><li> estableciendo las propiedades <code>.ononline</code> u <code>.onoffline</code> en <code>document</code> o <code>document.body</code> para que apunten a un objeto JavaScript <code>Function</code> (<b>Nota:</b> usar <code>window.ononline</code> o <code>window.onoffline</code> no funcionará por razones de compatibilidad).
+</li><li> especificando los atributos <code>ononline="..."</code> u <code>onoffline="..."</code> en la etiqueta <code>&lt;body&gt;</code> en el código HTML.
+</li></ul>
+<h3 id="Ejemplo:" name="Ejemplo:"> Ejemplo: </h3>
+<p>Hay una <a class="link-https" href="https://bugzilla.mozilla.org/attachment.cgi?id=220609">prueba sencilla</a> que puedes ejecutar para verificar que los eventos están funcionando.
+</p><p><span class="comment">
+</span></p>
+<pre class="eval"> &lt;!doctype html&gt;
+ &lt;html&gt;
+ &lt;head&gt;
+ &lt;script&gt;
+ function updateOnlineStatus(msg) {
+ var status = document.getElementById("status");
+ var condition = navigator.onLine ? "ONLINE" : "OFFLINE";
+ status.setAttribute("class", condition);
+ var state = document.getElementById("state");
+ state.innerHTML = condition;
+ var log = document.getElementById("log");
+ log.appendChild(document.createTextNode("Event: " + msg + "; status=" + condition + "\n"));
+ }
+ function loaded() {
+ updateOnlineStatus("load");
+ document.body.addEventListener("offline", function () {
+ updateOnlineStatus("offline")
+ }, false);
+ document.body.addEventListener("online", function () {
+ updateOnlineStatus("online")
+ }, false);
+ }
+ &lt;/script&gt;
+ &lt;style&gt;...&lt;/style&gt;
+ &lt;/head&gt;
+ &lt;body onload="loaded()"&gt;
+ &lt;div id="status"&gt;&lt;p id="state"&gt;&lt;/p&gt;&lt;/div&gt;
+ &lt;div id="log"&gt;&lt;/div&gt;
+ &lt;/body&gt;
+ &lt;/html&gt;
+</pre>
+<h3 id="Referencias" name="Referencias"> Referencias </h3>
+<ul><li> <a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/#offline">Sección 'Eventos Online/Offline ' de la especificación WHATWG Web Applications 1.0 </a>
+</li><li> <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=336359">El bug que documenta la implementación de los eventos online/offline en Firefox </a> y un enlace <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=336682">con una modificación posterior</a>
+</li><li> <a class="link-https" href="https://bugzilla.mozilla.org/attachment.cgi?id=220609">Un ejemplo sencillo</a>
+</li><li> <a class="external" href="http://ejohn.org/blog/offline-events/">Una explicación de los eventos Online/Offline</a>
+</li></ul>
+<p><br>
+</p>
+<div class="noinclude">
+</div>
+{{ languages( { "en": "en/Online_and_offline_events", "fr": "fr/\u00c9v\u00e8nements_online_et_offline", "ja": "ja/Online_and_offline_events", "pl": "pl/Zdarzenia_online_i_offline", "pt": "pt/Eventos_online_e_offline" } ) }}