特定のサイトのCookieやWebStorageを削除する

chromeでの作業中、特定のサイト内で使用しているストレージを削除したいということがあるので、やり方をメモ。

設定方法

まずは確認用に、cookieとlocalStorage、sessionStorageの内容確認と設定を行えるデモを用意します。

<button id="cookie-add">cookie追加</button>
<button id="localStorage-add">localStorage追加</button>
<button id="sessionStorage-add">sessionStorage追加</button>

デモページアクセス時に現在の設定状態をconsoleに表示して、各ボタンクリック時に設定を行うようにしてみます。

const c = document.cookie;
console.log('cookie', c);
const l = localStorage.getItem('localstrage');
console.log('localStorage', l);
const s = sessionStorage.getItem('sessionStorage');
console.log('sessionStorage', s);

document.getElementById('cookie-add').addEventListener('click', function() {
	document.cookie = "cookie=test";
});
document.getElementById('localStorage-add').addEventListener('click', function() {
	localStorage.setItem('localstrage', 'test');
});
document.getElementById('sessionStorage-add').addEventListener('click', function() {
	sessionStorage.setItem('sessionStorage', 'test');
});

これで各登録と確認ができるようになりました。
ストレージ確認のデモページ

ブラウザ右上のメニューから設定を選択します。

プライバシーとセキュリティ > サードパーティ Cookie を選択します。

すべてのサイトデータと権限を表示 を選択します。

右上の検索にサイトのドメインを入力すると該当のサイトに絞り込まれるので、ゴミ箱のアイコンをクリックしてCookieを削除します。

最初に作成したデモページで確認したところ、cookieとlocalStorageに関しては削除を確認できましたが、sessionStorageの削除が確認できませんでした。
ただ、sessionStorageのみ値を設定した状態で削除画面を確認するとサイトが表示されないようだったので、そもそもsessionStorageはこの画面での管理対象外なのかもしれないです。

別の方法として、デベロッパーツールを使用する方法も試してみます。

デベロッパーツールのApplicationタブを選択します。
左のStorage内にLocal storageとSession storage、Cookiesという項目が確認できます。

例えばSession storage 内のサイトドメインを選択すると、そのドメイン内で使用されているSession storageの値が一覧で表示されます。

値を選択した状態で右クリックして、Deleteを選択するとそのSession storageの値を削除することができます。

参考サイト

このエントリーをはてなブックマークに追加

関連記事

コメントを残す

メールアドレスが公開されることはありません。
* が付いている欄は必須項目です

CAPTCHA


コメントが承認されるまで時間がかかります。

2024年12月
1234567
891011121314
15161718192021
22232425262728
293031