offline
Add Turkish + miscellaneous fixups
Ce projet n'est pas activement maintenu.
Note aux utilisateurs antérieurs à la version 0.6.0 : Hors ligne utilisait auparavant un fichier hébergé sur Cloudfront comme l'une de ses méthodes de détection de l'état de la connexion. Cette méthode est désormais obsolète et l'image a été supprimée. Veuillez passer à la version 0.7.0+ hors ligne.
Améliorez l'expérience de votre application lorsque vos utilisateurs perdent la connexion.
Surveille les requêtes ajax à la recherche d'échecs
Confirme l'état de la connexion en demandant une image ou une fausse ressource
Récupère automatiquement les requêtes ajax effectuées lorsque la connexion est interrompue et les refait une fois la connexion rétablie.
Interface utilisateur simple avec de beaux thèmes
3 Ko minifiés et compressés
Incluez le javascript, l'un des thèmes et l'une des langues de votre site. Vous avez terminé !
Pour utiliser uniquement l'API JavaScript sans indicateur d'interface utilisateur, omettez simplement le fichier CSS.
Si vous souhaitez avoir un aperçu de l'apparence de votre site, déconnectez votre connexion Internet ou essayez le simulateur.
En option, vous pouvez fournir une configuration en définissant Offline.options après avoir introduit le script.
Options (n'importe laquelle peut être fournie en fonction), avec leurs valeurs par défaut :
{ // Devons-nous vérifier l'état de la connexion immédiatement au chargement de la page. checkOnLoad : false, // Devrions-nous surveiller les requêtes AJAX pour nous aider à décider si nous avons une connexion. interceptRequests : true, // Devrions-nous retester automatiquement périodiquement lorsque la connexion est interrompue (définir sur false pour désactiver). reconnect : { // Combien de secondes devons-nous attendre avant de revérifier. initialDelay : 3, // Combien de temps devons-nous attendre entre les tentatives. delay : (1,5 * dernier délai, plafonné à 1 heure) }, // Devrions-nous stocker et tenter de refaire les requêtes qui échouent alors que la connexion est coupée. requêtes : vrai, // Devrions-nous montrer un jeu de serpent pendant que la connexion est interrompue pour divertir l'utilisateur ? // Ce n'est pas inclus dans la version normale, vous devez ajouter js/snake.js en plus de // offline.min.js. jeu : faux} Offline.check() : Vérifiez l'état actuel de la connexion.
Offline.state : L'état actuel de la connexion "up" ou "down"
Offline.on(event, handler, context) : Lier un événement. Événements:
up : La connexion est passée de bas en haut
down : La connexion est passée de haut en bas
confirmé : un test de connexion a réussi, déclenché même si la connexion était déjà établie
confirmé-down : un test de connexion a échoué, déclenché même si la connexion était déjà interrompue
vérification : Nous testons la connexion
reconnect:started : Nous commençons le processus de reconnexion
reconnect:stopped : Nous avons fini d'essayer de nous reconnecter
reconnect:tick : déclenché toutes les secondes lors d'une tentative de reconnexion, lorsqu'aucune vérification n'a lieu
reconnect:connecting : Nous nous reconnectons maintenant
reconnect:failure : une tentative de vérification de reconnexion a échoué
requêtes : flush : toutes les requêtes en attente ont été refaites
requêtes: capture : une nouvelle requête est en attente
Offline.off(event, handler) : Dissocier un événement
Par défaut, Offline effectue une requête XHR pour charger votre /favicon.ico afin de vérifier la connexion. Si vous n'avez pas un tel fichier, il sera 404 dans la console, mais sinon il fonctionnera bien (même un 404 signifie que la connexion est établie). Vous pouvez modifier l'URL qu'il atteint (un point de terminaison qui répondra avec un 204 rapide est parfait) :
Hors ligne.options = {checks : {xhr : {url : '/connection-test'}}} ; Assurez-vous que l'URL que vous vérifiez a la même origine que votre page (la méthode de connexion, le domaine et le port doivent tous être identiques), sinon vous rencontrerez des problèmes CORS. Vous pouvez ajouter des en-têtes Access-Control au point de terminaison pour le corriger sur les navigateurs modernes, mais cela entraînera toujours des problèmes sur IE9 et versions antérieures.
Si vous souhaitez exécuter des tests sur un autre domaine, essayez la méthode image. Il charge une image qui est autorisée à traverser les domaines.
Hors ligne.options = {vérifie : {image : {url : 'my-image.gif'}, actif : 'image'}}Le seul inconvénient est qu'avec la méthode de l'image, nous ne pouvons pas distinguer un 404 d'un véritable problème de connexion, donc toute erreur apparaîtra hors ligne comme un problème de connexion.
Hors ligne comprend également une vérification appelée 'up' et une autre appelée 'down' qui signaleront toujours être respectivement en hausse ou en baisse pour les tests. Vous pouvez les activer en définissant l'option active , en ajoutant un attribut data à votre balise de script avec le nom data-simulate et la valeur 'up' ou 'down' , ou en définissant localStorage.OFFLINE_SIMULATE sur 'up' ou 'down' .
Le module de reconnexion reteste automatiquement la connexion périodiquement lorsqu'elle est en panne. Une requête AJAX réussie déclenchera également une revérification silencieuse (si interceptRequests n'est pas faux).
Vous pouvez désactiver le module de reconnexion en définissant la reconnect sur false. La reconnexion peut être configurée en définissant les options sur le paramètre de reconnexion.
Le module de requêtes conserve toutes les requêtes AJAX ayant échoué et, après les avoir dédupliquées, les refait lorsque la connexion est restaurée.
Vous pouvez le désactiver en définissant le paramètre requests sur false.
Vous pouvez également définir deDupBody sur true si vous souhaitez que la déduplication prenne également en compte le contenu de la requête.
Aucun!
Chrome, Firefox, Safari et IE8+ modernes
Notez que tous les navigateurs (y compris Safari et l'ancien IE) ne prennent pas en charge les événements hors ligne, ce qui oblige Offline à utiliser des méthodes de détection moins précises.
