Navigator.storage — Eigenschaft · JavaScript-Referenz

Signatur

get Navigator.storage

Beschreibung

navigator.storage gibt das einzige StorageManager-Objekt des aktuellen Browsing-Kontexts zurück. Es ist der zentrale Zugang zur Storage API: Damit lässt sich abfragen, wie viel Speicher eine Origin belegt und noch nutzen darf (estimate()). Man kann den Browser außerdem bitten, die Daten dauerhaft aufzubewahren (persist(), persisted()), und mit getDirectory() auf das Origin Private File System (OPFS) zugreifen.

Die Eigenschaft ist sinnvoll für Offline-fähige Web-Apps, PWAs und Anwendungen, die größere Datenmengen in IndexedDB, Cache Storage oder im OPFS ablegen. Bevor Sie große Downloads oder Caches anlegen, sollten Sie prüfen, ob genug Kontingent frei ist. Wichtige Nutzerdaten sollten Sie per persist() vor dem automatischen Löschen schützen, das der Browser bei Speicherknappheit vornimmt.

Die Eigenschaft steht in Fenstern und über WorkerNavigator.storage auch in Web Workern zur Verfügung, allerdings nur in einem sicheren Kontext (HTTPS oder localhost). Fast alle Methoden des StorageManager arbeiten asynchron und geben Promises zurück.

Rückgabewert

Typ

StorageManager

Beschreibung

Das Singleton-StorageManager-Objekt. Jeder Zugriff liefert dieselbe Instanz (navigator.storage === navigator.storage ergibt true).

Beispiele

Belegten und verfügbaren Speicher anzeigen

const zeigeSpeicher = async () => {
  if (!navigator.storage?.estimate) {
    console.log('Storage API nicht verfügbar');
    return;
  }
  const { usage, quota } = await navigator.storage.estimate();
  const mb = (bytes) => (bytes / 1024 / 1024).toFixed(1);
  console.log(`Belegt: ${mb(usage)} MB von ${mb(quota)} MB (${((usage / quota) * 100).toFixed(2)} %)`);
};

zeigeSpeicher();

Belegt: 12.4 MB von 2048.0 MB (0.61 %)

Dauerhafte Speicherung beantragen

const sicherePersistenz = async () => {
  if (!navigator.storage?.persist) return false;

  // Bereits persistent?
  if (await navigator.storage.persisted()) {
    console.log('Speicher ist bereits persistent.');
    return true;
  }

  const gewaehrt = await navigator.storage.persist();
  console.log(gewaehrt
    ? 'Daten werden nicht mehr automatisch gelöscht.'
    : 'Persistenz abgelehnt – Daten können bei Speicherknappheit entfernt werden.');
  return gewaehrt;
};

sicherePersistenz();

Daten werden nicht mehr automatisch gelöscht.

Datei im Origin Private File System schreiben und lesen

const speichereNotiz = async (text) => {
  const root = await navigator.storage.getDirectory();
  const datei = await root.getFileHandle('notiz.txt', { create: true });

  const writable = await datei.createWritable();
  await writable.write(text);
  await writable.close();

  const inhalt = await (await datei.getFile()).text();
  console.log('Gelesen:', inhalt);
};

speichereNotiz('Einkaufen: Milch, Brot');

Gelesen: Einkaufen: Milch, Brot

Vor großem Download freien Platz prüfen

const genugPlatz = async (benoetigteBytes) => {
  const { usage = 0, quota = 0 } = await navigator.storage.estimate();
  return quota - usage > benoetigteBytes;
};

const ladeOfflinePaket = async () => {
  const groesse = 150 * 1024 * 1024; // 150 MB
  if (!(await genugPlatz(groesse))) {
    console.warn('Nicht genug Speicher für das Offline-Paket.');
    return;
  }
  const cache = await caches.open('offline-v1');
  await cache.add('/pakete/karten.bin');
  console.log('Offline-Paket gespeichert.');
};

ladeOfflinePaket();

Offline-Paket gespeichert.

// Wichtig · Fallstricke

Nur in sicheren Kontexten: Über HTTP (außer localhost) ist navigator.storage undefined. Prüfen Sie die Verfügbarkeit daher immer mit optionaler Verkettung (navigator.storage?.estimate).
estimate() liefert nur Näherungswerte: Aus Datenschutzgründen (Schutz vor Fingerprinting) runden oder verschleiern Browser usage und quota. Die Quota entspricht oft nicht dem tatsächlich freien Plattenplatz. Im Inkognito-Modus ist sie meist deutlich kleiner.
Persistenz ist nicht garantiert: Ob persist() gewährt wird, hängt vom Browser ab. Chrome entscheidet anhand von Heuristiken wie Lesezeichen, installierter PWA oder erteilten Benachrichtigungsrechten, Firefox fragt den Nutzer. Safari löscht Daten nicht installierter Seiten unter Umständen nach 7 Tagen ohne Interaktion.
Kompatibilität: estimate() und persist() werden breit unterstützt. getDirectory() (OPFS) gibt es erst in neueren Versionen (Chrome 86+, Firefox 111+, Safari 15.2+). createWritable() fehlt in Safari teilweise, dort kommt im Worker createSyncAccessHandle() zum Einsatz.
Die Eigenschaft ist schreibgeschützt: Zuweisungen wie navigator.storage = … werden stillschweigend ignoriert, im Strict Mode lösen sie einen TypeError aus.

Siehe auch

StorageManager StorageManager.estimate() StorageManager.persist() StorageManager.persisted() StorageManager.getDirectory() Navigator