Chrome va in crash quando URI è troppo lungo

Question

sto facendo una funzione di esportazione a un HTML5 gioco di mine e il mio metodo di risparmio di corrente è una serializzazione grezza dei dati di gioco e poi:

// this is Javascript 
var gameData = "abc"; // this is actually a HUGE string of over 2MB 
try 
{ 
    document.location = "data:text/octet-stream,"+encodeURIComponent(JSON.stringify(gameData)); 
} 
catch(e) 
{ 
    console.log(e); 
} 

Da: Using HTML5/Javascript to generate and save a file

Non mi dispiace il fatto che non posso usarlo per le grandi stringhe, ma mi piacerebbe che generasse un avviso che informa che questo metodo non funziona, sfortunatamente Chrome (16) si blocca senza catturare quell'eccezione .

Esiste un modo migliore per implementare questo tipo di esportazione, l'importante per me è farlo funzionare localmente. FileAPI sarebbe una soluzione migliore, ma non funziona localmente.

Answer 1

AFAIK non possibile lato client; ma un file di 1,99 MB può essere salvato in questo modo in Chrome; forse dovresti provare a comprimere/ottimizzare i dati del tuo gioco un po '. Un modo per farlo è usare JSZip.

Al fine di verificare se il browser corrente è Google Chrome e così il metodo non funziona con stringhe lunghe si può usare qualcosa di simile:

if(gameData.length > 1999999 && window.chrome){ 
    alert("Sorry, this export method does not work in Google Chrome") 
    return; 
} 

Answer 2

Suppongo che il JSON.stringify sta lavorando Ma che win.location fallisce a causa del fatto che l'URI è troppo grande.

Che cosa si può fare è quello di convertire i uri ad un blob, e poi

URL.createObjectURL(file) 

questo modo si crea un URL che puntano a un oggetto interno (interno al browser).

E funzionerà come previsto.

Ecco un metodo per convertire dataURI a blob

function(dataURI) { 
    // convert base64 to raw binary data held in a string 
    // doesn't handle URLEncoded DataURIs 
    var byteString; 
    if (dataURI.split(',')[0].indexOf('base64') >= 0) 
     byteString = atob(dataURI.split(',')[1]); 
    else 
     byteString = unescape(dataURI.split(',')[1]); 
    // separate out the mime component 
    var mimeString = dataURI.split(',')[0].split(':')[1].split(';')[0]; 

    // write the bytes of the string to an ArrayBuffer 
    var ab = new ArrayBuffer(byteString.length); 
    var ia = new Uint8Array(ab); 
    for (var i = 0; i < byteString.length; i++) { 
     ia[i] = byteString.charCodeAt(i); 
    } 

    // write the ArrayBuffer to a blob, and you're done 
    return new Blob([ab],{type: mimeString}); 
} 

}