So che ci sono molte domande di questa natura, ma ho bisogno di farlo usando JavaScript. Sto usando Dojo 1.8
e ho tutte le informazioni sugli attributi in un array, che assomiglia a questo:
[["name1", "city_name1", ...]["name2", "city_name2", ...]]
Qualche idea su come posso esportare questo in CSV
sul lato client?
Puoi farlo in JavaScript nativo. Dovrai analizzare i tuoi dati nel formato CSV corretto in questo modo (supponendo che tu stia usando un array di array per i tuoi dati come hai descritto nella domanda):
const rows = [
["name1", "city1", "some other info"],
["name2", "city2", "more info"]
];
let csvContent = "data:text/csv;charset=utf-8,";
rows.forEach(function(rowArray) {
let row = rowArray.join(",");
csvContent += row + "\r\n";
});
o nel modo più breve (usando le funzioni freccia):
const rows = [
["name1", "city1", "some other info"],
["name2", "city2", "more info"]
];
let csvContent = "data:text/csv;charset=utf-8,"
+ rows.map(e => e.join(",")).join("\n");
Poi puoi usare le funzioni JavaScript window.open
e encodeURI
per scaricare il file CSV in questo modo:
var encodedUri = encodeURI(csvContent);
window.open(encodedUri);
Se volete dare al vostro file un nome specifico, dovete fare le cose un po' diversamente, poiché questo non è supportato accedendo a un URI di dati usando il metodo window.open
. Per ottenere ciò, puoi creare un nodo DOM nascosto <a>
e impostare il suo attributo download
come segue:
var encodedUri = encodeURI(csvContent);
var link = document.createElement("a");
link.setAttribute("href", encodedUri);
link.setAttribute("download", "my_data.csv");
document.body.appendChild(link); // Required for FF
link.click(); // This will download the data file named "my_data.csv".
Sono venuto qui a cercare un po' più di conformità alla RFC 4180 e non sono riuscito a trovare un'implementazione, così ne ho fatta una (forse inefficiente) per i miei bisogni. Ho pensato di condividerla con tutti.
var content = [['1st title', '2nd title', '3rd title', 'another title'], ['a a a', 'bb\nb', 'cc,c', 'dd"d'], ['www', 'xxx', 'yyy', 'zzz']];
var finalVal = '';
for (var i = 0; i < content.length; i++) {
var value = content[i];
for (var j = 0; j < value.length; j++) {
var innerValue = value[j]===null?'':value[j].toString();
var result = innerValue.replace(/"/g, '""');
if (result.search(/("|,|\n)/g) >= 0)
result = '"' + result + '"';
if (j > 0)
finalVal += ',';
finalVal += result;
}
finalVal += '\n';
}
console.log(finalVal);
var download = document.getElementById('download');
download.setAttribute('href', 'data:text/csv;charset=utf-8,' + encodeURIComponent(finalVal));
download.setAttribute('download', 'test.csv');
Speriamo che questo possa aiutare qualcuno in futuro. Questo combina sia la codifica del CSV che la possibilità di scaricare il file. Nel mio esempio su [jsfiddle](
). È possibile scaricare il file (assumendo un browser HTML 5) o visualizzare l'output nella console.AGGIORNAMENTO:UPDATE:
Chrome ora sembra aver perso la capacità di nominare il file. Non sono sicuro di cosa sia successo o di come risolverlo, ma ogni volta che uso questo codice (incluso il jsfiddle), il file scaricato si chiama ora download.csv
.
La soluzione di @Default funziona perfettamente su Chrome (grazie mille per questo!) ma ho avuto un problema con IE.
Ecco una soluzione (funziona su IE10):
var csvContent=data; //here we load our csv data
var blob = new Blob([csvContent],{
type: "text/csv;charset=utf-8;"
});
navigator.msSaveBlob(blob, "filename.csv")