Start · Sprachen · JavaScript · Referenz · StorageAccessHandle.revokeObjectURL()

StorageAccessHandle.revokeObjectURL()

Methode

Gibt eine Blob-URL frei, die zuvor über <code>StorageAccessHandle.createObjectURL()</code> im nicht partitionierten Speicherbereich erzeugt wurde.

seit JavaScript Chromium 125+ (Storage Access API, nicht Baseline) Kategorie: webapi

Signatur

StorageAccessHandle.prototype.revokeObjectURL(url)

Beschreibung

revokeObjectURL() ist die nicht partitionierte Variante von URL.revokeObjectURL(). Die Methode gehört zum StorageAccessHandle. Dieses Objekt erhält ein eingebettetes Drittanbieter-Dokument (z. B. ein <iframe>) von document.requestStorageAccess(), wenn es dabei ein Optionsobjekt übergibt. Damit wird eine Blob-URL ungültig, die zuvor mit handle.createObjectURL() im nicht partitionierten Blob-URL-Speicher der Herkunft (Origin) registriert wurde.

Hintergrund: Moderne Browser partitionieren den Speicher von Drittanbieter-Kontexten nach der obersten Website. Eine Blob-URL, die ein eingebettetes Widget mit dem normalen URL.createObjectURL() erzeugt, ist deshalb nur innerhalb dieser Partition gültig. Über den StorageAccessHandle lassen sich Blob-URLs über Partitionsgrenzen hinweg teilen, zum Beispiel mit einem Tab, in dem die Website als Hauptdokument geöffnet ist. Diese URLs müssen dann auch über denselben Handle wieder freigegeben werden.

Rufe revokeObjectURL() auf, sobald die Blob-URL nicht mehr gebraucht wird. Erst dann kann der Browser den zugehörigen Blob bzw. die File aus dem Speicher entfernen. Die Methode muss beim Aufruf von requestStorageAccess() ausdrücklich angefordert werden, entweder mit { revokeObjectURL: true } oder mit { all: true }.

Parameter

Name Typ Default Beschreibung
$url Pflicht string Die freizugebende Blob-URL (blob:https://…). Sie wurde zuvor mit StorageAccessHandle.createObjectURL() erzeugt.

Rückgabewert

Typ
undefined
Beschreibung
Kein Rückgabewert (undefined).

Beispiele

Zugriff anfordern, Blob-URL erzeugen und wieder freigeben

// Läuft in einem Drittanbieter-iframe, ausgelöst durch eine Nutzeraktion
const button = document.querySelector('#share');

button.addEventListener('click', async () => {
  const handle = await document.requestStorageAccess({
    createObjectURL: true,
    revokeObjectURL: true,
  });

  const blob = new Blob(['Hallo aus dem Widget'], { type: 'text/plain' });
  const url = handle.createObjectURL(blob);
  console.log('Nicht partitionierte URL:', url.startsWith('blob:'));

  // ... URL nutzen, z. B. per BroadcastChannel teilen ...

  handle.revokeObjectURL(url);
  console.log('URL freigegeben');
});
Nicht partitionierte URL: true URL freigegeben

Blob-URL mit einem anderen Kontext teilen und danach aufräumen

const shareFile = async (file) => {
  const handle = await document.requestStorageAccess({ all: true });
  const url = handle.createObjectURL(file);

  // Nicht partitionierter BroadcastChannel über denselben Handle
  const channel = handle.BroadcastChannel('uploads');
  channel.postMessage({ type: 'file', url });

  // Warten, bis der Empfänger bestätigt, dann freigeben
  channel.addEventListener('message', (event) => {
    if (event.data?.type === 'received' && event.data.url === url) {
      handle.revokeObjectURL(url);
      channel.close();
      console.log('Datei übertragen, URL freigegeben');
    }
  });
};
Datei übertragen, URL freigegeben

Aufruf mit Feature-Erkennung und Rückfall

const releaseUrl = (handle, url) => {
  if (handle && typeof handle.revokeObjectURL === 'function') {
    try {
      handle.revokeObjectURL(url);
      return 'unpartitioniert freigegeben';
    } catch (err) {
      // z. B. wenn revokeObjectURL nicht angefordert wurde
      console.warn(err.name);
    }
  }
  URL.revokeObjectURL(url); // partitionierte Variante
  return 'partitioniert freigegeben';
};

console.log(releaseUrl(null, URL.createObjectURL(new Blob(['x']))));
partitioniert freigegeben

// Wichtig · Fallstricke

  • Anforderung erforderlich: Wurde revokeObjectURL (oder all) beim Aufruf von requestStorageAccess() nicht angefordert, wirft die Methode eine DOMException (in Chromium SecurityError). Wird nur createObjectURL angefordert, kann der Kontext die erzeugten URLs selbst nicht mehr freigeben. Deshalb immer beide Optionen zusammen anfordern.
  • Nicht mit URL.revokeObjectURL() verwechseln: Die globale Methode wirkt nur auf den partitionierten Blob-URL-Speicher. Eine URL aus handle.createObjectURL() wird damit nicht zuverlässig freigegeben, und umgekehrt genauso.
  • Speicherlecks: Nicht freigegebene Blob-URLs halten den Blob im Speicher, bis das Dokument entladen wird. Unbekannte oder bereits freigegebene URLs werden stillschweigend ignoriert.
  • Nutzeraktion und Berechtigung: requestStorageAccess() braucht in der Regel eine Nutzeraktion (transient activation) und kann abgelehnt werden. Fange die Ablehnung des Promise immer ab.
  • Kompatibilität: Die erweiterten Storage-Access-Optionen (StorageAccessHandle) gibt es derzeit nur in Chromium-Browsern ab Version 125. Firefox und Safari unterstützen nur die cookie-bezogene Storage Access API. Verwende deshalb Feature-Erkennung.