1. 開発者向けのウェブ技術
  2. Web API
  3. CookieStore
  4. delete()

このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docs コミュニティーについてもっと知り、仲間になるにはこちらから。

View in English Always switch to English

CookieStore: delete() メソッド

Baseline 2025 *
最近利用可能

June 2025以降、この機能は最新のバージョンの端末およびブラウザーで動作します。古い端末やブラウザーでは動作しないことがあります。

Want more support for this feature? Tell us why.

* この機能の一部は、対応レベルが異なる場合があります。

安全なコンテキスト用: この機能は一部またはすべての対応しているブラウザーにおいて、安全なコンテキスト (HTTPS) でのみ利用できます。

メモ: この機能はサービスワーカー内で利用可能です。

delete() は CookieStore インターフェイスのメソッドで、与えられた名前またはオプションオブジェクトを持つ Cookie を削除します（下記参照）。delete() メソッドは日付を過去のものに変更することで Cookie を失効させます。

なお、一致する Cookie が見つからなくてもエラーは発生しません。一致した Cookie が削除された場合、または一致する Cookie がない場合、返されたプロミスは履行されます。

構文

js
delete(name)
delete(options)

引数

このメソッドは、以下のいずれかが必要です。

name 省略可

Cookie の名前が入っている文字列です。

または

options 省略可

オブジェクトは以下のプロパティを含みます。

name

Cookie の名前が入っている文字列です。

domain 省略可

Cookie のドメインを表す文字列。デフォルトは null です。

path 省略可

パスを含む文字列です。デフォルトは / です。

partitioned 省略可

論理値で、デフォルト値は false です。true に設定すると、削除する Cookie がパーティション化 Cookie であることを表します。詳しくは個別区画化された状態を持つクッキー (CHIPS) を参照してください。

返値

削除が完了したか、一致した Cookie がないと undefined に解決される Promise です。

例外

SecurityError DOMException

オリジンが URL にシリアライズできない場合に発生します。

TypeError

与えられた name や options で表される Cookie の削除に失敗した場合に発生します。

例

この例では、Cookie の名前を delete() メソッドに渡すことで、その Cookie を削除する方法を示しています。

これは、削除対象の Cookie が、上記の options で指定された Cookie 名およびデフォルト値と一致する場合に動作します。 この場合、Cookie が set() を使用して名前と値のみを指定して設定された場合には当てはまりますが、オプションを指定して作成された場合や Document.cookie を使用して作成された場合には当てはまらないことがあります。

このコードでは、まず setTestCookies() を定義しています。この関数は、いくつかのテスト用 Cookie を生成し、その名前をログ出力します。

js
async function setTestCookies() {
  // Set two cookies
  try {
    await cookieStore.set("cookie1", "cookie1-value");
  } catch (error) {
    console.log(`Error setting cookie1: ${error}`);
  }

  try {
    await cookieStore.set("cookie2", "cookie2-value");
  } catch (error) {
    console.log(`Error setting cookie2: ${error}`);
  }

  // Log cookie names
  const cookieNames = (await cookieStore.getAll())
    .map((cookie) => cookie.name)
    .join(" ");
  console.log(`Initial cookies: ${cookieNames}`);
}

cookieTest() メソッドは setTestCookies() を呼び出します。 その後、先ほど作成した "cookie1" を削除し、すべての Cookie 名を再度一覧表示します。

js
async function cookieTest() {
  // Create our test cookies
  await setTestCookies();

  // Delete cookie1
  try {
    await cookieStore.delete("cookie1");
  } catch (error) {
    console.log(`Error deleting cookie1: ${error}`);
  }

  // Log cookie names again (to show cookie1 deleted)
  const cookieNames = (await cookieStore.getAll())
    .map((cookie) => cookie.name)
    .join(" ");
  console.log(
    `Cookies remaining after attempting to delete cookie1: ${cookieNames}`,
  );
}

cookieTest();

実行すると、コンソールログには最初は "cookie1" と "cookie2" の両方が存在することが表示されるはずですが、cookie1 が削除された後には表示されません。

この例は前回の例とほぼ同じですが、削除する Cookie のオプションと一致する必要があることを示している点が異なります。 このコードでは、まず setTestCookies() を定義しています。 これにより、partitioned プロパティが true に設定された 2 つの Cookie が生成され、それらの名前がログに出力されます。

js
async function setTestCookies() {
  // Set two cookies
  try {
    await cookieStore.set({
      name: "cookie1",
      value: `cookie1-value`,
      partitioned: true,
    });
  } catch (error) {
    console.log(`Error setting cookie1: ${error}`);
  }

  try {
    await cookieStore.set({
      name: "cookie2",
      value: `cookie2-value`,
      partitioned: true,
    });
  } catch (error) {
    console.log(`Error setting cookie2: ${error}`);
  }

  // Log cookie names
  const cookieNames = (await cookieStore.getAll())
    .map((cookie) => cookie.name)
    .join(" ");
  console.log(`Initial cookies: ${cookieNames}`);
}

