HOWTO · JavaScript
JavaScript ですべての Cookie をクリアする
この記事では、JavaScript を使用してすべての Cookie をクリアする方法を示します。
このページの内容
この記事は、JavaScript を使用してすべての Cookie をクリアするのに役立ちます。
Cookie を使用すると、クライアントとサーバーは HTTP を介して情報を通信および転送できます。これにより、クライアントはステートレスプロトコル HTTP を使用している場合でも状態情報を保持できます。
- Cookie に関する情報は、ユーザーのブラウザからドメインにアクセスするたびに、HTTP リクエストヘッダーで送信されます。
- ログイン情報、同意、その他のパラメーターなどの情報は、ユーザーエクスペリエンスを向上させ、パーソナライズします。
JavaScript を使用して現在のドメインのすべての Cookie を削除する
現在のドキュメントの cookie 属性は、HTML DOM cookie 属性を使用して購入した cookie の属性を変更するために使用されます。document.cookie は、現在のドキュメントに関連付けられているすべてのセミコロン区切りの Cookie の文字列を返します。
構文：
document.cookie = 'key=value';
以下のコードは、JavaScript を使用して Cookie を削除する方法を示しています。コードはオンラインエディタで実行され、サイトで生成された Cookie のみを削除できることを示しています。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>
</title>
</head>
<body>
<main>
<script type="text/javascript">
document.cookie = "username=shiv";
document.cookie = "CONSENT=YES+IN.en+20170903-09-0";
function displayCookies() {
var displayCookies = document.getElementById("display");
displayCookies.innerHTML = document.cookie;
}
function deleteAllCookies() {
var cookies = document.cookie.split(";");
for (var i = 0; i < cookies.length; i++) {
var cookie = cookies[i];
var eqPos = cookie.indexOf("=");
var name = eqPos > -1 ? cookie.substr(0, eqPos) : cookie;
document.cookie = name + "=;expires=Thu, 01 Jan 1970 00:00:00 GMT";
}
}
</script>
<button onclick="displayCookies()">Display Cookies</button>
<button onclick="deleteAllCookies()">Delete Cookies</button>
<p id="display"></p>
</main>
</body>
</html>
上記のコードには 2つの制限があります。
HttpOnlyフラグが設定された Cookie は削除されません。これは、HttpOnlyフラグが Cookie への JavaScript アクセスを無効にするためです。- パス値として設定された Cookie は削除されません。（これらの Cookie は[削除済み]の下に表示されますが、インストールパスに同じ値を指定しないと削除できません。）
出力：
Cookie の表示をクリックすると、Cookie が表示されます。
インスペクターで Cookie を表示することもできます。
Cookie の削除をクリックすると削除されます。Cookie の表示をもう一度クリックして、削除されているかどうかを確認する必要があります。
削除されているかどうかもインスペクターで確認できます。
