← 機能一覧に戻る
Free

クッキーエディター

Cookie Editorは、現在のドメインのすべてのcookieを、整理されたソート可能なテーブルに表示します。cookie名・値・有効期限・パス・セキュリティフラグ(HttpOnly、Secure、SameSite)を確認できます。値をインラインで編集したり、カスタムパラメータで新しいcookieを追加したり、個別または一括削除が可能です。認証・session・同意フローのデバッグに欠かせないツールです。

cookieは認証・session管理・ユーザー設定・同意トラッキング・分析・A/Bテストを担いますが、開発中にそれらを管理するのは手間がかかります。Chrome DevToolsではApplicationタブでcookieを確認できますが、インターフェースは基本的で複数のパネルを移動する必要があります。Cookie Editorは、現在のドメインのすべてのcookieとそのプロパティを一目で確認できる、すっきりした1つのテーブルに集約します。値セルをクリックすればインラインで編集でき、変更はブラウザのcookieストアに即時保存されます。カスタムの名前・値・有効期限・パス・フラグを指定して新しいcookieを追加することもできます。cookieを個別に削除したり、まとめてクリアしたりすることも可能です。テーブルにはセキュリティフラグバッジ(SはSecure、HはHttpOnly)が表示されるため、機密cookieに適切な保護が設定されているか確認できます。session cookieと永続cookieは有効期限列で区別されます。ブラウザのDevToolsに標準搭載してほしかった、まさにそのツールです。

ライブプレビュー
example.com
Cookies — example.com (5)
+ Add Delete All
NameValueExpiresFlags
_gaGA1.1.12345678.1709...2yS
session_idabc123def456...SessionS H
themedark1y
consentaccepted1yS
_fbpfb.1.170912...90dS
S = Secure · H = HttpOnly · Click any value to edit
主な機能

完全なcookieテーブル

現在のドメインのすべてのcookieが、名前・値・有効期限(または「Session」)・パス・フラグの列を持つソート可能なテーブルに表示されます。すっきりとしたデザインで、すべてのcookieを一目で把握できます。

インライン値編集

任意のcookie値をクリックしてその場で編集できます。新しい値を入力するとブラウザのcookieストアに即時保存されます。cookieを削除して再作成する必要はなく、値を直接変更するだけです。

新しいcookieの追加

「追加」をクリックして、カスタムの名前・値・有効期限・パス・domainを指定した新しいcookieを作成できます。Secure、HttpOnly、SameSiteフラグも設定可能です。cookieはブラウザのcookieストアに即時作成されます。

個別・一括削除

削除ボタンをクリックして個別のcookieを削除するか、「すべて削除」で現在のドメインのすべてのcookieをクリアできます。ログアウト状態や同意フローのテストに便利です。

セキュリティフラグバッジ

視覚的なバッジでセキュリティフラグを示します:S(Secure — HTTPSのみ)、H(HttpOnly — JavaScriptからアクセス不可)、SameSiteの値(Strict、Lax、None)。機密cookieに適切な保護が設定されているか一目で確認できます。

sessionと永続cookieの区別

有効期限列により、session cookie(「Session」— ブラウザを閉じると削除)と永続cookie(実際の有効期限と時刻を表示)が明確に区別されます。cookieの有効期間について曖昧さはありません。

主な活用例

認証問題のデバッグ

ログイン後にsession cookieが正しく設定されているか確認します。sessionトークンを編集して、期限切れや無効なsessionの処理をテストします。session cookieを削除してログアウト状態をテストします。

cookie同意フローのテスト

同意cookieを削除してcookie同意バナーを再表示させます。同意値を編集して、さまざまな同意状態(すべて承認・一部承認・すべて拒否)をテストします。

セキュリティフラグの確認

認証cookieにHttpOnly(XSS盗難防止)、Secure(HTTPSのみ)、SameSite=StrictまたはLax(CSRF防止)が設定されているか確認します。不足しているフラグはテーブルですぐに確認できます。

異なるユーザー状態のシミュレーション

通常のユーザーフローを経由せずに、ログイン状態・A/Bテストバリアント・機能フラグの割り当て・ロケール設定をシミュレートするcookieを追加します。

cookie有効期限の動作テスト

cookieの有効期限を過去の日付に変更してリロードし、サイトが期限切れcookieをどう処理するかテストします。または、session cookieを永続cookieに変更して永続化の動作をテストします。

使い方
1

Cookie Editorを開く

DevSuite Proのポップアップを開き、Cookie Editorのアイコンをクリックします。現在のドメインのすべてのcookieがテーブルに読み込まれます。

2

cookieの閲覧とソート

cookieテーブルをスクロールして確認します。列のヘッダーをクリックすると名前・値・有効期限でソートできます。セキュリティフラグバッジにより、どのcookieがSecureおよびHttpOnlyかを確認できます。

3

cookie値の編集

値セルをクリックしてインラインで編集します。新しい値を入力するとcookieストアに即時保存されます。変更を反映するにはページのリロードが必要な場合があります。

4

cookieの追加・削除

「追加」をクリックしてパラメータを細かく指定した新しいcookieを作成します。任意の行の削除アイコンをクリックしてそのcookieを削除します。「すべて削除」ですべてをクリアできます。

5

リロードして効果を確認

cookieを編集した後、ページをリロードして変更がサイトに与える影響(ログイン状態・設定・同意バナーなど)を確認します。

試してみませんか? クッキーエディター?

DevSuite Pro を無料でインストールして、ブラウザで 39 以上の開発者ツールを利用しましょう。

Chrome に追加 Edgeに追加 Firefox に追加