第一方 Cookie 食譜

瞭解如何設定第一方 Cookie，以確保安全、跨瀏覽器相容性，並在第三方 Cookie 淘汰後，盡可能降低廣告損毀的機率。

Milica Mihajlija
Milica Mihajlija
X GitHub 首頁

Cookie 可以是使用者所處情境的第一方或第三方 (視使用者當時所在的網站而定)。如果 Cookie 的可註冊網域和架構與目前的頂層網頁 (也就是瀏覽器網址列顯示的內容) 相符，系統就會將 Cookie 視為與該網頁相同的網站，且通常稱為第一方 Cookie。

來自目前網站以外的網域的 Cookie 通常稱為「第三方 Cookie」。

舉例來說，如果您設定的 Cookie 並未用於跨網站，這些 Cookie 會用來管理網站上的工作階段，也從未在跨網站 iframe 中使用，則該 Cookie 一律會用於第一方情境。

根據預設，Cookie 可跨網站共用、由 JavaScript 存取，並透過 HTTP 連線傳送，這可能會帶來一些隱私權和安全性風險。我們會持續努力改善預設行為，透過 Privacy Sandbox 和其他提案 (例如來源繫結 Cookie)，現在有許多方法都可以在 Cookie 上設定其他屬性。

以下設定是最佳做法，可確保多數第一方 Cookie 的安全性和跨瀏覽器相容性。這類解決方案可提供安全的基礎，並只在必要時進行調整，以開放權限。本文也會說明某些特定用途的方案變化版本。

食譜

Set-Cookie:
__Host-cookie-name=cookie-value;
Secure;
Path=/;
HttpOnly;
Max-Age=7776000;
SameSite=Lax;
詳細說明

Host 是選填的前置字元，會使部分屬性成為必要屬性，且會禁止其他屬性：

  • 必須輸入「Secure」
  • 必須省略「Domain」
  • Path 必須是 /

加入 Host 之後，您可以透過瀏覽器檢查這些屬性是否與 __Host 規則一致，如果不新增，則拒絕 Cookie。

Secure 僅允許透過 HTTPS 連線傳送 Cookie，以免有心人士在不安全的網路中遭竊。如果您尚未將網站遷移至 HTTPS，建議您優先設定優先順序。

Domain 屬性可指定哪些主機可以接收 Cookie。省略時，系統會將 Cookie 限制在目前的文件主機內 (不含子網域)：每次向 example.com 發出要求時，系統都會傳送 example.com 的 Cookie，但不會在對 images.example.com 提出的要求中傳送。如果您有多個應用程式在不同的子網域上執行，您可以降低其中一個網域遭到入侵的風險，避免存取其他應用程式的風險。

Path 表示要求網址中必須有路徑，瀏覽器才能傳送 Cookie 標頭。如果設定 Path=/，系統會將 Cookie 傳送至該網域中的所有網址路徑。合併使用 Domain 和 Path=/ 時，Cookie 會盡可能繫結至來源，因此運作方式與其他用戶端儲存空間 (例如 LocalStorage) 類似，無需混淆 example.com/a 可能會收到不同的 example.com/b 值。

HttpOnly 屬性可限制 JavaScript 存取權，藉此防範網站上的惡意第三方指令碼。這個 Cookie 僅允許透過要求標頭傳送 Cookie，並讓使用 document.cookie 的 JavaScript 無法使用這類 Cookie。

Max-Age 會限制 Cookie 的效期，因為瀏覽器工作階段可能會持續很長，且您不希望有過時的 Cookie 永久留存。這個做法適用於短期 Cookie，例如使用者工作階段，甚至是較短的 Cookie (例如提交表單的權杖)。Max-Age 是以秒數定義，在上例中則設為 7776000 秒 (也就是 90 天)。這是一種合理的預設值，你可以視用途進行調整。

SameSite=Lax 會限制 Cookie 僅在相同網站要求時傳送。也就是說，這項要求會與目前瀏覽環境相符，也就是使用者正在造訪的網站，且會顯示在網址列中。SameSite=Lax 是新式瀏覽器的預設設定，但建議還是針對不同瀏覽器 (可能有不同預設值) 指定相容性。一旦您明確將 Cookie 明確標示為同網站，就等於將 Cookie 限制在第一方使用情境中，您也應該避免在第三方 Cookie 淘汰後變更該 Cookie。

如要進一步瞭解不同的 Cookie 屬性，請參閱 Set-Cookie MDN 說明文件。

如果您的網站包含子網域，並想讓這兩個網站都採用同一個工作階段，那麼 Host 前置字元的限制可能會太過嚴格。舉例來說，news.site 可以有 finance.news.site 和 sport.news.site 等主題的子網域，而您需要為所有這些主題建立單一使用者工作階段。在這種情況下，請使用 __Secure 前置字串，而不是 __Host，並指定 Domain。

食譜

Set-Cookie:
__Secure-cookie-name=cookie-value;
Secure;
Domain=news.site;
Path=/;
HttpOnly;
Max-Age=7776000;
SameSite=Lax;
詳細說明

Secure 是選用前置字元，宣告的規定少於 Host，只需要使用 Secure 屬性設定 Cookie。

雖然系統不會在跨網站子要求中傳送 SameSite=Lax Cookie (例如載入第三方網站中的內嵌圖片或 iframe)，但系統會在使用者前往原始網站時傳送這類 Cookie (例如從其他網站的連結追蹤時)。

您可以進一步限制存取 Cookie，並禁止透過 SameSite=Strict 向第三方網站發出的要求一併傳送 Cookie。當您有與 Cookie 相關的 Cookie 時，這個參數將一直位於初始瀏覽背後，例如變更密碼或進行購物。

食譜

Set-Cookie:
__Host-cookie-name=cookie-value;
Secure;
Path=/;
HttpOnly;
Max-Age=7776000;
SameSite=Strict;