Wie kann ich mit Ajax einen Dateidownload auslösen, ohne die Benutzerinteraktion zu unterbrechen?

Datei-Download mit Ajax aktivieren

Im Zeitalter der asynchronen Programmierung ist es oft notwendig, eine Datei herunterzuladen, ohne die Benutzerinteraktion zu unterbrechen. In dieser Frage wird untersucht, wie eine Datei mit Ajax heruntergeladen wird, während der Benutzer aufgefordert wird, die Datei lokal zu speichern.

In der bereitgestellten Struts2-Aktion kann eine Datei mithilfe eines Stream-Ergebnisses heruntergeladen werden. Wenn Sie jedoch mit jQuery direkt in diese Aktion posten, wird die Datei im Browser als Binärstream gerendert. Um das Datei-Download-Fenster auszulösen, ist ein anderer Ansatz erforderlich.

Moderne Browser-Lösung

Moderne Browser bieten eine einfachere Lösung. Mit der fetch()-API können Sie die Datei als Blob abrufen und eine temporäre URL zum Herunterladen erstellen.

fetch('https://jsonplaceholder.typicode.com/todos/1')
  .then(resp => resp.blob())
  .then(blob => {
    const url = window.URL.createObjectURL(blob);
    const a = document.createElement('a');
    a.style.display = 'none';
    a.href = url;
    // Set the download filename
    a.download = 'todo-1.json';
    document.body.appendChild(a);
    a.click();
    window.URL.revokeObjectURL(url);
    alert('File download complete!');
  })
  .catch(() => alert('File download failed!'));

Dieser Ansatz erfordert einen modernen Browser mit Unterstützung für die fetch()-API und createObjectURL() Methode.

Das obige ist der detaillierte Inhalt vonWie kann ich mit Ajax einen Dateidownload auslösen, ohne die Benutzerinteraktion zu unterbrechen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!