X-Frame-Options: mitä otsake tekee ja miten määrität sen oikein

X-Frame-Options on HTTP-vastausotsake, joka kertoo selaimelle, saako sivusi näyttää toisen sivuston framen tai iframen sisällä. Sillä on täsmälleen kaksi kelvollista arvoa: DENY (ei upotusta lainkaan) ja SAMEORIGIN (upotus sallitaan vain samasta originista). Otsakkeen tarkoitus on estää clickjacking eli klikkauskaappaus, hyökkäys jossa sivustosi ladataan näkymättömänä hyökkääjän sivulle ja kävijät huijataan klikkaamaan asioita, joita he eivät näe. Moderni korvaaja on Content-Security-Policyn direktiivi frame-ancestors, ja vuoden 2026 paras käytäntö on lähettää molemmat otsakkeet. Tämä opas näyttää oikean määrityksen kaikille yleisimmille palvelimille sekä virheet, jotka kytkevät suojan pois hiljaa.

Mitä X-Frame-Options tekee

Kun selain lataa sivun, jonka toinen dokumentti on upottanut elementillä <iframe>, <frame>, <embed> tai <object>, se tarkistaa upotetun sivun vastausotsakkeet ennen piirtämistä. Jos vastauksessa on X-Frame-Options: DENY, selain kieltäytyy näyttämästä sivua upottavan dokumentin sisällä. Arvolla SAMEORIGIN sivu näytetään vain, jos koko upotusketju tulee samasta originista (sama protokolla, palvelin ja portti). Modernit selaimet arvioivat koko yläkehysten ketjun, eivät vain ylintä ikkunaa.

Otsake virallistettiin RFC 7034:ssä lokakuussa 2013, kun selaimet olivat jo ottaneet sen käyttöön. Se on edelleen yksi verkon yleisimmistä tietoturvaotsakkeista: HTTP Archiven Web Almanac 2025:n tietoturvaluku mittaa X-Frame-Optionsin noin 35 %:lla mobiilisivustoista, mikä nostaa sen kolmen yleisimmän tietoturvaotsakkeen joukkoon heti X-Content-Type-Optionsin (lähes 50 %) jälkeen.

Klikkauskaappaus 60 sekunnissa

Termin clickjacking loivat tietoturvatutkijat Robert Hansen ja Jeremiah Grossman vuonna 2008. Hyökkäys on yksinkertainen: hyökkääjän sivu lataa sivustosi iframeen, tekee siitä CSS:llä täysin läpinäkyvän ja asettaa sen harmittomilta näyttävien painikkeiden päälle. Kävijä luulee klikkaavansa "Toista video", mutta klikkaus osuu oikeasti sivustosi painikkeeseen "Poista tili", "Vahvista maksu" tai "Valtuuta sovellus", uhrin kirjautuneella istunnolla. OWASP dokumentoi muunnelmia Facebookin "likejackingista" kaapattuihin yhden klikkauksen ostoihin.

Puolustus on upotuksen hallinta. Jos selain kieltäytyy piirtämästä sivuasi hyökkääjän kehykseen, koko päällekkäisyystemppu romahtaa.

Kaksi kelvollista arvoa, ja ne, joita kannattaa välttää

Vaarallista on tapa, jolla selaimet käsittelevät virheellisiä arvoja: ne ohittavat koko otsakkeen. Sivusto, joka lähettää arvon ALLOW-FROM tai ALLOWALL, luulee olevansa suojattu, vaikka selaimet kohtelevat sitä kuin otsaketta ei olisi lainkaan. Kuten Web Almanac 2025 toteaa, nämä arvot on todennäköisesti asettanut kehittäjä, joka odotti suojan olevan päällä pelkän otsakkeen olemassaolon vuoksi.

Mitä todellinen data kertoo

HTTP Archiven vuonna 2025 mittaamien miljoonien sivustojen joukossa otsakkeen arvot jakautuvat näin:

Lähde: HTTP Archive Web Almanac 2025, tietoturvaluku, kuva 9.30 (mobiilidata).

Noin 72,1 % otsaketta lähettävistä sivustoista valitsee arvon SAMEORIGIN ja 24,6 % arvon DENY. Noin 3 % lähettää arvoja, jotka eivät tee mitään, mikä verkon mittakaavassa tarkoittaa satojatuhansia sivustoja kuvitellulla suojalla. Sen tarkistaminen, mitä palvelimesi oikeasti lähettää, vie alle minuutin.

X-Frame-Options vastaan CSP frame-ancestors

W3C:n Content Security Policy Level 2 -määrittely (W3C-suositus joulukuusta 2016) toi direktiivin frame-ancestors ja teki X-Frame-Optionsista virallisesti vanhentuneen. Siinä missä XFO on karkea on/off-kytkin, frame-ancestors on täysimittainen sallittujen lista:

Kaksi tietämisen arvoista yksityiskohtaa. Ensinnäkin MDN huomauttaa, ettei frame-ancestors peri arvoa default-src-direktiivistä: politiikka default-src 'none' sallii silti kenen tahansa upottaa sivun, joten direktiivi on määriteltävä erikseen. Toiseksi kaikki Chromen, Edgen, Firefoxin ja Safarin nykyversiot tukevat frame-ancestors-direktiiviä, joten ainoa syy lähettää yhä X-Frame-Options on syvyyssuuntainen puolustus hyvin vanhoille asiakasohjelmille. Se maksaa yhden rivin, joten pidä se.

Näin määrität otsakkeen palvelimellasi

Lähetä otsake jokaisessa HTML-vastauksessa, täsmälleen kerran. Alla olevat esimerkit asettavat arvon SAMEORIGIN sekä vastaavan CSP-direktiivin.

