查看、新增、編輯及刪除 Cookie

Kayce Basques
Kayce Basques
Sofia Emelianova
Sofia Emelianova

HTTP Cookie 主要用於管理使用者工作階段、儲存使用者個人化偏好設定，以及追蹤使用者行為。此外，網路上所有惱人的「這個頁面使用 Cookie」同意聲明表單，也都是 Cookie 造成的。本指南說明如何使用 Chrome 開發人員工具，查看、新增、編輯及刪除網頁的 Cookie。

開啟「Cookies」窗格

  1. 開啟 Chrome 開發人員工具。
  2. 依序開啟「Application」 >「Storage」 >「Cookies」，然後選取來源。

「Cookies」窗格。

欄位

「Cookie」表格包含下列欄位：

  • 名稱。Cookie 名稱。
  • 值：Cookie 的值。
  • 網域。允許接收 Cookie 的主機。
  • 路徑。要求網址中必須包含的網址，才能傳送 Cookie 標頭。
  • Expires / Max-Age。Cookie 的到期日或存在時間長度上限。 如果是工作階段 Cookie，這個值一律為 Session。
  • Size - Cookie 大小 (以位元組為單位)。
  • HttpOnly。如果為 true，表示 Cookie 只能透過 HTTP 使用，且不允許 JavaScript 修改。
  • 安全。如果為 true，這個欄位表示 Cookie 只能透過安全的 HTTPS 連線傳送至伺服器。
  • SameSite。如果 Cookie 使用實驗性 SameSite 屬性，則包含 Strict 或 Lax。
  • 分割區金鑰。如果是具有獨立分區狀態的 Cookie，分區金鑰是瀏覽器在要求傳送至設定 Cookie 的端點時，所造訪的頂層網址網站。
  • 優先檔案區。如果使用已淘汰的 cookie Priority 屬性，則包含 Low、Medium (預設值) 或 High。

如要查看 Cookie 的值，請在表格中選取該 Cookie。如要查看未經過百分比編碼的值，請勾選「顯示已解碼的網址」。

篩選 Cookie

使用「Filter」(篩選器) 方塊，依「Name」(名稱) 或「Value」(值) 篩選 Cookie。

篩除不含「id」的任何 Cookie。

系統不支援依其他欄位篩選。篩選器不區分大小寫。

如要新增任意 Cookie，請按照下列步驟操作：

  1. 在表格的空白列上按兩下滑鼠。
  2. 輸入「名稱」和「值」，然後按下 Enter 鍵。

開發人員工具會自動填入其他必填欄位。你可以按照下節說明編輯這些內容標籤。

編輯 Cookie

除了會自動更新的「大小」，其他欄位皆可編輯。

按兩下欄位即可編輯。

將 Cookie 名稱設為「DEVTOOLS!」

如果 Cookie 的欄位值無效，開發人員工具���以紅色醒目顯示。

Partition Key 值無效的 Cookie。

如要篩除有效的 Cookie，請勾選頂端動作列中的「只顯示有問題的 Cookie」。

刪除 Cookie

如要刪除 Cookie，請選取該 Cookie，然後按一下頂端動作列中的「刪除所選」。

刪除所選 Cookie。

按一下「全部清除」即可刪除所有 Cookie。

清除所有 Cookie。

找出並檢查第三方 Cookie

第三方 Cookie 是指由與目前頂層網頁不同的網站所設定的 Cookie。第三方 Cookie 具有 SameSite=None 屬性。

開發人員工具會在「應用程式」 >「儲存空間」 >「Cookie」中列出這類 Cookie，並在旁邊顯示圖示。將游標懸停在圖示上，即可查看工具提示，點選圖示則可前往「問題」面板瞭解詳情。

儲存空間專區中具有 SameSite=None 屬性的 Cookie。

您也可以依序點選「網路」 > 要求 >「Cookie」，找出第三方 Cookie。

「網路」面板中具有 SameSite=None 屬性的 Cookie。

「網路」面板會醒目顯示有問題的 Cookie，並在無法使用第三方 Cookie 的情況下，於受影響的 Cookie 旁顯示圖示。