Comentario: Abra una página web y después de cargar, si la red se desconecta repentinamente, la página desaparecerá después de actualizar. ¿Cómo puedes evitar que suceda esta situación? La aparición de html5 nos hizo iluminar de repente, y lo explicaremos en detalle a continuación.
Abra una página web y después de cargar, si la red se desconecta repentinamente, la página desaparecerá después de que se actualice.¿Alguna vez ha pensado que después de actualizar la página, seguirá siendo la página en este momento, abrirá otra página en una nueva ventana, ingrese la misma URL y abrirá la página si está fuera de la red. . Las aplicaciones fuera de línea HTML5 proporcionan dicha característica.
Cuando se cargan los datos en la página, puede configurar algunas imágenes, flash, CSS, JS, HTML y otros archivos para almacenar en caché por usted mismo. Cuando los datos en la página no están conectados a Internet la próxima vez, puede usar esos archivos en caché. Esta es la aplicación fuera de línea de HTML5.
De hecho, es muy simple de implementar.
Se requiere un servidor. Aquí usamos el servidor Tomcat para explicar.
Primero, configure el tipo de mina del archivo con el sufijo .Manifest a Text/Cache-manifest.
Cuando se habla de la configuración de Tomcat, los amigos familiares pensarán naturalmente en el archivo web.xml. Sí, solo agregue la siguiente configuración al archivo:
<mime mapping>
<Ttension> Manifest </Extension>
<mime-type> text/cache-manifest </mime-type>
</mime mapping>
Luego escriba un archivo XXX.Manifest, xxx es un nombre que usted eligió. El formato de este archivo es el siguiente:
Manifiesto de caché
#Versión 1.5
CACHE:
Mytest.html
CSS/Main.css
Javascript/bwh5ls.js
exp-calif-logo.gif
Se requiere la primera línea, que identifica que este es el archivo de configuración para Manifest.
#Versión 1.5
Esta oración es un comentario y no tiene ningún efecto práctico. Solo quiero que el navegador actualice el archivo de caché aquí. Porque cuando el archivo manifiesto es el mismo que antes, el navegador no volverá a cargar el archivo de caché, por lo que podemos usar este comentario para modificar el número de versión por un lado, y dejar que el navegador actualice el caché por otro lado.
CACHE:
Esta línea indica que el siguiente archivo debe almacenarse en caché. En el ejemplo, la página actual: mytest.html, así como algunos archivos e imágenes CSS y JS se almacenan en caché.
Hay varias palabras clave no mencionadas en los ejemplos, es decir
RED:
RETROCEDER:
La red se refiere a una página que no quiere almacenar en caché; Fallback se refiere a una alternativa cuando no se encuentra el archivo solicitado o el servidor del archivo no responde. Por ejemplo, queremos solicitar una página anidada, pero el servidor de esta página no puede conectarse, por lo que puedo pasar a otra página especificada.
Este es el segundo paso y el tercer paso. Simplemente agregue la posición de manifiesto a la etiqueta <html>:
<html manifest = name.Manifest>
En este punto, puede realizar aplicaciones simples fuera de línea.
¿Dónde se colocan esos archivos en caché?
Probado en Chrome, descubrí que guardaba estos archivos en fragmentos de acuerdo con su propio mecanismo, por lo que no pude encontrar el archivo completo. Los datos guardados son:
No sé cómo guardarlo en c:/usuarios/jasonling/appdata/local/google/chrome/user data/default.
Los archivos en Firefox también se almacenan de acuerdo con su propio mecanismo, pero después de abrirlos con SQLite, encontré la información específica del archivo en caché:
Si los lectores están interesados, pueden probarlo ellos mismos para ver si habrá nuevos descubrimientos.