nginx (server- tai location-lohkossa):

add_header X-Frame-Options "SAMEORIGIN" always;
add_header Content-Security-Policy "frame-ancestors 'self';" always;

Apache 2.4 (httpd.conf tai .htaccess, mod_headers käytössä):

Header always set X-Frame-Options "SAMEORIGIN"
Header always set Content-Security-Policy "frame-ancestors 'self';"

IIS (web.config):

<system.webServer>
  <httpProtocol>
    <customHeaders>
      <add name="X-Frame-Options" value="SAMEORIGIN" />
      <add name="Content-Security-Policy" value="frame-ancestors 'self';" />
    </customHeaders>
  </httpProtocol>
</system.webServer>

Node.js, Express ja Helmet:

const helmet = require("helmet");
app.use(helmet.frameguard({ action: "sameorigin" }));
app.use(helmet.contentSecurityPolicy({
  directives: { frameAncestors: ["'self'"] }
}));

Cloudflaren kaltaisen CDN:n takana voit lisätä molemmat otsakkeet myös response header -muunnossäännöllä, mikä on kätevää kun et pääse käsiksi alkuperäpalvelimeen. Jos kumppanisivuston pitää oikeutetusti upottaa sivusi, jätä XFO arvoon SAMEORIGIN ja ilmaise sallittujen lista CSP:ssä: frame-ancestors 'self' https://kumppani.esimerkki.fi.

Virheet, jotka kytkevät suojan pois hiljaa

• ALLOW-FROM-arvon käyttö vuonna 2026. Kaikki nykyselaimet ohittavat sen, ja samalla koko otsakkeen.
• Otsakkeen asettaminen meta-tagiin. X-Frame-Options toimii vain oikeana HTTP-otsakkeena, ja frame-ancestors on nimenomaisesti kielletty <meta http-equiv="Content-Security-Policy">-tagissa. Molempien on tultava palvelimelta.
• Otsakkeen lähettäminen kahdesti. Kaksoiskappaleet tai pilkulla yhdistetyt arvot kuten SAMEORIGIN, SAMEORIGIN (0,28 % sivustoista Almanac 2025:ssä) voidaan hylätä virheellisinä. Aseta otsake yhdessä paikassa, joko sovelluksessa tai verkkopalvelimessa, ei molemmissa.
• DENY sivuilla, jotka upotat itse. Jos oma kassasi, widgetisi tai esikatselusi pyörii iframessa, DENY rikkoo sen. Käytä arvoa SAMEORIGIN tai nimenomaista frame-ancestors-listaa.
• Oletus, että default-src kattaa upotuksen. Ei kata. Määrittele frame-ancestors erikseen.

Näin testaat määrityksesi

Avaa selaimen kehittäjätyökalut, lataa sivusi ja tarkastele päädokumentin vastausotsakkeita: sinun pitäisi nähdä täsmälleen yksi X-Frame-Options ja Content-Security-Policy, joka sisältää frame-ancestors-direktiivin. Kokonaiskuvan saat ilmaisella FortifyNet-skannauksella, joka tarkistaa upotussuojasi yhdessä muiden tietoturvaotsakkeiden, SSL/TLS:n, DNS:n ja sähköpostitodennuksen kanssa noin 60 sekunnissa ja kertoo täsmälleen, mikä otsake pitää lisätä ja minne. Ilman rekisteröitymistä.

Aiheeseen liittyvät oppaat

• HTTP-tietoturvaotsakkeet: täydellinen opas
• Mikä on HSTS? HTTP Strict Transport Security selitettynä
• Verkkosivuston tietoturvan tarkistuslista: 12 tärkeää vaihetta

Usein kysytyt kysymykset

Onko X-Frame-Options vanhentunut? Muodollisesti kyllä: W3C:n CSP Level 2 teki siitä vanhentuneen frame-ancestors-direktiivin hyväksi jo 2016. Käytännössä kaikki selaimet kunnioittavat sitä edelleen, ja OWASP suosittelee molempien otsakkeiden lähettämistä syvyyssuuntaisena puolustuksena. Ainoa asia jota et saa tehdä on luottaa ALLOW-FROM-arvoon.

Kumpi valita, DENY vai SAMEORIGIN? Valitse DENY, jos mitään sivustoltasi ei koskaan näytetä kehyksessä, se on vahvin asetus. Valitse SAMEORIGIN, jos omat sivusi upottavat toisiaan, esimerkiksi hallintapaneelit, esikatselut tai sisäiset widgetit. Web Almanac 2025:n datassa 72,1 % sivustoista valitsee SAMEORIGINin.

Miten sallin tietyn kumppanisivuston upottaa sivujani? X-Frame-Options ei enää pysty siihen. Käytä määritystä Content-Security-Policy: frame-ancestors 'self' https://kumppani.esimerkki.fi ja listaa jokainen sallittu origin erikseen.

Mitä tapahtuu, jos lähetän sekä X-Frame-Optionsin että frame-ancestorsin? CSP Level 2:ta tukevat selaimet, eli kaikki modernit, noudattavat frame-ancestors-direktiiviä ja ohittavat X-Frame-Optionsin. Vanhemmat asiakasohjelmat turvautuvat X-Frame-Optionsiin. Juuri tämä varamenettelyketju on syy siihen, että molempia suositellaan.

Voinko asettaa X-Frame-Optionsin meta-tagilla? Et. Selaimet kunnioittavat sitä vain oikeana HTTP-vastausotsakkeena. Jos et pääse palvelimen asetuksiin, aseta se hosting-paneelista, CDN-säännöillä tai sovelluksen middlewaressa.