NemProgrammering.dk logo
nordicway webhotel

HTML5 og App Cache

HTML5 kursus | Lær at anvende HTML5
WordPress hjemmeside hjælp

Information om denne video

Underviser: Joakim Børlum Petersen, www.Snowhat.dk

I denne danske tutorial omkring HTML5 vil vi kigge nærmere på app cache. Vi vil ikke lave et specifikt eksempel på en applikation der benytter app cache, men i stedet forklare det så uddybende som muligt. Med HTML5 er der blevet introduceret en række nye metoder, hvorpå et websted eller en web-applikation vil kunne fungerer uden en netværksforbindelse. Hvis man f.eks. sidder på en dårlig eller slet ikke eksisterende netværksforbindelse, kan det i mange tilfælde være rart at kunne tilgå dele af hjemmesider eller applikationer uden at være på nettet. Det er lige præcis i sådan en situation at en app cache kan være behjælpelig.

I denne video vil vi se på, hvordan en app cache kan gemme ressourcer(filer, billeder etc. ), der skal bruges af browseren, så en bruger kan få adgang til din hjemmeside, selvom personen er offline.

Applikation cache´en er styret af en almindelig tekstfil kaldet et ”manifest”. Denne fil indeholder en liste over de de ressourcer, der skal opbevares lokalt til brug, når der ikke længere er netværksforbindelse. Listen kan også definere betingelserne for en caching, såsom hvilke sider der aldrig bør være cachet.

Hvis brugeren går offline, men har besøgt web-stedet, mens han var online, vil de cache lagrede ressourcer hentes fra hans egen computer, således at han stadig kan se applikationen eller hjemmesiden i en begrænset form. Ved omhyggeligt at overveje indholdet af din manifest-fil, kan du derfor nemt tilbyde en passende web-oplevelse til brugere der måske sidder offline.

Herunder finder du koderne der bliver lavet i videoen - Kopier dem gerne!

Video tags:

Denne video relaterer til emner såsom: HTML5 kursus, HTML5 guide, Gratis HTML5 undervisning, HTML5 video tutorials på dansk, HTML5 introduktion, muligheder med HTML5, HTML5 - den nye standard

Her har du kildekoden

     
<!DOCTYPE html>

<html manifest="test.appcache">

<head>

    <title>App-cache</title>

</head>

<body>

    <p>Hej!</p>

</body>

</html>

<!-- app cache filen -->


CACHE MANIFEST
#0010
index.htm
style.css
js/script.js

FALLBACK
/images/large /images/offline.png


NETWORK
login.php
        

Spørgsmål og kommentarer

Har du spørgsmål eller kommentarer? Så skriv herunder og vi eller en anden lœser vil svare hurtigst muligt!

Url´er bliver automatisk omdannet til links (nofollow).

kommentar på NemProgrammering.dk - lav din egen hjemmeside
Amet    02-07-2012

Ja helt enig med Scootergrisen, bare lige klip 20secs inde i slutningen hvori man lige ser de 3 eksempler virker...


kommentar på NemProgrammering.dk - lav din egen hjemmeside
scootergrisen    29-06-2012

Kunne godt have tænkt mig og set et eksempel hvor man ser at det virker selvom man ikke har internet forbindelse.