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

Kayce Basques
Sofia Emelianova
Sofia Emelianova
GitHub

HTTP Cookie 主要用於管理使用者工作階段、儲存使用者的個人化偏好設定，以及追蹤使用者行為。您也可能因為在網路上看到「這個網頁使用了 Cookie」同意聲明表單，而造成這些困擾。本指南將說明如何使用 Chrome 開發人員工具查看、新增、編輯及刪除網頁的 Cookie。

開啟 Cookie 窗格

  1. 開啟 Chrome 開發人員工具。
  2. 開啟「應用程式」 >「儲存空間」 >「Cookie」，然後選取來源。

「Cookie」窗格。

欄位

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

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

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

篩選 Cookie

使用「篩選器」方塊，依「名稱」或「值」篩選 Cookie。

篩除所有不包含「id」的 Cookie。

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

如何新增任意 Cookie：

  1. 按兩下表格中的空白列。
  2. 輸入名稱和值，然後按下 Enter 鍵。

開發人員工具會自動填入其他必填欄位。您可以按照下述方式編輯。

編輯 Cookie

您可以編輯所有欄位，但「Size」會自動更新。

按兩下欄位即可進行編輯。

將 Cookie 的名稱設為「DEVTOOLS!」

開發人員工具會以紅色醒目顯示含有無效欄位值的 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 旁顯示警告圖示。