Chrome 將停用修改 document.domain，以放寬相同來源政策

如果您的網站採用「document.domain」設定，就必須採取行動。

Eiji Kitamura

Twitter GitHub Glitch Mastodon

更新

• 2023 年 5 月 30 日：我們宣布將於 Chrome 115 版淘汰 document.domain setter。
• 2023 年 4 月 7 日：我們發現在 Chrome 112 推出這項異動前，曾發生問題。系統預設為移除的 document.domain setter 目前處於暫停狀態，尚未決定新的運送里程碑。請密切關注這篇網誌文章，或是訂閱 blink-dev 和這個執行緒。
• 2023 年 1 月 20 日：更新時程：自 Chrome 112 版起，系統預設會移除 document.domain setter。此外，已新增有關企業政策的提及內容，以便控制 document.domain 行為。
• 2022 年 7 月 25 日：更新時間軸：自 Chrome 109 版起，系統將預設移除 document.domain setter。
• 2022 年 2 月 4 日：根據新的時間軸更新 - 自 Chrome 100 版起，我們會在「問題」面板中顯示警告訊息，並從 Chrome 106 開始預設移除 document.domain setter。

警告：如果您的網站需要使用 document.domain 放寬相同來源政策，請務必採取行動。請繼續閱讀本文，進一步瞭解為何這項異動會變更，或參閱跨來源通訊的替代程式碼

document.domain 的用途是取得或設定來源的主機名稱。

你無法在 Chrome 中為網站設定 document.domain。您將需要使用替代方法 (例如 postMessage() 或 Channel Messaging API) 進行跨來源通訊。我們的目標是讓 Chrome 112 盡快推出這項變更，但實際情形取決於 Intent to Ship 的回應。

如果您的網站透過 document.domain 使用相同來源政策放寬功能才能正常運作，網站必須傳送 Origin-Agent-Cluster: ?0 標頭，而所有其他需要該行為的文件都會有作用 (請注意，如果只有一份文件設定，document.domain 就不會產生任何作用)。

為什麼要將 document.domain 設為不可變動？

許多網站設定了 document.domain，以便允許相同網站但跨來源網頁進行通訊。

重要詞彙：同一網站但跨來源網站有相同的 eTLD+1，但子網域不同。

這些資訊的使用方式如下：

假設 https://parent.example.com 上的網頁嵌入了 https://video.example.com 的 iframe 頁面。這些網頁的 eTLD+1 (example.com) 不同子網域。如果兩個網頁的 document.domain 設為 'example.com'，瀏覽器會將這兩個來源視為相同來源。

設定 https://parent.example.com 的 document.domain：

// Confirm the current origin of "parent.example.com"
console.log(document.domain);

// Set the document.domain
document.domain = 'example.com';
console.log(document.domain);

設定 https://video.example.com 的 document.domain：

// Confirm the current origin of "video.example.com"
console.log(document.domain);

// Set the document.domain
document.domain = 'example.com';
console.log(document.domain);

您現在可以針對 https://video.example.com 的 https://parent.example.com 建立跨來源 DOM 操控。

網站會設定 document.domain，以便讓同網站文件更容易進行通訊。這項變更會放寬相同來源政策，因此父項頁面可以存取 iframe 的文件，並且週遊 DOM 樹狀結構，反之亦然。

這是很方便的技術，但會帶來安全性風險。

與「document.domain」有安全疑慮

document.domain 相關的安全疑慮導致規格異動，提醒使用者避免使用該功能。目前與其他瀏覽器供應商的討論將以相同方向進行。

舉例來說，當兩個頁面設定 document.domain 時，可能會偽裝成相同來源。當這些網頁使用具有不同子網域的共用代管服務時，這一點尤其重要。設定 document.domain 可開放由該項服務代管的所有其他網站的存取權，讓攻擊者更容易存取您的網站。之所以可以這麼做，是因為 document.domain 忽略網域的通訊埠編號部分。

如要進一步瞭解設定 document.domain 的安全性影響，請參閱 MDN 的「Document.domain」頁面。

Chrome 計劃在 Chrome 112 中讓 document.domain 無法變更。

如何得知我的網站是否受到影響？

如果您的網站受到這項異動影響，Chrome 會在「開發人員工具問題」面板中顯示警告。請注意右上角的黃色旗標。

修改 document.domain 時，「問題」面板會顯示警告訊息。

如果您已設定報表端點，您也會收到淘汰報表。進一步瞭解如何使用 Reporting API 搭配現有的報表集合服務，或藉由建構自己的內部解決方案。

您可以透過 LightHouse 已淘汰 API 稽核功能執行網站，找出所有已排定從 Chrome 移除的 API。

其他跨來源通訊

目前，你可以透過三種選項替換網站的「document.domain」。

使用 postMessage() 或 Channel Messaging API

在大多數用途中，跨來源 postMessage() 或 Channel Messaging API 可以取代 document.domain。

在下列範例中：

1. https://parent.example.com 會透過 postMessage() 傳送訊息，藉此在 iframe 中要求 https://video.example.com，以便控制 DOM。
2. https://video.example.com 會在收到訊息後立即操控 DOM，並將成功通知傳回父項。
3. https://parent.example.com 確認成功。

於 https://parent.example.com：

// Send a message to https://video.example.com
iframe.postMessage('Request DOM manipulation', 'https://video.example.com');

// Receive messages
iframe.addEventListener('message', (event) => {
  // Reject all messages except ones from https://video.example.com
  if (event.origin !== 'https://video.example.com') return;

  // Filter success messages
  if (event.data === 'succeeded') {
    // DOM manipulation is succeeded
  }
});

於 https://video.example.com：

// Receive messages
window.addEventListener('message', (event) => {
  // Reject all messages except ones from https://parent.example.com
  if (event.origin !== 'https://parent.example.com') return;

  // Do a DOM manipulation on https://video.example.com.

  // Send a success message to https://parent.example.com
  event.source.postMessage('succeeded', event.origin);
});

試用看看，瞭解運作方式。如果您有無法與 postMessage() 或 Channel Messaging API 搭配使用的特定需求，請前往 Twitter 透過 @ChromiumDev 告知我們，或是前往 Stack Overflow 張貼問題並加上 document.domain 標記。

如不得已，請傳送 Origin-Agent-Cluster: ?0 標頭

如果您有充分理由繼續設定 document.domain，可以傳送 Origin-Agent-Cluster: ?0 回應標頭和目標文件。

Origin-Agent-Cluster: ?0

Origin-Agent-Cluster 標頭會指示瀏覽器是否應由 origin-keyed 代理程式叢集處理文件。如要進一步瞭解 Origin-Agent-Cluster，請參閱「使用 Origin-Agent-Cluster 標頭要求效能隔離」。

傳送這個標頭時，文件在預設無法變更後仍可繼續設定 document.domain。

為企業政策設定 OriginAgentClusterDefaultEnabled

您可以視需要將 OriginAgentClusterDefaultEnabled 政策設為 false，在貴機構的 Chrome 執行個體預設將 document.domain 設定為可設定，詳情請參閱 Chrome Enterprise 政策清單與管理 | 說明文件。

瀏覽器相容性

• 來源規格：應移除該項功能的狀態。
• Mozilla 預設停用 document.domain 的原型設計。
• WebKit 表示他們針對 document.domain setter 的淘汰作業給予中等正面評價。

資源

• Document.domain - 網站 API | MDN
• 來源隔離和淘汰 document.domain
• 淘汰 document.domain。· 問題 #564 · w3ctag/design-reviews

特別銘謝

Braydon Anderson 相片：Unsplash 網站上