Este proyecto no se mantiene activamente.
Nota para los usuarios anteriores a 0.6.0: Offline anteriormente usaba un archivo alojado en la nube como uno de sus métodos para detectar el estado de la conexión. Este método ahora está en desuso y la imagen se ha eliminado. Actualice a Offline 0.7.0+.
Mejora la experiencia de tu aplicación cuando tus usuarios pierdan la conexión.
Monitorea las solicitudes ajax en busca de fallas.
Confirma el estado de la conexión solicitando una imagen o recurso falso
Capta automáticamente las solicitudes ajax realizadas mientras la conexión está inactiva y las rehace después de que se restablece la conexión.
UI simple con hermosos temas
3kb minificado y comprimido
Incluya javascript, uno de los temas y uno de los idiomas en su sitio. ¡Ya terminaste!
Para usar solo la API de JavaScript sin un indicador de interfaz de usuario, simplemente omita el archivo CSS.
Si desea echar un vistazo a cómo se ve su sitio, desconecte Internet o pruebe el simulador.
Opcionalmente, puede proporcionar alguna configuración configurando Offline.options
después de ingresar el script.
Opciones (cualquiera se puede proporcionar como función), con sus valores predeterminados:
{ // ¿Deberíamos verificar el estado de la conexión inmediatamente al cargar la página? checkOnLoad: false, // ¿Deberíamos monitorear las solicitudes AJAX para ayudar a decidir si tenemos una conexión? interceptRequests: true, // ¿Deberíamos volver a realizar la prueba automáticamente periódicamente cuando la conexión esté inactiva (configúrelo en false para deshabilitarlo). reconnect: { // ¿Cuántos segundos debemos esperar antes de volver a verificar? inicialDelay: 3, // ¿Cuánto tiempo debemos esperar entre reintentos? retraso: (1.5 * último retraso, limitado a 1 hora) }, // ¿Deberíamos almacenar e intentar rehacer las solicitudes que fallan mientras la conexión está inactiva? solicitudes: verdadero, // ¿Deberíamos mostrar un juego de serpientes mientras la conexión está inactiva para mantener al usuario entretenido? // No está incluido en la compilación normal, debes incorporar js/snake.js además de // offline.min.js. juego: falso}
Offline.check()
: comprueba el estado actual de la conexión.
Offline.state
: El estado actual de la conexión 'arriba' o 'abajo'
Offline.on(event, handler, context)
: vincula un evento. Eventos:
arriba: La conexión ha pasado de abajo a arriba
down: La conexión ha pasado de arriba a abajo
confirmado: una prueba de conexión ha sido exitosa, activada incluso si la conexión ya estaba activa
confirmado inactivo: una prueba de conexión falló, se disparó incluso si la conexión ya estaba inactiva
comprobando: Estamos probando la conexión
reconnect:started: Estamos comenzando el proceso de reconexión
reconnect:stopped: Hemos terminado de intentar reconectarnos
reconnect:tick: se activa cada segundo durante un intento de reconexión, cuando no se realiza una verificación
reconnect:connecting: Nos estamos reconectando ahora
reconnect:failure: falló un intento de verificación de reconexión
request:flush: Se han rehecho todas las solicitudes pendientes
request:capture: se está reteniendo una nueva solicitud
Offline.off(event, handler)
: desvincular un evento
De forma predeterminada, Offline realiza una solicitud XHR para cargar su /favicon.ico
para verificar la conexión. Si no tiene dicho archivo, aparecerá 404 en la consola, pero por lo demás funcionará bien (incluso un 404 significa que la conexión está activa). Puede cambiar la URL a la que llega (un punto final que responda con un 204 rápido es perfecto):
Offline.options = {verificaciones: {xhr: {url: '/connection-test'}}};
Asegúrese de que la URL que verifique tenga el mismo origen que su página (el método de conexión, el dominio y el puerto deben ser iguales), o tendrá problemas con CORS. Puede agregar encabezados Access-Control
al punto final para solucionarlo en los navegadores modernos, pero aún causará problemas en IE9 y versiones inferiores.
Si desea ejecutar pruebas en un dominio diferente, pruebe el método de la imagen. Carga una imagen, que puede cruzar dominios.
Offline.options = {verificaciones: {imagen: {url: 'mi-imagen.gif'}, activo: 'imagen'}}
La única advertencia es que con el método de la imagen, no podemos distinguir un 404 de un problema de conexión genuino, por lo que cualquier error aparecerá en Offline como un problema de conexión.
Sin conexión también incluye una verificación llamada 'up'
y otra llamada 'down'
que siempre informará que está arriba o abajo respectivamente para realizar pruebas. Puede activarlos configurando la opción active
, agregando un atributo de datos a su etiqueta de secuencia de comandos con el nombre data-simulate
y el valor 'up'
o 'down'
, o configurando localStorage.OFFLINE_SIMULATE
en 'up'
o 'down'
.
El módulo de reconexión vuelve a probar automáticamente la conexión periódicamente cuando está inactivo. Una solicitud AJAX exitosa también activará una nueva verificación silenciosa (si interceptRequests
no es falso).
Puede desactivar el módulo de reconexión configurando la reconnect
en falso. La reconexión se puede configurar configurando opciones en la configuración de reconexión.
El módulo de solicitudes contiene todas las solicitudes AJAX fallidas y, después de deduplicarlas, las rehace cuando se restablece la conexión.
Puede desactivarlo configurando la configuración requests
en falso.
También puede configurar deDupBody como verdadero si desea que la deduplicación también tenga en cuenta el contenido de la solicitud.
¡Ninguno!
Chrome, Firefox, Safari e IE8+ modernos
Tenga en cuenta que no todos los navegadores (incluidos Safari y el antiguo IE) admiten eventos fuera de línea, lo que obliga a Offline a utilizar métodos de detección menos precisos.