Commentaire: Ouvrez une page Web et après le chargement, si le réseau est soudainement déconnecté, la page disparaîtra après avoir actualisé. Comment pouvez-vous empêcher cette situation de se produire? L'émergence de HTML5 nous a soudainement éclairés, et nous l'expliquerons en détail pour vous
Ouvrez une page Web, et après le chargement, si le réseau est soudainement déconnecté, la page aura disparu après votre actualisation.Avez-vous déjà pensé qu'après avoir rafraîchi la page, vous serez toujours la page tout à l'heure, ouvrez une autre page dans une nouvelle fenêtre, entrez la même URL et ouvrez la page si elle est hors du réseau. . Les applications hors ligne HTML5 fournissent une telle fonctionnalité.
Lorsque les données de la page sont chargées, vous pouvez définir certaines images, Flash, CSS, JS, HTML et d'autres fichiers à mettre en cache par vous-même. Lorsque les données de la page ne sont pas connectées à Internet la prochaine fois, vous pouvez utiliser ces fichiers mis en cache. Il s'agit de l'application hors ligne de HTML5.
En fait, il est très simple à mettre en œuvre.
Un serveur est requis. Ici, nous utilisons le serveur Tomcat pour expliquer.
Tout d'abord, configurez le type de mine du fichier avec le suffixe .Manifest sur texte / cache-manifest.
Lorsque vous parlez de la configuration de Tomcat, des amis familiers penseront naturellement au fichier web.xml. Oui, ajoutez simplement la configuration suivante au fichier:
<MIME-MOPP>
<ralled> manifeste </pulsex>
<Mime-Type> Texte / Cache-Manifest </ MIME-TYPE>
</ MIME-MOPP>
Ensuite, écrivez un fichier xxx.manifest, xxx est un nom que vous avez choisi vous-même. Le format de ce fichier est le suivant:
Manifeste du cache
#version 1.5
Cache:
Mytest.html
Css / main.css
Javascript / bwh5ls.js
Exp-Calif-Logo.gif
La première ligne est requise, qui identifie qu'il s'agit du fichier de configuration pour manifester.
#version 1.5
Cette phrase est un commentaire et n'a aucun effet pratique. Je veux juste que le navigateur mette à jour le fichier de cache ici. Parce que lorsque le fichier manifeste est le même qu'auparavant, le navigateur ne rechargera pas le fichier de cache, nous pouvons donc utiliser ce commentaire pour modifier le numéro de version d'une part et laisser le navigateur mettre à jour le cache d'autre part.
Cache:
Cette ligne indique que le fichier suivant doit être mis en cache. Dans l'exemple, la page actuelle: mytest.html, ainsi que certains fichiers et images CSS et JS sont mis en cache.
Il existe plusieurs mots clés non mentionnés dans les exemples, c'est-à-dire
RÉSEAU:
RETOMBER:
Le réseau fait référence à une page qui ne veut pas se cacher; Fallback fait référence à une alternative lorsque le fichier demandé n'est pas trouvé ou que le serveur du fichier ne répond pas. Par exemple, nous voulons demander une page imbriquée, mais le serveur de cette page ne peut pas se connecter, donc je peux passer à une autre page spécifiée.
Il s'agit de la deuxième étape et de la troisième étape. Ajoutez simplement la position manifeste à la balise <html>:
<html manifest = name.manifest>
À ce stade, vous pouvez réaliser des applications hors ligne simples.
Où sont placés ces fichiers mis en cache?
Testé sur Chrome, j'ai constaté qu'il avait enregistré ces fichiers en morceaux en fonction de son propre mécanisme, donc je n'ai pas pu trouver le fichier complet. Les données enregistrées sont:
Je ne sais pas comment l'enregistrer en c: / utilisateurs / jasonling / appdata / local / google / chrome / utilisateur / user / défaut.
Les fichiers sur Firefox sont également stockés en fonction de leur propre mécanisme, mais après les avoir ouverts avec SQLite, j'ai trouvé les informations spécifiques du fichier mis en cache:
Si les lecteurs sont intéressés, ils peuvent essayer eux-mêmes pour voir s'il y aura de nouvelles découvertes.