Cache manifest in HTML5

De cache manifest in HTML5 is een software storage-functie die de mogelijkheid om toegang te krijgen tot een webtoepassing zelfs zonder een netwerkverbinding biedt.

Achtergrond

Webapplicaties bestaan ​​uit webpagina's die moeten worden gedownload van een netwerk. Om dit te realiseren is er een netwerkverbinding moet zijn. Er zijn echter veel gevallen wanneer gebruikers geen verbinding kunnen maken met een netwerk om redenen buiten hun controle. HTML5 biedt de mogelijkheid om toegang te krijgen tot de webapplicatie zelfs zonder een netwerkverbinding via de cache manifest.

Webapplicaties bestaan ​​uit middelen die door de URL. Dit kunnen HTML, CSS, JavaScript, afbeeldingen of een andere bron die nodig is voor een webtoepassing te worden gemaakt. Hun adressen kunnen worden gekopieerd in een manifest bestand, die regelmatig door de auteur van de webapplicatie kunnen worden bijgewerkt, met vermelding van eventuele nieuwe webadressen die worden toegevoegd of verwijderd. Bij het aansluiten op een netwerk voor de eerste keer, zal een webbrowser het manifest bestand HTML5 te lezen, te downloaden van de middelen gegeven en bewaar ze lokaal. Dan, in de afwezigheid van een netwerkverbinding, de webbrowser plaats verschuiven naar de lokale kopieën maken en de webtoepassing offline.

Basics

Om de offline toepassingen om te werken, moet een cache manifest bestand worden gecreëerd door de webontwikkelaar. Als de webapplicatie meer dan één pagina overschrijdt dan elke pagina moet een duidelijke eigenschap die verwijst naar de cache manifest hebben. Elke pagina van verwijzingen het manifest zal lokaal worden opgeslagen. De cache manifest bestand is een tekstbestand in een ander deel van de server. Het moet worden geserveerd met de volgende content type:

De volgende regel moeten worden toegevoegd aan het html element, zodat het manifest bestand cache te werken.

Beschouw het HTML-bestand hieronder. & Lt; html & gt; element geeft een bestand genaamd cache.appcache zal de lijst van middelen die nodig zijn voor deze webpagina om offline te werken bevatten. Gemeenschappelijke namen voor dit bestand zijn cache.manifest en manifest.appcache.

Syntaxis

Hieronder volgt een overzicht van een aantal regels en syntaxis nodig bij het schrijven van het manifest bestand.

Hieronder is een voorbeeld van een cache manifestbestand.

Voorbeeld 1:

Dit manifest bestand bevat drie bronnen: een afbeelding van een PNG-CSS-bestand, een JavaScript-bestand en. Als het bovenstaande bestand is geladen, zal de browser het test.css, test.js en test.png bestanden downloaden van de root directory van de web server. Als gevolg hiervan, wanneer een netwerk is aangesloten, de middelen die beschikbaar zal zijn om ze offline zijn.

Cache manifesten kunnen ook gebruik maken van relatieve paden of zelfs absolute URL's, zoals hieronder weergegeven.

Voorbeeld 2:

File headers

De cache manifest bestand bestaat uit drie sectie headers.

  • Expliciet deel met de header Cache.
  • Online whitelist deel met de header NETWORK.
  • Fallback deel met de header fallback.

Opmerking: Voorbeeld 1 en Voorbeeld 2 hierboven, wijzen niet op een sectie header en worden daarom beschouwd als een expliciet onderdeel standaard.

Online whitelist deel met de header NETWORK

Voorbeeld 3:

Dit voorbeeld bestaat uit headers. De lijn, NETWERK: is het begin van het gedeelte 'online whitelist ". De onder deze rubriek middelen nooit de cache en zijn niet offline beschikbaar. Hierdoor treedt er een fout bij een poging offline wordt gedaan om de bron te laden.

Er is een verschuiving naar de expliciete gedeelte van de header cache: en de middelen die kunnen worden gedownload en offline gebruikt.

Fallback deel met de header fallback

De sectie fallback in een cache manifest bestand kan worden gebruikt om online bronnen die niet kan worden gecached of waren niet succesvol in de cache vervangen.

Voorbeeld 4:

In voorbeeld 4, de fallback deel bestaat uit een enkele lijn. d.w.z. / /offline.html. De single teken vóór 'offline' zal passende URL-patroon op een site. Als de browser de pagina niet kan vinden in de AppCache, zal de applicatie de pagina /offline.html geven.

Gebeurtenisstroom

Evenementen zijn onder de JavaScript-object.

Als de browser bezoekt een webpagina, is nog niet eerder gezien de webpagina en als gevolg daarvan niet het manifest bestand herkent, zal de volgende gebeurtenissen volgen.

  •  Event - treedt op wanneer de browser bezoekt een webpagina en leest het manifest attribuut op de & lt; html & gt; element.
  •  Event - als de browser nooit over dit manifest bestand is vóór, zal het alle middelen die in het manifest bestand te downloaden.
  •  Event - bevat informatie over hoeveel bestanden zijn gedownload en hoeveel bestanden worden overgelaten aan worden gedownload.
  •  Event - optreedt zodra alle bestanden zijn gedownload en het offline webapplicatie is uitgerust om offline worden gebruikt.

Als de browser de webpagina eerder heeft bezocht en erkent het manifest bestand de volgende gebeurtenissen zal volgen.

  •  Evenement - dit zal plaatsvinden als de cache manifest is niet veranderd.
  •  Event - als de cache manifest van de middelen van de bestanden wordt opnieuw gedownload is veranderd.
  •  Event - deze bevat informatie over hoeveel bestanden zijn gedownload en hoeveel bestanden worden overgelaten aan worden gedownload.
  •  Event - na het opnieuw downloaden is voltooid, wordt deze gebeurtenis geactiveerd, wat aangeeft dat de nieuwe offline versie is klaar voor gebruik.

Wanneer een fout optreedt in ieder geval in de bovenstaande gebeurtenissen, zal de browser een fout gebeurtenis te activeren en het proces te stoppen. Hieronder zijn enkele fouten die kunnen optreden bij het opnieuw gedownload middelen.

  • Pagina niet gevonden of de pagina Permanent Gone.
  • Verzuim om de HTML-pagina die wees op het manifest te downloaden.
  • De cache manifest veranderd terwijl de update heeft plaatsgevonden.
  • De cache manifest werd veranderd, maar de browser heeft een bron in het manifest niet downloaden.
(0)
(0)
Commentaren - 0
Geen commentaar

Voeg een reactie

smile smile smile smile smile smile smile smile
smile smile smile smile smile smile smile smile
smile smile smile smile smile smile smile smile
smile smile smile smile
Tekens over: 3000
captcha