X-Frame-Options 回應標頭

Note: CSP Level 2 的 frame-ancestors 指令標準雖然已經取代了非標準的 X-Frame-Options,而自 Gecko 4.0 起也開始支援  frame-ancestors 指令,但因為並非所有瀏覽器都支援 frame-ancestors,所以 支援度較廣的 X-Frame-Options 還是可以和  CSP 一起採用。

X-Frame-Options HTTP 回應標頭 (header) 用來指示文件是否能夠載入 <frame>, <iframe> 以及 <object>,網站可以利用 X-Frame-Options 來確保本身內容不會遭惡意嵌入道其他網站、避免 clickjacking 攻擊

使用 X-Frame-Options

共有三種值:

DENY
表示文件無論如何都不能被嵌入到 frame 中,即使是自家網站也不行。
SAMEORIGIN
唯有當符合同源政策下,才能被嵌入到 frame 中。
ALLOW-FROM uri
唯有列表許可的 URI 才能嵌入到 frame 中。

設定 Apache

請加入以下指令到網站組態設定檔

Header always append X-Frame-Options SAMEORIGIN

設定 nginx

請加入以下指令到 http, server 或 location 組態設定檔:

add_header X-Frame-Options SAMEORIGIN;

設定 IIS

請加入以下指令到網站的 Web.config 檔:

<system.webServer>
  ...

  <httpProtocol>
    <customHeaders>
      <add name="X-Frame-Options" value="SAMEORIGIN" />
    </customHeaders>
  </httpProtocol>

  ...
</system.webServer>

設定 HAProxy

請加入以下指令到 frontend, listen, 或 backend 組態設定檔:

rspadd X-Frame-Options:\ SAMEORIGIN

Note:  設定 Meta tag 是無效的,像是 <meta http-equiv="X-Frame-Options" content="deny"> 便沒有任何效果,只有透過設定 HTTP header 才有效果,請勿採用。

 

結論

當載入一個 X-Frame-Options 不允許的網站到 iframe 中, Firefox 會顯示about:blank 的空白頁面,甚至某些狀況還會顯示錯誤訊息。

瀏覽器相容性

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support 4.1.249.1042 3.6.9 (1.9.2.9) 8.0 10.5 4.0
ALLOW-FROM support No support 18.0 (18.0) bug 690168 8.0? ? No support WebKit bug 94836
Feature Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support ? ? ? ? ? ?

 

延伸閱讀

文件標籤與貢獻者

 此頁面的貢獻者: jwhitlock, allenown, foxbrush
 最近更新: jwhitlock,