Cookie 具有獨立分區狀態 (CHIPS)

允許開發人員選擇使用 Cookie 進行「分區」儲存空間,並在每個頂層網站提供專屬 Cookie jar。

導入狀態

瀏覽器支援

  • 114
  • 114
  • x
  • x

資料來源

什麼是 CHIPS?

具有獨立分區狀態 (CHIPS) 的 Cookie 可讓開發人員選擇使用 Cookie 進行分區儲存空間,並在每個頂層網站提供個別的 Cookie Jar,藉此提高使用者隱私和安全性。

在沒有分區的情況下,第三方 Cookie 可讓服務追蹤使用者,並從多個不相關的頂層網站彙整使用者資訊。這種做法稱為跨網站追蹤。

由於瀏覽器正逐漸淘汰未分區的第三方 Cookie,因此在封鎖第三方 Cookie 的情況下,CHIPS、Storage Access API相關網站集將會是從跨網站結構定義 (例如 iframe) 讀取及寫入 Cookie 的唯一方法。

這張圖表顯示兩個不同網站之間如何共用烹飪。
在沒有 Cookie 分區的情況下,第三方服務可在嵌入某個頂層網站時設定 Cookie,並在其他頂層網站嵌入服務時存取同一個 Cookie。

CHIPS 推出新的 Cookie 屬性 Partitioned,以支援依頂層環境劃分的跨網站 Cookie。

Set-Cookie 標頭:

Set-Cookie: __Host-name=value; Secure; Path=/; SameSite=None; Partitioned;

JavaScript:

document.cookie="__Host-name=value; Secure; Path=/; SameSite=None; Partitioned;"

分區的第三方 Cookie 會連結到最初設定該 Cookie 的頂層網站,且無法從其他位置存取。這樣一來,第三方服務設定的 Cookie 就只能在最初設定的頂層網站相同嵌入環境中讀取。

這張圖表顯示兩個嵌入同一個第三方網站的兩個網站不會再分享 Cookie 給該第三方。
如果使用 Cookie 分區,在嵌入某個頂層網站時設定 Cookie 的第三方服務在嵌入其他頂層網站時,將無法存取該 Cookie。

透過分區 Cookie,當使用者造訪 A 網站,以及來自網站 C 的嵌入內容設定 Cookie 和分區屬性時,該 Cookie 便會儲存在專為網站 C 嵌入網站 A 時設定的 Cookie 專屬 Cookie 內。只有在頂層網站是 A 時,瀏覽器才會傳送這個 Cookie。

當使用者造訪新的網站 (例如網站 B) 時,嵌入的 C 頁框無法接收在網站 A 中嵌入 C 時設定的 Cookie。

如果使用者造訪 C 做為頂層網站,網站將 C 嵌入 A 時設定的分區 Cookie 不會在該請求中送出。

這張圖表顯示當兩個不同網站嵌入同一個第三方時,系統不會分享 Cookie。
使用 Cookie 分區功能,在網站中嵌入時設定 Cookie 的第三方服務,即使使用者以頂層網站的身分造訪該服務,也無法存取這個 Cookie。

用途

舉例來說,retail.example 網站可能需要與第三方服務 support.chat.example 合作,在其網站上嵌入支援即時通訊方塊。現今許多可嵌入的聊天服務都仰賴 Cookie 來儲存狀態。

這張圖表顯示網站和虛擬聊天小工具
頂層 site Retail.example 嵌入第三方服務support.chat.example

如果無法設定跨網站 Cookie,support.chat.example 就必須尋找用來儲存狀態的替代方法 (通常是更複雜的替代方法)。或者,您必須將其嵌入頂層網頁,因為此政策允許 support.chat.example 指令碼在 Retail.example 上取得進階權限,例如存取驗證 Cookie 等。

CHIPS 提供較簡單的選項,可繼續使用跨網站 Cookie,不必擔心未分區 Cookie 的相關風險。

CHIPS 的使用範例包括所有跨網站子資源需要工作階段或持續狀態概念的概念,並將範圍限於單一頂層網站上的使用者活動,例如:

  • 第三方聊天室嵌入
  • 第三方地圖嵌入
  • 第三方付款嵌入
  • 子資源 CDN 負載平衡
  • 無頭 CMS 供應商
  • 提供受信任使用者內容的沙箱網域 (例如 googleusercontent.com 和 githubusercontent.com)
  • 第三方 CDN 會使用 Cookie 提供由第一方網站驗證狀態控管的內容 (例如第三方 CDN 代管的社群媒體網站上的個人資料相片)
  • 需仰賴遠端 API 且會在要求中使用 Cookie 的前端架構
  • 需要依發布商設定狀態的內嵌廣告 (例如擷取該網站的使用者廣告偏好設定)

