匿名 iframe 來源試用:輕鬆在 COEP 環境中嵌入 iframe

亞瑟.桑松尼 (Arthur Sonzogni)
Arthur Sonzogni

使用 COEP 的開發人員現在可以嵌入不使用 COEP 的第三方 iframe。

為什麼需要 COEP

部分網路 API 會增加旁路攻擊 (例如 Spectre) 的風險。為降低風險,瀏覽器提供「跨來源隔離」這項選擇性的獨立環境,其中還包括部署 COEP。這可讓網站使用特殊權限功能,包括 SharedArrayBufferperformance.measureUserAgentSpecificMemory(),和解析度更佳的高精度計時器

如要啟用跨來源隔離,網站必須傳送下列兩個 HTTP 標頭:

Cross-Origin-Embedder-Policy: require-corp
Cross-Origin-Opener-Policy: same-origin

啟用 COEP 的挑戰

雖然跨來源隔離可提高網頁安全性,且能啟用強大的功能,但部署 COEP 並非易事。最大的難題之一,就是所有跨來源 iframe 也必須部署 COEP 和 CORP。瀏覽器不會載入不含這些標頭的 iframe。

iframe 通常是由第三方提供,因此可能很難部署 COEP。

利用匿名 iframe 進行救援

這時匿名 iframe 就能派上用場。將 anonymous 屬性新增至 <iframe> 元素後,iframe 會從不同的臨時儲存空間分區載入,不再受到 COEP 限制的影響。

示例:

<iframe anonymous src="https://example.com">

iframe 會在新的暫時環境中建立,且無法存取與頂層網站相關聯的任何 Cookie。從空白的 Cookie jar 開始。同樣地,LocalStorageCacheStorageIndexedDB 等儲存空間 API 也會在新的臨時分區中載入及儲存資料。分區範圍限定為目前頂層文件和 iframe 的來源。頂層文件卸載後,系統就會清除儲存空間。

匿名 iframe 不適用 COEP 嵌入規則。這樣仍然安全,因為每次上傳都會從新的空白內容載入。載入這些資料時,不會提供個人化資料。其中包含公開資料,這對攻擊者來說毫無價值。

示範

您可以前往下列網址查看匿名 iframe:https://anonymous-iframe.glitch.me/

註冊來源試用

為確保匿名 iframe 可協助開發人員採用跨來源隔離,我們會在 Chrome 中從 106 版到 108 版提供這些 iframe,做為來源試用。

註冊來源試用,讓您的網站使用 Anonymous iframe:

  1. 為來源要求權杖
  2. 透過下列任一方式使用權杖:
    • 在 HTML 中: html <meta http-equiv="Origin-Trial" content="TOKEN_GOES_HERE">
    • 在 JavaScript 中: js const meta = document.createElement('meta'); meta.httpEquiv = 'Origin-Trial'; meta.content = 'TOKEN_GOES_HERE'; document.head.append(meta);
    • 在 HTTP 標頭中:text Origin-Trial: TOKEN_GOES_HERE
  3. 在網頁上加入匿名 iframe: html <iframe anonymous src="https://example.com">

如果您對這項功能有任何意見,請在 GitHub 存放區中回報問題。

第三方來源試用

第三方指令碼也適用於來源試用。也就是說,在網頁上內嵌的指令碼都能啟用這項功能。

Leran 進一步瞭解如何註冊第三方來源試用服務

常見問題

其他瀏覽器是否會採用這項功能?

巢狀結構是否位於 <iframe anonymous> 的巢狀結構中?

需要。繼承資料。一旦 iframe 是匿名的,就會套用至整個子樹狀結構中的所有 iframe,即使沒有 anonymous 屬性也一樣。

是否也會匿名建立 <iframe anonymous> 的彈出式視窗?

彈出式視窗會以 noopener 的設定模式開啟。這些物件都是根據新的一般頂層結構定義建立,且並非匿名資料。無法與匿名 iframe 通訊。

資源