Heim >Web-Frontend >js-Tutorial >Wie kann ich den Dateinamen beim Herunterladen von Blobs in JavaScript steuern?

Wie kann ich den Dateinamen beim Herunterladen von Blobs in JavaScript steuern?

DDD
DDDOriginal
2024-12-09 12:23:14807Durchsuche

How Can I Control the Filename When Downloading Blobs in JavaScript?

Benutzerdefinierter Dateiname für Blob-Downloads in JavaScript

Beim erzwungenen Herunterladen einer Blob-Datei über window.location kann der zugewiesene Dateiname eine zufällige Zeichenfolge sein . Um diesen Dateinamen anzupassen, wird eine Problemumgehung mit einem versteckten Element verwendet.

Implementierung

FileSaver.js bietet einen Ansatz, der Folgendes umfasst:

  1. Erstellen eines versteckten Element.
  2. Festlegen seines href-Attributs auf die URL des Blobs.
  3. Festlegen seines Download-Attributs auf den gewünschten Dateinamen.
  4. Klicken auf Element.

Beispiel

Das folgende vereinfachte Beispiel veranschaulicht die Technik:

var saveData = (function () {
  var a = document.createElement("a");
  document.body.appendChild(a);
  a.style = "display: none";
  return function (data, fileName) {
    var json = JSON.stringify(data),
      blob = new Blob([json], { type: "octet/stream" }),
      url = window.URL.createObjectURL(blob);
    a.href = url;
    a.download = fileName;
    a.click();
    window.URL.revokeObjectURL(url);
  };
}());

var data = { x: 42, s: "hello, world", d: new Date() },
  fileName = "my-download.json";

saveData(data, fileName);

Notizen

  • Ältere Browser unterstützen den Download möglicherweise nicht Attribut.
  • Bestimmte Dateiformate können als unsicher gelten und Downloadfehler auslösen. Es wird empfohlen, JSON-Dateien mit der Erweiterung .txt zu speichern.

Das obige ist der detaillierte Inhalt vonWie kann ich den Dateinamen beim Herunterladen von Blobs in JavaScript steuern?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn