Window: showSaveFilePicker() Methode

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Sicherer Kontext: Diese Funktion ist nur in sicheren Kontexten (HTTPS) in einigen oder allen unterstützenden Browsern verfügbar.

Experimentell: Dies ist eine experimentelle Technologie
Überprüfen Sie die Browser-Kompatibilitätstabelle sorgfältig vor der Verwendung auf produktiven Webseiten.

Die showSaveFilePicker()-Methode der Window-Schnittstelle zeigt einen Dateiauswahldialog an, der es einem Nutzer ermöglicht, eine Datei zu speichern. Dies kann durch die Auswahl einer vorhandenen Datei oder die Eingabe eines Namens für eine neue Datei erfolgen.

Syntax

js
showSaveFilePicker()

Parameter

options Optional

Ein Objekt, das Optionen enthält, die wie folgt aussehen:

excludeAcceptAllOption Optional

Ein boolescher Wert, der standardmäßig auf false gesetzt ist. Standardmäßig sollte der Auswahldialog eine Option enthalten, um keine Dateityp-Filter anzuwenden (initiiert durch die unten stehende Typoption). Wenn diese Option auf true gesetzt ist, ist diese Option nicht verfügbar.

id Optional

Durch die Angabe einer ID kann der Browser für verschiedene IDs unterschiedliche Verzeichnisse speichern. Wenn dieselbe ID für einen anderen Auswahldialog verwendet wird, öffnet sich der Dialog im gleichen Verzeichnis.

startIn Optional

Ein FileSystemHandle oder ein bekanntes Verzeichnis ("desktop", "documents", "downloads", "music", "pictures" oder "videos") zum Öffnen des Dialogs in diesem Verzeichnis.

suggestedName Optional

Ein String. Der vorgeschlagene Dateiname.

types Optional

Ein Array von zulässigen Dateitypen zum Speichern. Jedes Element ist ein Objekt mit den folgenden Optionen:

description Optional

Eine optionale Beschreibung der Kategorie der erlaubten Dateitypen. Standardmäßig ist dieser Wert leer.

accept

Ein Object mit den Schlüsseln, die auf den MIME-Typ gesetzt sind, und den Werten als Array von Dateierweiterungen (siehe unten für ein Beispiel).

Rückgabewert

Ein Promise, dessen Erfüllungs-Handler ein FileSystemFileHandle-Objekt erhält.

Ausnahmen

AbortError DOMException

Wird ausgelöst, wenn der Nutzer den Dateiauswahldialog schließt, ohne eine Datei auszuwählen oder einzugeben, oder wenn der Benutzeragent ausgewählte Dateien als zu sensibel oder gefährlich erachtet.

SecurityError DOMException

Wird ausgelöst, wenn der Aufruf durch die Same-Origin-Policy blockiert wurde oder er nicht durch eine Nutzerinteraktion wie das Drücken eines Buttons initiiert wurde.

TypeError

Wird ausgelöst, wenn Akzeptanztypen nicht verarbeitet werden können. Dies kann unter folgenden Umständen passieren:

  • Jeder Schlüsselstring der accept-Optionen eines Elements in den types-Optionen kann keinen gültigen MIME-Typ parsen.
  • Jeder Werte-String in den accept-Optionen eines Elements in den types-Optionen ist ungültig, z. B., wenn er nicht mit . beginnt und mit . endet oder wenn er ungültige Zeichen enthält und seine Länge mehr als 16 beträgt.
  • Die types-Optionen sind leer und die excludeAcceptAllOption-Option ist auf true gesetzt.

Sicherheit

Vorübergehende Nutzeraktivierung ist erforderlich. Der Nutzer muss mit der Seite oder einem UI-Element interagieren, damit diese Funktion funktioniert.

Beispiele

Die folgende Funktion zeigt einen Dateiauswahldialog an, bei dem Textdateien zur Auswahl hervorgehoben werden.

js
async function getNewFileHandle() {
  const opts = {
    types: [
      {
        description: "Text file",
        accept: { "text/plain": [".txt"] },
      },
    ],
  };
  return await window.showSaveFilePicker(opts);
}

Spezifikationen

Specification
File System Access
# api-showsavefilepicker

Browser-Kompatibilität

Siehe auch