與彈出式視窗互動時,可獲得跨來源隔離和跨網站洩漏保護。
跨來源開發者政策 (COOP) 有新的值可用:restrict-properties
。這種方法不但具有安全性優勢,還可讓您更輕鬆地採用跨來源隔離機制,同時讓網站能與第三方彈出式視窗互動,以便進行付款、驗證或其他用途。
如要開始試驗 restrict-properties
,請從 Chrome 116 開始參與來源試用。
使用 restrict-properties
的原因
restrict-properties
有兩個主要用途:
在不中斷的情況下防止跨網站外洩
根據預設,任何網站都能在彈出式視窗中開啟您的應用程式,並取得應用程式的參照。
惡意網站可以利用這項功能,執行跨網站洩漏等攻擊。如要降低這類風險,您可以使用 Cross-Origin-Opener-Policy
(COOP) 標頭。
Cross-Origin-Opener-Policy
的選項目前相當有限。您可以採取下列任一做法:
- 設定
same-origin,
,可封鎖彈出式視窗的所有跨來源互動。 - 設定
same-origin-allow-popups
,可封鎖在彈出式視窗中開啟網站的所有跨來源互動。 - 設定
unsafe-none
,允許彈出式視窗與所有跨來源互動。
這使得需要在彈出式視窗中開啟的網站無法與開啟者互動,以便強制執行 COOP。這導致單一登入和付款等重要用途無法受到跨網站洩漏的保護。
Cross-Origin-Opener-Policy: restrict-properties
可解決這個問題。
使用 restrict-properties
時,無法使用可用於計算影格數及其他跨網站外洩攻擊的屬性,但允許透過 postMessage
和 closed
在視窗之間進行基本通訊。
這麼做可提升網站安全性,同時維持重要用途。例如:
- 如果您在彈出式視窗中提供服務,設定
Cross-Origin-Opener-Policy: restrict-properties
可防範各種跨網站外洩攻擊。 你仍可開啟先前可開啟的所有網頁。 - 如果您需要存取跨來源彈出式視窗,設定
Cross-Origin-Opener-Policy: restrict-properties
也會同樣保護您的網站免於遭到 iframe 計數。您可以開啟與目前相同的彈出式視窗。 - 如果開啟者和開啟者皆設定了標頭,且網頁為跨來源,則系統的運作方式與其中一方設定標頭時相似。如果是同源,則會授予完整存取權。
讓網站跨來源隔離
為何需要跨來源隔離
有些網路 API 會增加 Spectre 等旁路攻擊的風險。為降低這種風險,瀏覽器提供一種有選擇的獨立環境,稱為「跨來源隔離」。在跨來源隔離狀態的情況下,網頁可以使用權限功能 (包括 SharedArrayBuffer、performance.measureUserAgentSpecificMemory() 和高精確度計時器) 且解析度較佳,同時將來源與其他來源隔離,除非使用者選擇啟用。
在此之前,您必須設定 Cross-Origin-Opener-Policy:
same-origin
,才能使用這些 API。不過,這樣會中斷您可能需要的任何跨來源彈出式視窗流程,例如單一登入和付款。
Cross-Origin-Opener-Policy: restrict-properties
現在可取代 Cross-Origin-Opener-Policy: same-origin
,用於啟用跨來源隔離功能。這並非切斷開啟者關係,而是將其限制在 window.postMessage()
和 window.closed
的最低通訊子集。
您可以使用下列兩個標頭啟用跨來源隔離功能:
Cross-Origin-Opener-Policy: restrict-properties
Cross-Origin-Embedder-Policy: require-corp
或
Cross-Origin-Opener-Policy: restrict-properties
Cross-Origin-Embedder-Policy: credentialless
如要進一步瞭解 credentialless
,請參閱使用 COEP: credentialless
載入沒有 CORP 標頭的跨來源資源。
示範
嘗試此跨來源隔離示範中的各種標頭選項。
嘗試使用來源試用功能
如要試用 Cross-Origin-Opener-Policy: restrict-properties
,請選擇加入原始試用版。
瀏覽器支援
目前只有 Chrome 支援 Cross-Origin-Opener-Policy: restrict-properties
。其他瀏覽器也積極參與標準化的討論作業。
常見問題
我的網站需要與同來源彈出式視窗通訊,我是否應使用 COOP: restrict-properties
啟用跨來源隔離功能?
在彈出式視窗和主頁面上同時設定 COOP: restrict-properties
並不會造成限制。若只在彈出式視窗或主頁面上設定,則在開啟者中,除了 postMessage
和 closed
以外,其他資源都無法存取,即使這些資源為同源也一樣。
允許的資源組是否已固定?
根據目前收到的意見回饋,我們認為 window.postMessage
和 window.closed
已足以支援大部分工作流程,但仍考慮開放給其他資源使用。如果您有用途無法僅使用 postMessage
和 closed
解決的問題,請在意圖實驗子串流中提供意見回饋。