suchen

Heim >Web-Frontend >js-Tutorial >So laden Sie Blob-Dateien mit dem Ajax von jQuery herunter

So laden Sie Blob-Dateien mit dem Ajax von jQuery herunter

不言
不言Original
2018-07-02 17:08:595009Durchsuche

Dieser Artikel stellt hauptsächlich die relevanten Informationen zum Herunterladen von Blob-Dateien mit jQuery vor. Er ist sehr gut und hat Referenzwert.

Es klingt auf den ersten Blick etwas verwirrend Ich habe zuvor auch ng und React verwendet, als ich daran gearbeitet habe, aber es lief sehr reibungslos (daher habe ich die spezifischen Details vergessen). Warum funktioniert JQuery nicht? Nachdem ich mir das spezifische Szenario angesehen hatte, stellte ich fest, dass der Ajax-Rückruf von jq die Antwortdaten auf narrensichere Weise in einem Zeichenfolgenformat analysiert hatte.

Ich habe gg überprüft und festgestellt, dass die inländische Lösung in diesem Szenario nicht darin besteht, jq zu verwenden, sondern XMLHttpRequest manuell selbst zu erstellen. Obwohl diese Methode sehr zuverlässig ist, kann das zuvor gekapselte jq-Ajax nicht verwendet werden.

Ich habe die Dokumentation von jq überprüft und geplant, den Datentyp selbst auf der Grundlage der von jq bereitgestellten jQuery.ajaxSetup()-Schnittstelle zu erweitern, konnte es aber nicht herausfinden. Später fand ich auf Github ein von Daniel gepacktes JQ-Plug-In.

Dann können wir so schreiben: 

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>blob demo</title>
</head>
<body>
<img id="img" src="" />
<script src="//cdn.bootcss.com/jquery/2.2.1/jquery.js" charset="utf-8"></script>
<script src="jquery-ajax-blob-arraybuffer.js"></script>
<script type="text/javascript">
$.ajax({
url: "./face.jpg",
type: "get",
dataType: "blob", //扩展出了blob类型
}).done(function(data, status, jqXHR){
var reader = new window.FileReader();
reader.readAsDataURL(data);
reader.onloadend = function() {
document.getElementById("img").src=reader.result;
}
}).fail(function(jqXHR, textStatus) {
console.warn(textStatus);
});
</script>
</body>
</html>

Dem Quellcode des Plug-Ins nach zu urteilen, wird jedoch auch manuell ein erstellt XMLHttpRequest-Objekt zum Senden von Ajax, aber die Kompatibilität kann ein Problem sein. Wenn Sie mehr erfahren möchten, können Sie hier lesen.

Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, er wird für das Studium aller hilfreich sein. Weitere verwandte Inhalte finden Sie auf der chinesischen PHP-Website.

Verwandte Empfehlungen:

Native JS-Schreibfunktion für Ajax-Anforderungsfunktionen

Einführung in die Verwendung des asynchronen Datei-Uploads von ajaxFileUpload

Das obige ist der detaillierte Inhalt vonSo laden Sie Blob-Dateien mit dem Ajax von jQuery herunter. 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
Vorheriger Artikel：Einführung in die Get- und Post-Methoden auf Basis von js native und ajax sowie in die native Schreibmethode von jsonpNächster Artikel：Einführung in die Get- und Post-Methoden auf Basis von js native und ajax sowie in die native Schreibmethode von jsonp

In Verbindung stehende Artikel

Mehr sehen