CHIPS 採用選擇加入分區模型的原因

隨著瀏覽器逐步淘汰未分區的第三方 Cookie,我們已嘗試使用其他數種方法進行分區。

Firefox 宣布會在 ETP 嚴格模式和私密瀏覽模式中預設將所有第三方 Cookie 分割,因此所有跨網站 Cookie 都會依頂層網站劃分。不過,在沒有第三方選擇啟用的情況下將 Cookie 分區,可能會導致非預期的錯誤,因為有些第三方服務所建構的伺服器預期會使用未分區的第三方 Cookie。

Safari 先前嘗試根據經驗法則來劃分 Cookie,但最終選擇完全封鎖,是開發人員因此感到困惑的原因之一。最近,Safari 表示他們對選擇加入的模式感興趣

除了目前已導入分區 Cookie 外,第三方選擇加入 CHIPS 的原因,則是透過第三方選擇加入。Cookie 必須使用新屬性設定,才能於 (未分區) 第三方 Cookie 完成一次 (未分區) 時傳送。

雖然第三方 Cookie 仍會繼續存在,但 Partitioned 屬性可讓您選擇採用更嚴格的 Cookie 行為類型。CHIPS 是重要的一步,能讓服務在沒有第三方 Cookie 的情況下,順利遷移至未來。

如今,Cookie 是在設定 Cookie 的網站主機名稱或網域 (即「主機金鑰」) 上建立金鑰,

舉例來說,如果是來自 https://support.chat.example 的 Cookie,主機金鑰為 ("support.chat.example")

在 CHIPS 下,選擇加入分區的 Cookie 會根據其主機金鑰和分區索引鍵分別加上索引鍵。

Cookie 的分區索引鍵是指瀏覽器在要求設定 Cookie 的端點時,瀏覽器所造訪的頂層網域 (配置和可註冊網域)。

在前述範例中,https://support.chat.example 嵌入 https://retail.example 中,頂層網址為 https://retail.example

在此情況下,分區索引鍵為 ("https", "retail.example")

同樣地,要求的分區索引鍵是瀏覽器在發出要求時,所造訪頂層網址的網站。瀏覽器必須在與 Cookie 具有相同的分區索引鍵時,傳送含有 Partitioned 屬性的 Cookie。

以下是前述範例的 Cookie 金鑰外觀:CHIPS 前後的樣子。

網站 A 和嵌入的網站 C 共用分區 Cookie。網站 C 如未嵌入,就無法存取分區 Cookie。
網站 A 和嵌入的網站 C 共用分區 Cookie。如果未嵌入網站,網站 C 就無法存取分區 Cookie。

CHIPS 前

key=("support.chat.example")

在 CHIPS 後

key={("support.chat.example"),("https", "retail.example")}

安全性設計

為採用良好的安全性做法,以 CHIPS 來說,Cookie 只會由安全通訊協定設定及傳送,

  • 分區 Cookie 必須透過 Secure 設定。
  • 設定分區 Cookie 時,建議使用 __Host 前置字元,將 Cookie 繫結至主機名稱 (而非可註冊的網域)。

示例:

Set-Cookie: __Host-example=34d8g; SameSite=None; Secure; Path=/; Partitioned;

CHIPS 的替代方案

Storage Access API 和相關聯的相關網站集 (RWS) 是一種網路平台機制,可針對面向使用者的特定用途啟用有限的跨網站 Cookie 存取權。

這些是 CHIPS 分區的替代選項,在需要存取跨站式未分區烹飪的情況下,

當您需要讓嵌入多個相關網站的服務使用相同的 Cookie 時,請考慮使用 Storage Access API 和相關網站集。

CHIPS 可讓服務做為在多個網站上做為獨立元件使用的功能,而相同的 Cookie 不需要跨多個網站使用。如果服務設定分區 Cookie,其分區索引鍵將為頂層網站,且其他使用該服務的網站也無法使用該 Cookie。

相關網站集設計仰賴 Storage Access API,並未與 CHIPS 分區整合。如果您的用途需要使用 RWS 跨網站共用的 Cookie 分區,請針對 GitHub 問題提供範例和意見回饋

