web-dev-qa-db-fra.com

Javascript: l'exportation de gros fichiers texte / csv bloque Google Chrome

J'ai le code Javascript suivant pour exporter le fichier CSV du côté client. Cependant, Google Chrome se bloque chaque fois que j'essaie d'exporter un grand tableau. Quelle est la limite de la chaîne de données autorisée dans Chrome? Est-il possible qu'elle atteigne la limite de mémoire autorisée dans Chrome? Si la chaîne de données est trop longue pour Chrome, comment vais-je procéder pour exporter de gros fichiers CSV côté client?

var csvRows = [...]; //Array with 40000 items, each item is 100 characters long.

var csvString = csvRows.join("\r\n");

var a = document.createElement('a');

a.href        = 'data:text/csv;charset=utf-8,' + encodeURIComponent(csvString);
a.target      = '_blank';
a.download    = 'export.csv';

document.body.appendChild(a);
a.click();

(La taille de fichier attendue est d'environ 6,4 Mo)

javascriptcsvexport
34
Ben Wong

eu le même problème et l'a résolu en utilisant Blob .

Par exemple:

csvData = new Blob([csvString], { type: 'text/csv' }); 
var csvUrl = URL.createObjectURL(csvData);
a.href =  csvUrl;

Source: https://stackoverflow.com/a/24611096/3048937

57
jan

J'ai utilisé la fonction suivante pour télécharger CSV. A travaillé pour moi dans IE/Firefox/Chrome

function downloadFile(data, fileName) {
        var csvData = data;
        var blob = new Blob([ csvData ], {
            type : "application/csv;charset=utf-8;"
        });

        if (window.navigator.msSaveBlob) {
            // FOR IE BROWSER
            navigator.msSaveBlob(blob, fileName);
        } else {
            // FOR OTHER BROWSERS
            var link = document.createElement("a");
            var csvUrl = URL.createObjectURL(blob);
            link.href = csvUrl;
            link.style = "visibility:hidden";
            link.download = fileName;
            document.body.appendChild(link);
            link.click();
            document.body.removeChild(link);
        }
}
5
Ganesh