瞭解 Cookie

Cookie 是儲存在瀏覽器的一塊資料,用來保存狀態,以及網站執行功能時所需的其他資訊。

Cookie 是網站儲存在使用者的電腦上的小型檔案,它儲存的資訊是在瀏覽器和網站之間來回傳輸。

每個 Cookie 都是鍵/值組合,以及一些屬性,可控制 Cookie 的使用時間和位置。這些屬性可用來設定到期日等項目,或指出 Cookie 只能透過 HTTPS 傳送。您可以透過 HTTP 標頭或 JavaScript 介面設定 Cookie。

Cookie 是在網站上加入永久狀態的方法之一。多年來,他們的能力不斷擴增和發展,但缺少部分舊版問題。為解決這個問題,瀏覽器 (包括 Chrome、Firefox 和 Edge) 會變更行為,強制執行更多隱私權保護預設值。

Cookie 實際運作情形

假設您想在網誌一個地方顯示「最新消息」向 使用者。使用者可以關閉宣傳訊息,一陣子就不會再看到。 您可以將這項偏好設定儲存在 Cookie 中,並設為一個月到期 (2,600,000 秒) 且只透過 HTTPS 傳送。該標題看起來會像這樣 :

Set-Cookie: promo_shown=1; Max-Age=2600000; Secure
從回應中,從伺服器傳送至瀏覽器的三個 Cookie
伺服器會使用 Set-Cookie 標頭設定 Cookie。

讀者瀏覽的網頁符合上述條件後,就會前往 安全連線與 Cookie 存在不到一個月,它們的瀏覽器是他們的瀏覽器 會在要求中傳送此標頭:

Cookie: promo_shown=1
瀏覽器在要求中傳送 3 個 Cookie 至伺服器
瀏覽器會在 Cookie 標頭傳回 Cookie。

您也可以使用 JavaScript 來新增及讀取該網站的 JavaScript 可用 Cookie document.cookie。將作業指派給「document.cookie」將會建立或 使用該鍵覆寫 Cookie舉例來說,您可以對 瀏覽器的 JavaScript 控制台:

→ document.cookie = "promo_shown=1; Max-Age=2600000; Secure"
← "promo_shown=1; Max-Age=2600000; Secure"

如果讀取 document.cookie,系統將輸出目前可存取的所有 Cookie 內容,並以半形分號區隔每個 Cookie:

→ document.cookie;
← "promo_shown=1; color_theme=peachpuff; sidebar_loc=left"
在瀏覽器中存取 Cookie
JavaScript 可使用 document.cookie 存取 Cookie。

如果您在某些熱門網站上試用這個功能,會發現大部分 因此遠超過三個 Cookie。大多數情況下 每個網域收到要求時都會傳送 Cookie,且 Cookie 有許多 提示上傳頻寬通常比您下載 使用者,導致所有傳出要求的負擔增加, 第一個位元組請特別留意您設定的 Cookie 數量和大小,廠牌 使用 Max-Age 屬性確保 Cookie 不會停止運作 所需回應時間

什麼是第一方和第三方 Cookie?

回到先前看過的相同網站 他們可能會發現很多網域都有 Cookie 只有你目前造訪的新聞與 也就是瀏覽器網址列中顯示的資訊 視為第一方 Cookie。同樣地, 也就是「第三方 Cookie」。由於這個模型並不是 相對於使用者使用情境同一個 Cookie 可以是 第一方或第三方 (取決於使用者當下所在的網站)。

在同一個網頁上,透過不同要求將 3 個 Cookie 傳送至瀏覽器
Cookie 可能來自於同一個網頁上的不同網域。

延續上面的例子,假設您的其中一篇網誌文章 這個星球上特別好玩的 /blog/img/amazing-cat.png。因為這是一張令人驚豔的圖像 直接在自家網站上使用如果訪客造訪你的網誌,且 promo_shown 個 Cookie,當他們透過另一個 Cookie 查看 amazing-cat.png 時 在該圖片請求中傳送 Cookie 的使用者網站。這個 promo_shown 不會用於任何用途,所以對任何人來說都不實用 反而會增加要求負擔。

如果這是預期中的效果,您為什麼要這麼做?是 機制可讓網站在 以及第三方內容舉例來說,如果您在自家網站上嵌入 YouTube 影片 訪客會看到「稍後觀看」選項。如果您的訪客是 已登入 YouTube,系統就會在以下位置提供該工作階段: 也就是「稍後觀看」按鈕會 只要在單一畫面中儲存影片,就不必提示使用者登入帳戶 離開頁面再返回 YouTube

系統在三種不同的情境中傳送相同的 Cookie
當使用者造訪不同的網頁時,系統會傳送第三方內容中的 Cookie。

網路文化的其中一項文化特性,是開放上網的人 預設值。許多人都能透過這個平台 以及他們所提供的內容和應用程式不過,這麼做也帶來 安全性與隱私權疑慮。跨網站偽造要求 (CSRF) 攻擊的 Cookie 會附加至特定來源的任何請求 發出要求的所有參與者。舉例來說,如果您造訪 evil.example,這個設定檔可以 並觸發向 your-blog.example 發出的要求,你的瀏覽器可以順利附加 以及相關的 Cookie如果發現自己的網誌不太謹慎的驗證方式 要求則evil.example可能會觸發刪除訊息或新增訊息等動作 為自己的內容提供指引

使用者也更加意識到如何使用 Cookie 來追蹤 跨多個網站的活動但直到現在 使用 Cookie 明確指出您的意圖你的 promo_shown Cookie 應該 只會在第一方情境下傳送,小工具的工作階段 Cookie 則會 就是刻意嵌入 登入狀態

您可以設定適當的 SameSite 屬性,以使用 Cookie 明確指出您的意圖。

如要識別您的第一方 Cookie 並設定適當屬性,請參閱「第一方 Cookie 方案」一文。