XHR + dati URI non funziona in Safari

Question

Io uso XMLHttpRequest per generare Blob dai dati URI utilizzando questo codice:

function dataUrlToBlob(dataUrl, callback) { 
    var xhr = new XMLHttpRequest; 
    xhr.open('GET', dataUrl); 
    xhr.responseType = 'arraybuffer'; 
    xhr.onload = function(e) { 
     callback(new Blob([this.response], {type: 'image/png'})); 
    }; 
    xhr.send(); 
} 

Usage:

dataUrlToBlob('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAC0lEQVQIW2NkAAIAAAoAAggA9GkAAAAASUVORK5CYII=', callback); 

Tutto funziona bene in tutti i browser tranne Safari . Genera un tale errore:

[Error] XMLHttpRequest cannot load data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAC0lEQVQIW2NkAAIAAAoAAggA9GkAAAAASUVORK5CYII=. Cross origin requests are only supported for HTTP.

La domanda è: ci sono dei modi per far funzionare questo approccio in Safari?

Answer 1

Perché dovresti usare un XHR per farlo? Fallo in modo sincrono (risposta presa da here):

function dataURItoBlob(dataURI) { 
    if(typeof dataURI !== 'string'){ 
     throw new Error('Invalid argument: dataURI must be a string'); 
    } 
    dataURI = dataURI.split(','); 
    var type = dataURI[0].split(':')[1].split(';')[0], 
     byteString = atob(dataURI[1]), 
     byteStringLength = byteString.length, 
     arrayBuffer = new ArrayBuffer(byteStringLength), 
     intArray = new Uint8Array(arrayBuffer); 
    for (var i = 0; i < byteStringLength; i++) { 
     intArray[i] = byteString.charCodeAt(i); 
    } 
    return new Blob([intArray], { 
     type: type 
    }); 
}