Πώς να εξάγετε πληροφορίες συστοιχίας JavaScript σε csv (στην πλευρά του πελάτη);

Ξέρω ότι υπάρχουν πολλές ερωτήσεις αυτής της φύσης, αλλά πρέπει να το κάνω αυτό χρησιμοποιώντας JavaScript. Χρησιμοποιώ το Dojo 1.8 και έχω όλες τις πληροφορίες χαρακτηριστικών σε πίνακα, ο οποίος μοιάζει με αυτό:

[["name1", "city_name1", ...]["name2", "city_name2", ...]]

Καμία ιδέα για το πώς μπορώ να το εξάγω αυτό σε CSV στην πλευρά του πελάτη;

Springer F
Επεξεργασμένη ερώτηση Κάνε Σεπτέμβριος 2019 в 5:51
Προγραμματισμός
csv client-side export javascript dojo-1.8
Κάνε Φεβρουάριος 2013 в 4:49
8 προβολές
Λύση

Μπορείτε να το κάνετε αυτό σε εγγενή JavaScript. Θα πρέπει να αναλύσετε τα δεδομένα σας σε σωστή μορφή CSV (υποθέτοντας ότι χρησιμοποιείτε έναν πίνακα από πίνακες για τα δεδομένα σας, όπως περιγράψατε στην ερώτηση):

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";
});

ή με τον συντομότερο τρόπο (χρησιμοποιώντας συναρτήσεις βέλους):

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");

Στη συνέχεια, μπορείτε να χρησιμοποιήσετε τις συναρτήσεις window.open και encodeURI της JavaScript'για να κατεβάσετε το αρχείο CSV ως εξής:

var encodedUri = encodeURI(csvContent);
window.open(encodedUri);

Επεξεργασία:

Εάν θέλετε να δώσετε στο αρχείο σας ένα συγκεκριμένο όνομα, πρέπει να κάνετε τα πράγματα λίγο διαφορετικά, καθώς αυτό δεν υποστηρίζεται με την πρόσβαση σε ένα URI δεδομένων χρησιμοποιώντας τη μέθοδο `window.open`. Για να το πετύχετε αυτό, μπορείτε να δημιουργήσετε έναν κρυφό κόμβο DOM `` και να ορίσετε το χαρακτηριστικό του `download` ως εξής: 
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".
isherwood
Επεξεργασμένη απάντηση Κάνε Απρίλιος 2019 в 4:20
Σχόλια (34)

Ήρθα εδώ ψάχνοντας για λίγο περισσότερη συμμόρφωση με το RFC 4180 και απέτυχα να βρω μια υλοποίηση, οπότε έφτιαξα μια (πιθανώς αναποτελεσματική) για τις δικές μου ανάγκες. Σκέφτηκα να τη μοιραστώ με όλους.

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');

Ελπίζω αυτό να βοηθήσει κάποιον στο μέλλον. Αυτό συνδυάζει και την κωδικοποίηση του CSV μαζί με τη δυνατότητα λήψης του αρχείου. Στο παράδειγμά μου στο [jsfiddle](http://jsfiddle.net/a5E9m/2/). Μπορείτε να κατεβάσετε το αρχείο (υποθέτοντας πρόγραμμα περιήγησης HTML 5) ή να δείτε την έξοδο στην κονσόλα.

ΕΝΗΜΕΡΩΣΗ:

Uxonith
Επεξεργασμένη απάντηση Κάνε Μάιος 2014 в 4:39
Σχόλια (3)

Η λύση από τον @Default λειτουργεί τέλεια στον Chrome (ευχαριστώ πολύ γι' αυτό!), αλλά είχα ένα πρόβλημα με τον IE.

Εδώ είναι μια λύση (λειτουργεί στον 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")
Skip Jack
Επεξεργασμένη απάντηση Κάνε Μάιος 2016 в 3:18
Σχόλια (0)