CookieStore.delete() — Methode · JavaScript-Referenz

Signatur

CookieStore.prototype.delete(name) | CookieStore.prototype.delete(options)

Beschreibung

Mit cookieStore.delete() löschen Sie ein Cookie über die asynchrone Cookie Store API. Sie ist die moderne Alternative dazu, document.cookie ein abgelaufenes Datum zuzuweisen. Die Methode blockiert den Hauptthread nicht und gibt ein Promise zurück. Es wird erfüllt, sobald das Cookie gelöscht ist.

Sie können die Methode auf zwei Arten aufrufen:

mit einem Namen als Zeichenkette
mit einem options-Objekt mit name, domain, path und partitioned

Das options-Objekt brauchen Sie, wenn das Cookie mit einer eigenen domain oder einem eigenen path gesetzt wurde. Browser erkennen ein Cookie am Namen zusammen mit Domain, Pfad und Partitionierung. Stimmen diese Angaben nicht überein, wird nichts gelöscht.

Die Methode gibt es im Fenster über window.cookieStore und in Service Workern über self.cookieStore. So kann auch ein Service Worker Cookies aufräumen, zum Beispiel beim Abmelden. Andere Tabs und Service Worker bekommen die Löschung über das change-Event mit.

Parameter

Name	Typ	Default	Beschreibung
$name	string		Name des Cookies, das gelöscht werden soll. Alternative zu `options`.
$options	object		Objekt, das festlegt, welches Cookie gelöscht wird: `name` (`string`): Name des Cookies, Pflicht. `domain` (`string \| null`): Domain des Cookies, Standard `null`. `path` (`string`): Pfad des Cookies, Standard `"/"`. `partitioned` (`boolean`): `true`, wenn ein partitioniertes Cookie (CHIPS) gelöscht werden soll, Standard `false`.

Rückgabewert

Typ

Promise<undefined>

Beschreibung

Ein Promise, das mit undefined erfüllt wird, sobald der Löschvorgang abgeschlossen ist. Das gilt auch, wenn gar kein passendes Cookie existierte.

Beispiele

Cookie über den Namen löschen

const removeTheme = async () => {
  try {
    await cookieStore.delete('theme');
    console.log('Cookie "theme" gelöscht');
  } catch (err) {
    console.error('Löschen fehlgeschlagen:', err);
  }
};

removeTheme();

Cookie "theme" gelöscht

Cookie mit eigenem Pfad und eigener Domain löschen

// Gesetzt wurde es so:
// await cookieStore.set({ name: 'session', value: 'abc', domain: 'example.com', path: '/app' });

await cookieStore.delete({
  name: 'session',
  domain: 'example.com',
  path: '/app'
});

const cookie = await cookieStore.get({ name: 'session', url: 'https://example.com/app' });
console.log(cookie); // null, wenn erfolgreich gelöscht

null

Beim Abmelden alle Cookies löschen, mit Rückfalllösung

const logout = async () => {
  if ('cookieStore' in window) {
    const cookies = await cookieStore.getAll();
    await Promise.all(cookies.map(({ name }) => cookieStore.delete(name)));
  } else {
    // Rückfalllösung für Browser ohne Cookie Store API
    document.cookie.split(';').forEach((c) => {
      const name = c.split('=')[0].trim();
      document.cookie = `${name}=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/`;
    });
  }
  console.log('Abgemeldet, Cookies entfernt');
};

logout();

Abgemeldet, Cookies entfernt

Löschungen im change-Event beobachten

cookieStore.addEventListener('change', (event) => {
  for (const cookie of event.deleted) {
    console.log(`Gelöscht: ${cookie.name}`);
  }
});

await cookieStore.set('tracking', 'on');
await cookieStore.delete('tracking');

Gelöscht: tracking

// Wichtig · Fallstricke

Domain und Pfad müssen übereinstimmen: Wurde ein Cookie mit path: '/app' gesetzt, löscht delete('name') es nicht, denn dabei wird standardmäßig path: '/' verwendet. Geben Sie dieselbe domain und denselben path an wie beim Setzen.
HttpOnly-Cookies: Cookies mit dem Attribut HttpOnly sind für JavaScript nicht erreichbar und lassen sich mit dieser Methode nicht löschen. Das muss der Server erledigen, über Set-Cookie mit abgelaufenem Datum.
Kein Fehler, wenn nichts gefunden wird: Das Promise wird auch erfüllt, wenn es kein passendes Cookie gab. Prüfen Sie bei Bedarf danach mit cookieStore.get().
Ablehnung mit TypeError, zum Beispiel wenn der Name fehlt oder die domain nicht zur aktuellen Seite passt. Bei einem Ursprung wie data: oder einer anderen undurchsichtigen Herkunft lautet der Fehler SecurityError.
Nur sichere Kontexte: Die API gibt es ausschließlich unter HTTPS bzw. localhost.
Browser-Kompatibilität: Chromium-Browser unterstützen die API seit Version 87, Safari seit 18.4 und Firefox seit 140. Für ältere Browser prüfen Sie vorher mit 'cookieStore' in window und greifen sonst auf document.cookie zurück.
Partitionierte Cookies (CHIPS) lassen sich nur mit partitioned: true gezielt löschen.

Siehe auch

CookieStore CookieStore.set() CookieStore.get() CookieStore.getAll() Document.cookie ContentIndex.delete()