操作示範

這個示範將逐步說明分區 Cookie 的運作方式,以及如何在開發人員工具中查看。

網站 A 嵌入網站 B 的 iframe,以使用 JavaScript 設定兩個 Cookie:分區和非分區 Cookie。網站 B 會使用 document.cookie 顯示可從該位置存取的所有 Cookie。

在封鎖第三方 Cookie 的情況下,網站 B 只能在跨網站情境中使用 Partitioned 屬性設定及存取 Cookie。

如果允許第三方 Cookie,網站 B 也可以設定和存取未分區的 Cookie。

網站 A 和網站 B
左圖:已封鎖第三方 Cookie。右圖:允許第三方 Cookie。

必要條件

  1. Chrome 118 以上版本。
  2. 前往 chrome://flags/#test-third-party-cookie-phaseout 啟用這項設定

使用開發人員工具檢查分區 Cookie

  1. 前往 https://chips-site-a.glitch.me
  2. 按下 Control+Shift+J (在 Mac 上則為 Command+Option+J) 開啟開發人員工具。
  3. 按一下「應用程式」分頁標籤。
  4. 依序前往「應用程式」>「儲存空間」>「Cookie」
  5. 按一下「https://chips-site-b.glitch.me」。

開發人員工具會顯示來自所選來源的所有 Cookie。

開發人員工具「應用程式」分頁中顯示網站 B 的 Cookie。

網站 B 只能在跨網站情境中設定分區 Cookie,系統將封鎖未分區 Cookie:

  • 您應該會看到 __Host-partitioned-cookie 以及頂層網站 https://chips-site-a.glitch.me 的分區索引鍵。
__Host 分區 Cookie 的分區鍵。
  1. 按一下「前往 B 網站」
  2. 在開發人員工具中,前往「應用程式」>「儲存空間」>「Cookie」
  3. 按一下「https://chips-site-b.glitch.me」。
網站 B
在頂層,網站 B 可查看所有 Cookie (已分區而非分區)

在此情境中,由於您目前位於頂層網站 B,因此可以設定並存取這兩個 Cookie:

  • unpartitioned-cookie 的分區索引鍵空白。
  • __Host-partitioned-cookie Cookie 含有分區索引鍵 https://chips-site-b.glitch.me
造訪頂層網站 B 時,在開發人員工具「應用程式」分頁中來自網站 B 的 Cookie。__Host 分區 Cookie 具有分區索引鍵 https://chips-site-b.glitch.me。

如果返回 A 網站,unpartitioned-cookie 目前會儲存在瀏覽器中,但無法透過網站 A 存取。

  1. 按一下「前往網站 A」
  2. 按一下 [網路] 分頁標籤。
  3. 按一下「https://chips-site-b.glitch.me」。
  4. 按一下「Cookie」分頁標籤。

在網站 A 上,您應該會看到 __Host-partitioned-cookie 以及頂層網站 https://chips-site-a.glitch.me 的分區索引鍵。

「聯播網」分頁顯示網站 B iframe 嵌入網站 A 時可以存取的 Cookie。

如果勾選顯示篩除的 Cookie 要求,開發人員工具就會顯示未分區 Cookie,以黃色醒目顯示,並加上工具提示:「這個 Cookie 因使用者偏好設定而遭到封鎖」

「聯播網」分頁顯示來自網站 B iframe 的已封鎖 Cookie。

在「Application」(應用程式) >「Storage」(儲存空間) >「Cookies」(Cookie) 中點選 https://chips-site-b.glitch.me 即會顯示:

  • unpartitioned-cookie 包含空白分區索引鍵。
  • __Host-partitioned-cookie Cookie 含有分區索引鍵 https://chips-site-a.glitch.me
開發人員工具「應用程式」分頁中顯示網站 B 的 Cookie。__Host-partitioned-cookie Cookie 含有分區索引鍵 https://chips-site-a.glitch.me。已顯示 unpartitioned-cookie,但內嵌在網站 A 的 iframe 中,網站 B iframe 無法存取。

清除 cookie

如要重設示範,請清除網站的所有 Cookie:

  • 按下 Control+Shift+J (在 Mac 上則為 Command+Option+J) 開啟開發人員工具。
  • 按一下「應用程式」分頁標籤。
  • 依序前往「應用程式」>「儲存空間」>「Cookie」
  • https://chips-site-b.glitch.me 上按一下滑鼠右鍵。
  • 按一下「清除」

資源