Wie kann ich mithilfe von JavaScript zuverlässig eine PDF-Datei aus einer Webdienstantwort über verschiedene Browser hinweg herunterladen?

Erstellen von PDF-Dokumenten aus Webdienst-Antworten in JavaScript

Das Erstellen von PDF-Dokumenten aus von Webdiensten zurückgegebenen Binärzeichenfolgen stellt eine browserübergreifende Herausforderung dar. Die data-uri-Methode ist zwar in bestimmten Browsern wie Chrome und Opera effektiv, greift jedoch in IE9 und Firefox zu kurz.

Alternativer Ansatz: Clientseitiger Dateidownload

Zu Um diese Einschränkungen zu überwinden, besteht ein alternativer Ansatz darin, PDF-Dateien im Dateisystem zum Herunterladen durch den Benutzer zu erstellen. Um dies zu erreichen, berücksichtigen Sie Folgendes:

Antworttyp auf Blob festlegen

Konfigurieren Sie die Eigenschaft „responseType“ des XMLHttpRequest-Objekts auf „blob“ anstelle von „text“. Dadurch kann der Client die PDF-Daten als Blob-Objekt empfangen.

Verwendung des Blob-Objekts

Erstellen Sie ein neues Blob-Objekt mit der von der Webdienstanforderung erhaltenen Antwort .

Generieren einer Objekt-URL

Generieren Sie eine Objekt-URL für das Blob-Objekt, das die PDF-Datei darstellt.

Erstellen eines Downloads Link

Erstellen Sie ein HTML--Element und legen Sie dessen href- und Download-Attribute fest. Das href-Attribut sollte auf die Objekt-URL verweisen, während das Download-Attribut den Dateinamen angibt.

Auslösen des Downloads

Fügen Sie das -Element an den Dokumenttext an und klicken Sie darauf, um den Dateidownload zu starten.

Beispielcode

Der folgende JavaScript-Code demonstriert diesen Ansatz:

<code class="javascript">var request = new XMLHttpRequest();
request.open("GET", "/path/to/pdf", true);
request.responseType = "blob";
request.onload = function (e) {
    if (this.status === 200) {
        // Generate .pdf name as `Blob` from `this.response`
        var file = window.URL.createObjectURL(this.response);
        var a = document.createElement("a");
        a.href = file;
        a.download = this.response.name || "detailPDF";
        document.body.appendChild(a);
        a.click();
        // Remove `a` after `Save As` dialog
        window.onfocus = function () {
            document.body.removeChild(a);
        };
    };
};
request.send();</code>

Diese Methode stellt sicher ein zuverlässiger Datei-Download über mehrere Browser hinweg, einschließlich IE9, Firefox, Chrome, Opera und Safari.

Das obige ist der detaillierte Inhalt vonWie kann ich mithilfe von JavaScript zuverlässig eine PDF-Datei aus einer Webdienstantwort über verschiedene Browser hinweg herunterladen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!