Wie gehe ich mit herunterladbaren Dateien in JavaScript/jQuery mithilfe von AJAX-Anfragen um?

Herunterladen von Dateien per POST mit JSON-Daten in JavaScript/jQuery

Szenario:

Sie haben eine einseitige Webanwendung das über AJAX-Aufrufe mit einem RESTful-Webdienst kommuniziert. Sie müssen:

• Eine POST-Anfrage mit JSON-Daten an eine REST-URL senden.
• JSON zurückgeben, wenn die Anfrage eine JSON-Antwort angibt.
• Ein herunterladbares Dokument zurückgeben Binärdatei, wenn die Anfrage eine binäre Antwort angibt (z. B. PDF, XLS).

Problem:

Wie man herunterladbare Dateien im Client-JavaScript-Code behandelt bei Verwendung von AJAX-Aufrufen?

Lösung:

Während der bereitgestellte Code JSON-Antworten erfolgreich verarbeitet, ist es aufgrund von Einschränkungen im Datentyp nicht direkt möglich, Dateien mithilfe von AJAX-Anfragen herunterzuladen Option. Es können jedoch alternative Ansätze gewählt werden:

Methode 1: Dateien auf dem Server generieren und speichern

• Stellen Sie eine AJAX-Anfrage, um die Binärdatei zu generieren, und geben Sie eine zurück JSON-Antwort mit einer URL zur Datei.
• Im AJAX-Erfolgshandler leiten Sie den Browser mithilfe von window.location.href zur URL um, um die Datei herunterzuladen.

Vorteile:

• Zentralisierte Dateiverwaltung auf dem Server.

Nachteile:

• Erfordert mehrere AJAX Aufrufe.
• Zusätzlicher Dateiverwaltungsaufwand auf dem Server.

Methode 2: Erstellen eines Iframes

• Führen Sie eine POST-Anfrage aus zu /create_binary_file.php mit den JSON-Daten.
• Erstellen Sie einen iframe und setzen Sie sein src-Attribut auf die Antwort der POST-Anfrage, die voraussichtlich die URL der herunterladbaren Datei enthält.
• Fügen Sie den Iframe mit document.body.appendChild() oder $.body.append() von jQuery zur Seite hinzu.

Vorteile:

• Fördert die Benutzerinteraktion zum Herunterladen der Datei.
• Keine zusätzliche Dateiverwaltung auf dem Server.

Nachteile:

• Änderung erforderlich das DOM.

Überlegungen:

• Methode 1 erfordert mehr Server-Overhead, ermöglicht aber mehr Kontrolle und Dateiverwaltung.
• Methode 2 kann einfacher sein, erfordert jedoch eine Änderung des DOM und ist möglicherweise nicht für komplexe Seiten geeignet.
• Der Server muss über die entsprechende MIME-Typkonfiguration verfügen, um das Herunterladen von Binärdateien zu erleichtern.

Das obige ist der detaillierte Inhalt vonWie gehe ich mit herunterladbaren Dateien in JavaScript/jQuery mithilfe von AJAX-Anfragen um?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!