與彈出式視窗互動時,可獲得跨來源隔離和跨網站洩漏防護。
我們推出了新的跨來源開啟者政策 (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() 和高精確度計時器等高權限功能,同時將來源與其他來源隔離,除非其他來源已選擇加入。
目前為止,如要使用這些 API,您必須設定 Cross-Origin-Opener-Policy:
same-origin。不過,這會中斷您可能需要的任何跨來源彈出式視窗流程,例如單一登入和付款。
現在可以使用 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,請選擇加入來源試用。
瀏覽器支援
Cross-Origin-Opener-Policy: restrict-properties 目前僅支援 Chrome。其他瀏覽器也積極參與標準化討論。
常見問題
我的網站需要與同源彈出式視窗通訊,我應該使用 COOP: restrict-properties 啟用跨來源隔離功能嗎?
在彈出式視窗和主要頁面中設定 COOP: restrict-properties,不會造成限制。如果只在彈出式視窗或只在主要頁面設定,即使是同源,開啟者也無法存取 postMessage 和 closed 以外的任何屬性。
允許的屬性集是否固定?
根據目前為止的意見回饋,我們認為 window.postMessage 和 window.closed 足以應付大多數工作流程,但我們仍在考慮開放其他屬性。如果您的用途無法只使用 postMessage 和 closed 解決問題,請在「Intent to Experiment」討論串中提供意見回饋。