Warum können Sie jQuery.ajax nicht verwenden, um Bilder als Blobs abzurufen?

Verwenden von XMLHttpRequest zum Abrufen von Bildern als Blobs

Sie versuchen, ein Bild mit jQuery.get abzurufen, es in einem Blob zu speichern und es auf einen anderen Server hochzuladen. Die Nichtübereinstimmung der Datentypen führt jedoch dazu, dass die Bilder beschädigt werden.

Warum können Sie jQuery Ajax nicht verwenden, um Bilder als Blobs abzurufen?

jQuery.ajax unterstützt nicht das Abrufen von Bildern als Blobs.

Lösung

Um ein Bild als Blob abzurufen, müssen Sie natives XMLHttpRequest verwenden:

var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function(){
    if (this.readyState == 4 && this.status == 200){
        //this.response is what you're looking for
        handler(this.response);
        console.log(this.response, typeof this.response);
        var img = document.getElementById('img');
        var url = window.URL || window.webkitURL;
        img.src = url.createObjectURL(this.response);
    }
}
xhr.open('GET', 'http://jsfiddle.net/img/logo.png');
xhr.responseType = 'blob';
xhr.send();      

Update für jQuery 3

Ab jQuery 3 ist es möglich, Bilder als abzurufen Blobs mit jQuery.ajax:

jQuery.ajax({
        url:'https://images.unsplash.com/photo-1465101108990-e5eac17cf76d?ixlib=rb-0.3.5&q=85&fm=jpg&crop=entropy&cs=srgb&ixid=eyJhcHBfaWQiOjE0NTg5fQ%3D%3D&s=471ae675a6140db97fea32b55781479e',
        cache:false,
        xhr:function(){// Seems like the only way to get access to the xhr object
            var xhr = new XMLHttpRequest();
            xhr.responseType= 'blob'
            return xhr;
        },
        success: function(data){
            var img = document.getElementById('img');
            var url = window.URL || window.webkitURL;
            img.src = url.createObjectURL(data);
        },
        error:function(){
            
        }
    });

Das obige ist der detaillierte Inhalt vonWarum können Sie jQuery.ajax nicht verwenden, um Bilder als Blobs abzurufen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!