什麼是 Cookie？

網路的設計方式是讓網路瀏覽器對網站的每個要求都各自獨立。根據設計，網頁沒有「記憶體」。每次開啟網頁時，您造訪的網站都無法記住上一個工作階段的資訊。 由於不需要追蹤要求和回應的機制，因此有助於提升網路效率。

但網路的健忘特性也造成問題。舉例來說，如果網站無法記住你剛放進購物車的商品，購物車要如何運作？

Cookie 的發明就是為瞭解決這個問題。

Cookie 可讓網站記住資訊

造訪網站上的網頁時，網路瀏覽器會向網站伺服器要求網頁上包含的資源，例如 HTML、CSS、JavaScript 或圖片。

網路瀏覽器和網站會遵循 HTTP 通訊協定進行互動。這是一套標準化的通訊規則。

回應資源的 HTTP 要求時，網站伺服器可以連同資源本身，一併提供稱為「標頭」的額外資訊。HTTP 回應中包含的 Set-Cookie 標頭會指示瀏覽器儲存一些文字：名稱和值。這就是所謂的 Cookie。舉例來說，回應標頭 Set-Cookie: cat=tabby 會指示瀏覽器儲存名為「cat」且值為「tabby」的 Cookie。

設定該 Cookie 後，瀏覽器後續向網站發出的要求都會包含 Cookie: cat=tabby 標頭。網站伺服器可以從要求標頭存取 Cookie，並使用該值。

Cookie 的運作方式：逐步說明

假設你造訪 cats.example 網站。這個網站想隨機顯示貓咪圖片，並記錄您看過的貓咪。

下列步驟說明如何使用 Cookie 執行這項操作。

1. 瀏覽器要求檔案

您造訪網站首頁 cats.example。

瀏覽器處理首頁 HTML 後，會要求網頁上的檔案，包括 cat.jpg 中的 cats.example。

2. 網站伺服器會回應

cats.example 的伺服器會傳回圖片檔案 cat.jpg。

伺服器會在回應中加入 Set-Cookie: cat=tabby 標頭。

3. 瀏覽器收到回應

瀏覽器會收到圖片檔案，並處理隨附的 Set-Cookie: cat=tabby 標頭。

系統會儲存 Cookie：名稱 cat、值 tabby。

4. 瀏覽器發出額外要求

從現在起，瀏覽器會將 Cookie: cat=tabby 標頭加入對 cats.example 的要求。

當 cats.example 網頁伺服器收到要求時，可以處理 Cookie，並對該值執行任何操作，例如確保不會再次傳送同一隻虎斑貓的圖片。

以下是完整的 Cookie 處理程序：

1. 瀏覽器向網站伺服器要求檔案。
2. 伺服器可以在回應要求時傳送檔案，並附上 Set-Cookie: cat=tabby 等標頭。
3. 瀏覽器收到回應後，就會儲存 Cookie。
4. 在後續的每個要求中，瀏覽器都會在 Cookie: cat=tabby 標頭中將 Cookie 傳送至伺服器。

使用 JavaScript 存取 Cookie

上一個範例使用 Set-Cookie 回應標頭設定 Cookie。

您也可以使用 document.cookie 方法，透過 JavaScript 建立 Cookie。

試用範例：javascript-cookie.glitch.me。

瞭解詳情：文件：Cookie 屬性。

為什麼需要 Cookie？

1994 年，工程師 Lou Montulli 在軟體公司 Netscape 工作，該公司後來打造出 1990 年代中期最受歡迎的網頁瀏覽器。同時，電信公司 MCI 正嘗試為全球第一批線上商店之一建構購物車。MCI 聯絡了 Montulli，說明他們的問題。Montulli 隨即在 HTTP 中加入一項功能，讓網站能在使用者的網路瀏覽器中儲存少量文字、名稱和值，例如 cart-id=123。當時程式設計師會用「魔法 Cookie」一詞，指稱資料通訊中包含的一小段額外資訊，因此他將這項技術稱為「Cookie」。

Montulli 在不到一週的時間內完成了 HTTP Cookie 的工作。他當時並不知道 Cookie 會成為廣告、登入、付款、詐欺偵測和其他重要網路平台功能的基礎。Cookie 是一種看似簡單的技術，但卻造成了深遠的副作用。

Cookie 的用途

Cookie 可讓瀏覽器儲存少量使用者資訊，以便在多個要求之間「記住」某些內容。Cookie 的用途有很多：

• 工作階段管理
  允許網站辨識使用者，例如在不同網頁之間維持登入狀態。
• 個人化
  儲存使用者偏好設定，例如語言、主題或最近瀏覽的項目， 以便自訂網站體驗。
• 追蹤
  過去，Cookie 用於追蹤使用者在各個網站的行為，以利放送目標廣告及用於其他用途。

Cookie 主要用於 ID，而非直接儲存資訊。

舉例來說，線上寵物商店的購物車 Cookie 不會列出產品，而是提供帳戶 ID，讓寵物商店在伺服器端資料儲存空間中，查詢購物車內的商品。

對寵物商店伺服器發出的要求可能包含類似下列的 Cookie 標頭：

Cookie: _cart=CART1.2.34567890.123456789

伺服器接著會在資料儲存庫中查詢 _cart 帳戶，並納入要求中的其他資訊。

瞭解詳情

• Cookie 屬性
• 什麼是第三方 Cookie？
• HTTP 要求和回應
• Cookie 工具
• Cookie 示範
• 使用 HTTP Cookie
• The Magic Cookie: How Lou Montulli cured the Web's amnesia (神奇的 Cookie：Lou Montulli 如何治癒網路的失憶症)
• HTTP Cookie (原始規格)
• HTTP Cookie，或如何避免設計通訊協定