cookieTest() メソッドは setTestCookies() を呼び出します。 その後、名前を指定して "cookie1" という名前付きの Cookie を削除しようと試み、さらに名前と partitioned: true を指定して "cookie2" という名前付きの Cookie を削除しようと試みます。 その後、このメソッドは Cookie の名前を再度一覧表示します。

js
async function cookieTest() {
  // Create our test cookies
  await setTestCookies();

  // Delete cookie1 specifying just the name
  try {
    await cookieStore.delete("cookie1");
  } catch (error) {
    console.log(`Error deleting cookie1: ${error}`);
  }

  // Delete cookie2, setting partitioned to true
  try {
    await cookieStore.delete({
      name: "cookie2",
      partitioned: true,
    });
  } catch (error) {
    console.log(`Error deleting cookie2: ${error}`);
  }

  // Log cookie names again (to show cookie1 deleted)
  cookieNames = (await cookieStore.getAll())
    .map((cookie) => cookie.name)
    .join(" ");
  console.log(
    `Cookies remaining after attempted deletions (cookie2 should be deleted): ${cookieNames}`,
  );
}

cookieTest();

実行すると、コンソールログには、最初は "cookie1" と "cookie2" の両方が存在していることが表示されますが、その後 "cookie2" は掲載されていない状態になります。 "cookie1" という名前付きの Cookie は、delete()の呼び出しで指定された Cookie と一致しないため、まだ存在しています。

メモ: 一致する Cookie がない場合、削除はエラーを返さずに失敗します。

document.cookie を使用して作成された Cookie を削除する場合、CookieStore.set() を使用して作成された Cookie を削除する場合と同じ要件が適用されます。つまり、その Cookie は、渡された options と一致するか、あるいは name とデフォルトのオプションと一致している必要があります。

メモ: set() で作成された Cookie の デフォルトのパス は常に / ですが、document.cookie で作成された Cookie のデフォルトのパスは、それが作成された文書のパスと同じになります。 したがって、document.cookie を使用して作成された Cookie を削除する際、そのパスが / であると想定することはできません（明示的にそのように設定されていない限り）。そのため、デフォルトの delete() オプションと一致するとは限らないのです。

以下のコードでは、document.cookie を使用して、それぞれパス /some_path および / を持つ "doc_cookie1" と "doc_cookie2" という名前付き Cookie を作成し、その後、両方の Cookie をログ出力します。 続いて、path 一致オプションを指定せずに両方の Cookie を削除し、再度 Cookie の一覧を表示します。

js
async function cookieTest() {
  // Create doc_cookie1 with path /some_path
  document.cookie =
    "doc_cookie1=doc_cookie1_name; SameSite=None; Secure; max-age=10; path='/some_path'";

  // Create doc_cookie2 with path / (the CookieStore.set() default)
  document.cookie =
    "doc_cookie2=doc_cookie2_name; SameSite=None; Secure; max-age=10; path=/";

  // Log cookie names
  let cookieNames = (await cookieStore.getAll())
    .map((cookie) => cookie.name)
    .join(" ");
  console.log(`Initial cookies: ${cookieNames}`);

  // Delete doc_cookie1 (should fail)
  try {
    await cookieStore.delete("doc_cookie1");
  } catch (error) {
    console.log(`Error deleting doc_cookie1: ${error}`);
  }

  // Delete doc_cookie2 (should succeed)
  try {
    await cookieStore.delete("doc_cookie2");
  } catch (error) {
    console.log(`Error deleting cookie2: ${error}`);
  }

  // Log cookie names again (to show cookie1 deleted)
  cookieNames = (await cookieStore.getAll())
    .map((cookie) => cookie.name)
    .join(" ");
  console.log(
    `Cookies remaining after attempted deletions (doc_cookie2 should be deleted): ${cookieNames}`,
  );
}

cookieTest();

実行すると、最初のログには両方の Cookie が存在することが表示されるはずです。 2 つ目のログには "doc_cookie2" が含まれていないはずです。これは、一致して削除されたはずだからです。 "doc_cookie1" は含まれているはずです。これは、/some_pathがデフォルトの削除パス（/）と一致しないためです。

仕様書

仕様書
Cookie Store API
# dom-cookiestore-delete

ブラウザーの互換性

MDN の改良に協力

協力方法を知る

このページは MDN の貢献者によって に最終更新されました。

GitHub でこのページを表示 • このコンテンツに関する問題を報告