CacheStorage.has() — Methode · JavaScript-Referenz

Signatur

CacheStorage.prototype.has(cacheName)

Beschreibung

Mit CacheStorage.has() prüfst du, ob unter dem angegebenen Namen bereits ein Cache-Objekt angelegt wurde. Die Methode gibt ein Promise<boolean> zurück. Den Zugriff auf die Instanz bekommst du über das globale caches, das es sowohl im Fenster (window.caches) als auch in Service Workern und Web Workern (self.caches) gibt.

Typische Einsatzfälle sind Service-Worker-Strategien: Du willst beim install- oder activate-Ereignis wissen, ob ein versionierter Cache (z. B. static-v3) schon existiert, bevor du ihn befüllst oder alte Versionen löschst. Nützlich ist die Methode auch für Offline-Funktionen, etwa um in der Oberfläche anzuzeigen, ob Inhalte schon für die Offline-Nutzung gespeichert sind.

Wichtig: has() legt – anders als caches.open() – keinen Cache an. Wer nur prüfen will, ohne Nebenwirkungen, verwendet deshalb has(). Der Vergleich des Namens ist exakt und berücksichtigt Groß- und Kleinschreibung.

Parameter

Name	Typ	Default	Beschreibung
$cacheName Pflicht	string		Name des gesuchten Caches. Nicht-String-Werte werden in einen String umgewandelt. Beim Vergleich wird Groß-/Kleinschreibung beachtet.

Rückgabewert

Typ

Promise<boolean>

Beschreibung

Ein Promise, das mit true erfüllt wird, wenn ein Cache mit diesem Namen existiert, sonst mit false. Kann mit einem SecurityError abgelehnt werden, wenn der Zugriff auf den Speicher nicht erlaubt ist.

Beispiele

Einfache Existenzprüfung

const exists = await caches.has('static-v1');
console.log(exists ? 'Cache vorhanden' : 'Cache fehlt');

Cache fehlt

Service Worker: Cache nur bei Bedarf befüllen

const CACHE_NAME = 'static-v3';
const ASSETS = ['/', '/index.html', '/app.css', '/app.js'];

self.addEventListener('install', (event) => {
  event.waitUntil((async () => {
    if (await caches.has(CACHE_NAME)) {
      console.log(`${CACHE_NAME} existiert bereits – überspringe Precaching`);
      return;
    }
    const cache = await caches.open(CACHE_NAME);
    await cache.addAll(ASSETS);
    console.log(`${CACHE_NAME} befüllt`);
  })());
});

static-v3 befüllt

Offline-Status in der Oberfläche anzeigen

const updateOfflineBadge = async (articleId) => {
  if (!('caches' in window)) return; // Kein Support oder unsicherer Kontext
  const saved = await caches.has(`article-${articleId}`);
  const badge = document.querySelector('#offline-badge');
  badge.textContent = saved ? 'Offline verfügbar' : 'Nur online';
};

updateOfflineBadge(42);

Alte Cache-Version gezielt entfernen

const OLD_CACHE = 'static-v2';

if (await caches.has(OLD_CACHE)) {
  const deleted = await caches.delete(OLD_CACHE);
  console.log('Alter Cache gelöscht:', deleted);
}

Alter Cache gelöscht: true

// Wichtig · Fallstricke

Nur in sicheren Kontexten: caches gibt es nur unter HTTPS oder localhost. Über HTTP ist window.caches undefined, daher vorher mit 'caches' in self prüfen.
Race Conditions: Zwischen has() und einem anschließenden open() oder delete() kann ein anderer Tab oder Worker den Cache ändern. Wenn du den Cache ohnehin brauchst, ruf direkt caches.open() auf. Die Methode legt den Cache bei Bedarf an.
Groß-/Kleinschreibung: 'Static-V1' und 'static-v1' sind verschiedene Caches.
Im privaten Modus mancher Browser (z. B. ältere Firefox-Versionen) kann das Promise mit einem SecurityError abgelehnt werden. Den Aufruf deshalb in try/catch einschließen.
has() sagt nichts über den Inhalt aus: Auch ein leerer Cache ergibt true. Einzelne Einträge prüfst du mit cache.match().

Siehe auch

CacheStorage CacheStorage.open() CacheStorage.delete() CacheStorage.keys() CacheStorage.match() Cache