Commentaire: Aujourd'hui, notre contenu consiste à créer des applications Web hors ligne. L'avantage est qu'il permet au navigateur de télécharger les ressources Web que nous avons spécifiées afin que les utilisateurs puissent utiliser notre site normalement tout en étant hors ligne.
Aujourd'hui, notre contenu consiste à créer des applications Web hors ligne. L'avantage est que le navigateur peut télécharger les ressources Web que nous avons spécifiées afin que les utilisateurs puissent utiliser notre site normalement tout en étant hors ligne.
1. Définir le manifeste
Nous utilisons Manifest pour répertorier les ressources qui doivent être accessibles lorsqu'ils sont hors ligne. C'est lui-même un fichier de type texte. La première ligne est souvent un cache manifeste, puis énumère les ressources dont nous avons besoin, une par ligne. Il n'y a pas de règles de dénomination fixes pour les fichiers, et il n'y a aucune exigence pour les noms de suffixe. La seule exigence consiste à définir les noms de suffixe du côté serveur comme type MIME de texte / cache-manifest.
S'il s'agit d'un serveur IIS 7, suivez les étapes ci-dessous:
1. Par exemple, si le suffixe est .AppCache, ouvrez IIS7 et sélectionnez le nœud racine (cela sera hérité de tous les sites, et peut également être configuré pour un seul site);
2. Double-cliquez sur le type de mime à droite;
3. Cliquez avec le bouton droit pour ajouter le type MIME, afin que la configuration soit terminée.
Une fois la configuration du serveur terminée, ajoutez le fichier manifeste.
Manifeste du cache
manifestefile.html
img / 1.jpg
IMG / 2.JPG
IMG / 3.JPG
Regardons ensuite l'exemple suivant.
<! Doctype html>
<html manifest = "manifest.appcache">
<adal>
<Title> Exemple </TITME>
<style>
IMG
{
Border: moyen double noir;
rembourrage: 5px;
marge: 5px;
}
</ style>
</ head>
<body>
<img src = "img / 1.jpg" />
<div>
<froit> Car1 </fut Button>
<frut-onter> car2 </futton>
<froit> Car3 </futton>
</div>
<cript>
var boutons = document.getElementsByTagName ('bouton');
for (var i = 0; i <Buttons.length; i ++) {
boutons [i] .OnClick = hookbuttonpress;
}
Fonction HandlebuttonPress (e) {
document.getElementById ('imgtarget'). src = 'img /' + e.target.id + '.jpg';
}
</cript>
</docy>
</html>
Lorsque le programme s'exécute, selon le navigateur, certains navigateurs vous demanderont si vous autorisez les données hors ligne à enregistrer localement, et d'autres non. Une telle application hors ligne est créée.
2. Réponses aux doutes
J'ai également rencontré des problèmes et des doutes lors de l'apprentissage de cette partie des connaissances, comme:
1. Pourquoi je fonctionne directement vs2010 (mon environnement de développement) et l'application hors ligne ne s'exécute pas correctement?
2. Comment savoir si l'application hors ligne a été créée avec succès?
3. Comment savoir si l'application actuelle est hors ligne?
4. Après avoir pause le service IIS, il devrait être hors ligne. Pourquoi est-ce que je signale une erreur 404 lorsque je rafraîchis la page?
Maintenant, je vais répondre à ces questions que j'ai rencontrées.
2.1. Expliquez d'abord la première question. En ce qui concerne ce problème, le point clé est de savoir comment la configuration de votre élément de configuration Web de votre application est configurée. Si vous utilisez la forme d'un serveur de développement VS, nous n'avons aucun moyen de définir le type MIME pour cela, donc dans ce cas, notre application hors ligne ne peut pas être utilisée. Pour les deux méthodes de configuration Web restantes, tant que vous suivez la méthode de type MIME que j'ai introduit ci-dessus pour configurer le serveur IIS, votre application hors ligne s'exécutera correctement.
2.2. Le deuxième problème est expliqué ci-dessous. Ici, nous devons utiliser l'outil de débogage du navigateur Chrome, utiliser le navigateur Chrome pour ouvrir notre programme Web, appuyer sur F12 et passer à l'onglet Ressources. Tant que nos informations de configuration sont trouvées sous le cache d'application et que le fichier mis en cache peut être trouvé, il prouve que notre application hors ligne a été créée avec succès.
2.3. Ou utilisez l'outil de débogage de Chrome, ou dans l'onglet Ressources, remarquez que la bobine rouge vit dans le lieu, en ligne signifie en ligne.
Débranchez le câble réseau et affichez hors ligne, ce qui signifie hors ligne. À l'heure actuelle, l'effet de l'application hors ligne peut être affiché.
2.4. En ce qui concerne la dernière question, nous devons toujours utiliser l'outil de débogage du navigateur Chrome. Lorsque nous suscitons le service IIS, nous examinons l'affichage de l'onglet Ressources. Il est toujours en ligne, mais il passe du ralenti à l'obsolète plus tard. Cela explique également pourquoi l'effet hors ligne de l'application hors ligne ne peut pas être affiché lorsque l'IIS local est interrompu.
Ceci est le contenu de cette section.