Vad är en iframe?

En iframe (inline frame) är ett standard-HTML-element, <iframe>, som laddar ett separat webbdokument inuti ett rektangulärt område på den aktuella sidan. YouTubes videospelare levereras på det har sättet: den omgivande sidan förblir din, medan det inramade området kör YouTubes egen spelarkod.

Varför YouTube använder en iframe

Eftersom spelaren kors i sin egen ram är den isolerad från resten av sidan av säkerhetsskäl, får automatiska uppdateringar från YouTube utan att den inbäddande webbplatsen ändrar något, och kan bytas mellan standarddomänen youtube.com och den integritetsvänliga youtube-nocookie.com genom att bara andra kall-URL:en.

Vanliga iframe-attribut för videoinbäddningar

De mest relevanta är src (inbaddnings-URL:en och dess parametrar), title (för skärmläsare), allow (vilka behörigheter ramen får, som autoplay eller fullscreen), allowfullscreen och loading=”lazy” för prestanda.

Hur en iframe passar in i resten av en webbsida

En webbsida är normalt ett sammanhängande HTML-dokument, men en iframe skapar en gräns: allt inuti den är ett separat dokument, med egna skript, stilar och navigeringskontext, renderat inuti en ruta du positionerar med vanlig CSS. Denna isolering är lika mycket en säkerhetsfunktion som en teknisk. En sida som bäddar in en YouTube-iframe kan inte direkt läsa eller andra vad som händer inuti YouTube-spelaren, och spelaren kan inte direkt läsa eller andra resten av din sida.

Ett praktiskt exempel

Skillnaden mellan en iframe och att bara länka till en sida är omedelbart synlig om du jämför de två sida vid sida. En länk, <a href="https://youtube.com/watch?v=ID">Se på YouTube</a>, tar en besökare helt bort från din sida. En iframe, <iframe src="https://www.youtube-nocookie.com/embed/ID"></iframe>, håller besökaren kvar på din sida samtidigt som YouTubes spelare visas inuti ett definierat område. Src-attributet gör mycket olika jobb i vart fall: navigeringsmål jämfört med inbäddad dokumentkälla.

Iframe jämfört med andra inbäddningstekniker

Iframes är inte det enda sättet att föra in extern innehåll, men de är standardsättet för en fullt interaktiv tredjepartsapplikation som en videospelare. Alternativ som att bädda in en statisk bild eller ett länkförhandsvisningskort visar mycket mindre: de kan inte erbjuda uppspelningskontroller, kan inte strömma videodata och kan inte reagera på anvandarinteraktion på samma sätt som en iframe-baserad spelare gör. Se inbäddningskod för hur en iframe paketeras i den HTML du faktiskt klistrar in på en sida.

Säkerhet och behörigheter för iframe

Moderna webbläsare behandlar varje iframe som en separat säkerhetskontext, vilket betyder att skript inuti det inbäddade dokumentet inte kan läsa den överordnade sidans kakor eller lokala lagring utan uttryckligt tillstånd, och vice versa. Attributet sandbox låter dig dessutom begränsa vad en iframe får göra, men för en standard YouTube-spelare behövs detta sällan eftersom spelaren redan kors i en kontrollerad Google-miljo.

Prestanda vid flera iframes på en sida

Varje iframe på en sida skapar en separat webbläsningskontext med sin egen uppsättning resurser, vilket betyder att en sida med flera inbäddade videor kan använda märkbart mer minne och beräkningskraft an en sida utan dem. Därför är låt inläsning och att begränsa antalet samtidigt laddade spelare särskilt viktiga på sidor med många inbäddningar, som produktrecensioner eller videogallerier.

Vanliga frågor