Introduktion til HTTP-cache
Jeg er sikker på, at du har bemærket, at når du åbner et websted for første gang, tager det nogen tid at indlæse. Når du åbner det igen efter et stykke tid, kører webstedet meget hurtigere. Forestil dig, at hvis et websted tog det samme tid at indlæse hver gang, hvor langsom browsing ville føles. Det er alt sammen takket være en fin idé kaldet HTTP-cache. Lad os se på, hvad det er, hvordan det fungerer, og hvordan det bruges til at gøre internetbrowsing til en hurtigere oplevelse.
Hvad er HTTP-cache?
HTTP-cache er ideen om at gemme nogle ofte eller ofte anvendte data et sted, der er hurtig adgang til. Med dette er der en meget god chance for, at de mest nødvendige data kan fås adgang meget hurtigere, fordi computeren ikke behøver at nå for langt for at få dem.
I tilfælde af webbrowsing overvejes cache, når din webbrowser som Chrome gemmer en kopi af et websted eller en web-app på det lokale lager. Når et websted er cache, behøver en webbrowser ikke at downloade alle dataene fra serveren, og det vil gøre browsing meget hurtigere.
Når en CSS-fil på et websted f.eks. Er downloadet, behøver en browser ikke at downloade den for hver side af sessionen. Det samme kan siges for mange JavaScript-filer, billeder (såsom webstedets logo og ikoner for sociale medier) og endda noget dynamisk indhold. Cache er aktiveret ved hjælp af Cache-overskrifter.
Cacheoverskrifter i HTTP
HTTP-cache har to hovedcache-overskrifter, den første kaldes “Cache-Control” og den anden kaldes “Expire”. Lad os se på begge:
Cache-Control
Du kan betragte Cache-Control som en switch til at slå cachen til i brugerbrowser. Når dette header er tilføjet, muliggør det cache til alle understøttede webbrowsere. Hvis denne header ikke er til stede, vil ingen browser gemme en cache for websidens indhold, selvom det understøtter cache.
Cache-kontrollen har to typer privatlivsindstillinger, den første er offentlig og den anden er privat.
I tilfælde af Offentlig kan ressourcerne cachelagres af en hvilken som helst mellemproxy, f.eks. Content Delivery Networks (CDN).
En Cache-Control-header med privat respons fortæller browseren, at cachen kun vil blive udført for en enkelt bruger og ikke for nogen mellemliggende proxy.
Værdien "max-age" i Cache-Control-overskriften indstiller det tidspunkt, indholdet skal cache til. Denne tid er i sekunder.
Cache-Control:public, max-age=31536000
udløber
Udløbsoverskriften bruges, når cache-kontrol findes i koden. Dette er en simpel HTTP-cachehoved, der indstiller en dato, fra hvilken enhver cache-ressource betragtes som ugyldig. Når cachen er udløbet, og brugeren indlæser webstedet, vil en webbrowser blot anmode om alt indhold på siden igen.
Betingede anmodninger
Ovenfor diskuterede headere fortæl simpelthen browseren, hvornår data skal hentes fra webserveren. Betingede anmodninger fortæller på den anden side browseren, hvordan man henter den. Betingede anmodninger fortæller en browser, hvordan den kan spørge serveren, om kopien af data i cachen er forældet.
I denne proces sender browseren nogle data om ressourcer, den har cache, i sin hukommelse, og efter at have læst disse data, bestemmer serveren, om dataene er forældede eller ej.
Tidsbaserede anmodninger
I tidsbaserede anmodninger kontrolleres det, om den anmodede ressource blev ændret på serveren eller ej. Hvis den cachelagrede kopi i browseren er den seneste, returnerer serveren kode 304.
For at indstille betingelsesanmodning på tidsbasis, kan du bruge "Sidst ændret" i svarhovedet.
Cache-Control:public, max-age=25998579
Last-Modified: Fri, 08 Jul 2018 15:25:00 GMT
Indholdsbaserede
I indholdsbaserede anmodninger kontrolleres MD5 Hash (eller enhver anden bæredygtig mulighed) for både serverkopiering og cache-kopi. Dette fortæller, om dataene er ens eller ikke, i tilfælde af, at dataene er forskellige, vil MD5-kontrolsummet ikke matche, og serveren sender en ny kopi af ressourcer.
Dette gøres via “ETag” i overskriften. Værdien af det er fordøjelsen af ressourcer.
Cache-Control:public, max-age=25998579
ETag: "496d7131f15f0fff99ed5aae”
Sigtbarhed
Næsten alle moderne browsere inkluderer nogle udviklingsrelaterede værktøjer, der giver dig mulighed for at kontrollere ressourcer, kildekode og andre aspekter af en webside. Blandt dem kan du finde et værktøj til at se de overskrifter, der returneres af ethvert program.
For at se disse overskrifter på Google Chrome kan du højreklikke på et hvilket som helst tomt område på en webside og klikke på "Inspekter" eller trykke på CTRL + SHIFT + I for at åbne DevTools. I dette værktøj skal du klikke på fanen Netværk og trykke på CRTL + R for at genindlæse for at se alle overskrifter på siden.
Brug sager i HTTP-cache
Herunder er nogle anvendelsestilfælde af HTTP-cache, som er som følger:
Til statiske aktiver
For statiske aktiver på en side, såsom billeder, JS-filer og eventuelle CSS-filer, kan du vælge at cache indholdet aggressivt. At ikke skulle indlæse disse filer vil resultere i imponerende ydelsesforbedring. I dette tilfælde skal du gå til Cache-Control Header med en maksimal aldersværdi på mere end en måned eller endda et år.
Cache-Control:public; max-age=31536000
Til dynamisk indhold
I tilfælde af dynamisk indhold på en side, bliver du nødt til at tænke dig selv for, hvilke filer skal browseren cache og hvor længe. Hvis indholdet ofte ændres, skal du sørge for, at den tidsvarighed, du vælger til cache, ikke medfører problemer for brugeren.
Cache af privat indhold
Som vi diskuterede i afsnittet Cache-Control, i tilfælde af, at indholdet på siden er privat, kan du forhindre, at den cache af mellemliggende proxier, såsom CDN'er, ved at tilføje “Cache-Control: private” i overskriften.
En anden sikrere tilgang er overhovedet ikke at cache noget privat indhold.
Implementering af HTTP-cache
Nu hvor du ved, hvad HTTP-cache er, og hvordan det fungerer, lad os se på, hvordan du kan implementere det på dit websted. Implementering af HTTP-cache er en smule anderledes for forskellige servertyper. Lad os i vores tilfælde se på implementering af cache via .htaccess-filen.
For at aktivere cachen på webstedet kan du tilføje overskrifterne i .htaccess-filen på din server for eksempel:
FilesMatch "\.(ico|pdf|flv|jpg.webp|jpeg.webp|png|gif|js|css|swf)$"
Header set Cache-Control "max-age=31536000, public"
/FilesMatch
Ovenstående cacheer alle til, pdf, flv, jpg.webp og andre nævnte formater nævnt i "File Match" i et år.
Konklusion
HTTP-cache er et af de vigtigste tricks, der gør browsing på dit websted til en hurtigere oplevelse for dine besøgende, og nu hvor du kan se, hvordan det fungerer, kan du implementere det på dine websteder og web-apps for at gøre dem hurtigere for dine brugere og til at gemme din serverbåndbredde.
Anbefalede artikler
Dette har været en guide til HTTP-cache. Her diskuterede vi implementering, betingede anmodninger, cachehoved og Brug af HTTP-tilfælde. Du kan også gennemgå vores andre foreslåede artikler for at lære mere -
- Lær, hvad der er HTML
- Sådan installeres Github?
- Hvad er MapReduce i Hadoop?
- Begyndervejledning til nodekommandoer
- HTTP-cookies | Sikkerhed