Cách chuyển đổi JSON sang định dạng CSV và lưu trữ trong một biến


99

Tôi có một liên kết để mở dữ liệu JSON trong trình duyệt, nhưng rất tiếc là tôi không biết cách đọc nó. Có cách nào để chuyển đổi dữ liệu này bằng JavaScript ở định dạng CSV và lưu nó trong tệp JavaScript không?

Dữ liệu giống như sau:

{
  "count": 2,
  "items": [{
    "title": "Apple iPhone 4S Sale Cancelled in Beijing Amid Chaos (Design You Trust)",
    "description": "Advertise here with BSA Apple cancelled its scheduled sale of iPhone 4S in one of its stores in China\u2019s capital Beijing on January 13. Crowds outside the store in the Sanlitun district were waiting on queues overnight. There were incidents of scuffle between shoppers and the store\u2019s security staff when shoppers, hundreds of them, were told that the sales [...]Source : Design You TrustExplore : iPhone, iPhone 4, Phone",
    "link": "http:\/\/wik.io\/info\/US\/309201303",
    "timestamp": 1326439500,
    "image": null,
    "embed": null,
    "language": null,
    "user": null,
    "user_image": null,
    "user_link": null,
    "user_id": null,
    "geo": null,
    "source": "wikio",
    "favicon": "http:\/\/wikio.com\/favicon.ico",
    "type": "blogs",
    "domain": "wik.io",
    "id": "2388575404943858468"
  }, {
    "title": "Apple to halt sales of iPhone 4S in China (Fame Dubai Blog)",
    "description": "SHANGHAI \u2013 Apple Inc said on Friday it will stop selling its latest iPhone in its retail stores in Beijing and Shanghai to ensure the safety of its customers and employees. Go to SourceSource : Fame Dubai BlogExplore : iPhone, iPhone 4, Phone",
    "link": "http:\/\/wik.io\/info\/US\/309198933",
    "timestamp": 1326439320,
    "image": null,
    "embed": null,
    "language": null,
    "user": null,
    "user_image": null,
    "user_link": null,
    "user_id": null,
    "geo": null,
    "source": "wikio",
    "favicon": "http:\/\/wikio.com\/favicon.ico",
    "type": "blogs",
    "domain": "wik.io",
    "id": "16209851193593872066"
  }]
}

Gần nhất tôi có thể tìm thấy là: Chuyển đổi định dạng JSON sang định dạng CSV cho MS Excel

Nhưng nó tải xuống trong một tệp CSV, tôi lưu trữ nó trong một biến, toàn bộ dữ liệu được chuyển đổi.

Cũng muốn biết cách thay đổi ký tự thoát: '\u2019'trở lại bình thường.


Tôi đã thử mã này:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
  <title>JSON to CSV</title>
  <script src="http://code.jquery.com/jquery-1.7.1.js" type="text/javascript"></script>
  <script type="text/javascript">
    var json3 = {
      "count": 2,
      "items": [{
          "title": "Apple iPhone 4S Sale Cancelled in Beijing Amid Chaos (Design You Trust)",
          "description": "Advertise here with BSA Apple cancelled its scheduled sale of iPhone 4S in one of its stores in China’s capital Beijing on January 13. Crowds outside the store in the Sanlitun district were waiting on queues overnight. There were incidents of scuffle between shoppers and the store’s security staff when shoppers, hundreds of them, were told that the sales [...]Source : Design You TrustExplore : iPhone, iPhone 4, Phone",
          "link": "http://wik.io/info/US/309201303",
          "timestamp": 1326439500,
          "image": null,
          "embed": null,
          "language": null,
          "user": null,
          "user_image": null,
          "user_link": null,
          "user_id": null,
          "geo": null,
          "source": "wikio",
          "favicon": "http://wikio.com/favicon.ico",
          "type": "blogs",
          "domain": "wik.io",
          "id": "2388575404943858468"
        },
        {
          "title": "Apple to halt sales of iPhone 4S in China (Fame Dubai Blog)",
          "description": "SHANGHAI – Apple Inc said on Friday it will stop selling its latest iPhone in its retail stores in Beijing and Shanghai to ensure the safety of its customers and employees. Go to SourceSource : Fame Dubai BlogExplore : iPhone, iPhone 4, Phone",
          "link": "http://wik.io/info/US/309198933",
          "timestamp": 1326439320,
          "image": null,
          "embed": null,
          "language": null,
          "user": null,
          "user_image": null,
          "user_link": null,
          "user_id": null,
          "geo": null,
          "source": "wikio",
          "favicon": "http://wikio.com/favicon.ico",
          "type": "blogs",
          "domain": "wik.io",
          "id": "16209851193593872066"
        }
      ]
    }
    //var objJson = JSON.parse(json3.items);

    DownloadJSON2CSV(json3.items);

    function DownloadJSON2CSV(objArray) {
      var array = typeof objArray != 'object' ? JSON.parse(objArray) : objArray;

      var str = '';

      for (var i = 0; i < array.length; i++) {
        var line = '';

        for (var index in array[i]) {
          line += array[i][index] + ',';
        }

        line.slice(0, line.Length - 1);

        str += line + '\r\n';
      }
      $('div').html(str);
    }
  </script>

</head>

<body>
  <div></div>
</body>

</html>

Nhưng nó dường như không hoạt động. Ai đó có thể vui lòng giúp đỡ?



bạn có một mã tốt ở đó. dòng tải xuống là window.open ("data: text / csv; charset = utf-8," + Escape (str)) .. chỉ cần bỏ qua nếu bạn không cần. và chuỗi csv được giữ trong biến này: str
zdrsh

CSV không thể xử lý nhiều cấp dữ liệu (cũng như) như JSON. Bạn mong đợi JSON của mình trông như thế nào dưới dạng CSV? 2,Apple iPhone 4S Sale Cancelled in Beijing Amid Chaos (Design You Trust), ...?
Stefan

Tôi muốn dữ liệu của mình trông giống như: Bán iPhone 4S của Apple bị hủy ở Bắc Kinh Giữa sự hỗn loạn (Design You Trust), Quảng cáo tại đây với BSA Apple đã hủy bỏ lịch bán iPhone 4S tại một trong các cửa hàng của mình... ,,,,,, v.v. Tôi có thể dễ dàng xóa các ký tự bắt đầu này: "{" count ": 2," items ": [:"
praneybehl

@zdrsh có nhưng vì một số lý do tôi không thể làm cho nó hoạt động.
praneybehl

Câu trả lời:


154

Một cách đơn giản hơn để chuyển đổi json sang csv là sử dụng hàm bản đồ mà không có bất kỳ khuôn khổ nào:

var json = json3.items
var fields = Object.keys(json[0])
var replacer = function(key, value) { return value === null ? '' : value } 
var csv = json.map(function(row){
  return fields.map(function(fieldName){
    return JSON.stringify(row[fieldName], replacer)
  }).join(',')
})
csv.unshift(fields.join(',')) // add header column
 csv = csv.join('\r\n');
console.log(csv)

Đầu ra:

title,description,link,timestamp,image,embed,language,user,user_image,user_link,user_id,geo,source,favicon,type,domain,id
"Apple iPhone 4S Sale Cancelled in Beijing Amid Chaos (Design You Trust)","Advertise here with BSA Apple cancelled its scheduled sale of iPhone 4S in one of its stores in China’s capital Beijing on January 13. Crowds outside the store in the Sanlitun district were waiting on queues overnight. There were incidents of scuffle between shoppers and the store’s security staff when shoppers, hundreds of them, were told that the sales [...]Source : Design You TrustExplore : iPhone, iPhone 4, Phone","http://wik.io/info/US/309201303","1326439500","","","","","","","","","wikio","http://wikio.com/favicon.ico","blogs","wik.io","2388575404943858468"
"Apple to halt sales of iPhone 4S in China (Fame Dubai Blog)","SHANGHAI – Apple Inc said on Friday it will stop selling its latest iPhone in its retail stores in Beijing and Shanghai to ensure the safety of its customers and employees. Go to SourceSource : Fame Dubai BlogExplore : iPhone, iPhone 4, Phone","http://wik.io/info/US/309198933","1326439320","","","","","","","","","wikio","http://wikio.com/favicon.ico","blogs","wik.io","16209851193593872066"

Cập nhật ES6 (2016)

Sử dụng cú pháp ít dày đặc hơn này và cả JSON.stringify để thêm dấu ngoặc kép vào chuỗi trong khi giữ các số không được trích dẫn:

const items = json3.items
const replacer = (key, value) => value === null ? '' : value // specify how you want to handle null values here
const header = Object.keys(items[0])
let csv = items.map(row => header.map(fieldName => JSON.stringify(row[fieldName], replacer)).join(','))
csv.unshift(header.join(','))
csv = csv.join('\r\n')

console.log(csv)

3
Tôi thích sự ngắn gọn của điều này, nhưng cần lưu ý rằng nó không xử lý một số thứ mà một số có thể thấy lý tưởng. ví dụ như mỗi bản ghi trên một dòng riêng, con số và phép toán của nó trái không thể viện chứng vv
scunliffe

2
Bạn có thể thêm dấu + "\ r \ n" sau các fields.map () để nhận một bản ghi cho mỗi hàng. Để nhận các số chưa được trích dẫn, bạn có thể sử dụng JSON.stringify (row [fieldName]) để thay thế sẽ chỉ trích dẫn các chuỗi và để lại các số không được trích dẫn.
Christian Landgren

1
@scunliffe: Tôi đã cập nhật một ví dụ mới với JSON.stringify - nó sẽ xử lý các trường hợp bạn đã mô tả.
Christian Landgren

1
@marathon, Bắt tốt, đã cập nhật ví dụ bằng chất thay thế để xử lý riêng các trường hợp rỗng. Nếu không có trình thay thế nào được sử dụng, null sẽ được xuất ra dưới dạng null- bây giờ các ví dụ sẽ xử lý cả null, undefined và number một cách chính xác.
Christian Landgren

3
Đáng lưu ý rằng điều này sẽ thoát khỏi các chuỗi trong dấu ngoặc kép bằng cách sử dụng \"điều này cho phép một số trường "bật ra" khỏi cột của chúng khi được xem trong Excel (dường như thích ""làm ký tự thoát cho dấu ngoặc kép). Điều này có thể được giải quyết bằng cách thêm .replace(/\\"/g, '""')vào cuối JSON.stringify(row[fieldName], replacer)như tôi đã lưu ý trong câu trả lời của tôi ở trên.
user1274820

51

Ok, cuối cùng thì mã này cũng hoạt động:

<html>
<head>
    <title>Demo - Covnert JSON to CSV</title>
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
    <script type="text/javascript" src="https://github.com/douglascrockford/JSON-js/raw/master/json2.js"></script>

    <script type="text/javascript">
        // JSON to CSV Converter
        function ConvertToCSV(objArray) {
            var array = typeof objArray != 'object' ? JSON.parse(objArray) : objArray;
            var str = '';

            for (var i = 0; i < array.length; i++) {
                var line = '';
                for (var index in array[i]) {
                    if (line != '') line += ','

                    line += array[i][index];
                }

                str += line + '\r\n';
            }

            return str;
        }

        // Example
        $(document).ready(function () {

            // Create Object
            var items = [
                  { name: "Item 1", color: "Green", size: "X-Large" },
                  { name: "Item 2", color: "Green", size: "X-Large" },
                  { name: "Item 3", color: "Green", size: "X-Large" }];

            // Convert Object to JSON
            var jsonObject = JSON.stringify(items);

            // Display JSON
            $('#json').text(jsonObject);

            // Convert JSON to CSV & Display CSV
            $('#csv').text(ConvertToCSV(jsonObject));
        });
    </script>
</head>
<body>
    <h1>
        JSON</h1>
    <pre id="json"></pre>
    <h1>
        CSV</h1>
    <pre id="csv"></pre>
</body>
</html>

Cảm ơn rất nhiều vì tất cả sự hỗ trợ cho tất cả những người đóng góp.

Praney


1
Tôi đã thử cái này. tôi có ba cột nhưng trong excel tất cả mọi thứ sẽ đến trong một cột duy nhất
Nithesh Narayanan

1
Nithesh bạn nên xác định '' như một dấu phân cách
Jacer Omri

Cảm ơn vì đã chia sẻ điều này ở đây. Chỉ cần sử dụng nó và nó hoạt động hoàn hảo.
Ramin Arabbagheri

Cảm ơn vì điều đó! Tôi đã thêm phần sau để tránh có "[object Object]" trong dòng nếu một ô chứa một đối tượng. if (_.isObject (array [i] [index])) {array [i] [index] = JSON.stringify (array [i] [index]); }. (sử dụng dấu gạch dưới, nhưng bạn có thể thay đổi để vani)
claytronicon

1
@Sunil Tôi đã tìm thấy nếu các giá trị chứa dấu phẩy, nó sẽ bị vỡ. Vì nhu cầu của tôi, tôi chỉ làm điều này: var re = new RegExp (',', 'g'); array [i] [index] = array [i] [index] .toString ().
Replace

17

Giải pháp rất hay của praneybehl, nhưng nếu ai đó muốn lưu dữ liệu dưới dạng csvtệp và sử dụng một blobphương pháp thì họ có thể tham khảo điều này:

function JSONToCSVConvertor(JSONData, ReportTitle, ShowLabel) {     

//If JSONData is not an object then JSON.parse will parse the JSON string in an Object
var arrData = typeof JSONData != 'object' ? JSON.parse(JSONData) : JSONData;
var CSV = '';    
//This condition will generate the Label/Header
if (ShowLabel) {
    var row = "";

    //This loop will extract the label from 1st index of on array
    for (var index in arrData[0]) {
        //Now convert each value to string and comma-seprated
        row += index + ',';
    }
    row = row.slice(0, -1);
    //append Label row with line break
    CSV += row + '\r\n';
}

//1st loop is to extract each row
for (var i = 0; i < arrData.length; i++) {
    var row = "";
    //2nd loop will extract each column and convert it in string comma-seprated
    for (var index in arrData[i]) {
        row += '"' + arrData[i][index] + '",';
    }
    row.slice(0, row.length - 1);
    //add a line break after each row
    CSV += row + '\r\n';
}

if (CSV == '') {        
    alert("Invalid data");
    return;
}   

//this trick will generate a temp "a" tag
var link = document.createElement("a");    
link.id="lnkDwnldLnk";

//this part will append the anchor tag and remove it after automatic click
document.body.appendChild(link);

var csv = CSV;  
blob = new Blob([csv], { type: 'text/csv' }); 
var csvUrl = window.webkitURL.createObjectURL(blob);
var filename = 'UserExport.csv';
$("#lnkDwnldLnk")
.attr({
    'download': filename,
    'href': csvUrl
}); 

$('#lnkDwnldLnk')[0].click();    
document.body.removeChild(link);
}

Giải pháp này hoạt động nhưng có một số điểm kỳ lạ - bạn xác định var rowhai lần (nếu câu lệnh if và vòng lặp for không tạo ra bao đóng). Ngoài ra vòng lặp nhãn / tiêu đề có thể có thể được giảm xuống một dòng:Object.keys(arrData[0]).join(',')
ccnokes

Câu trả lời của bạn đang hoạt động. Nhưng đối với những trường hợp như nếu một số cột không có sẵn cho một số hàng, nó sẽ không coi là cột bị thiếu và sẽ không sắp xếp lại dữ liệu cột cho dữ liệu hàng đó.
sms

Tôi đã có thể làm cho phương pháp này hoạt động nhưng tôi phải chỉnh sửa một số mã để: 1. hoạt động mà không cần JQuery: document.getElementById("lnkDwnldLnk").download = filename; document.getElementById("lnkDwnldLnk").href = csvUrl;2. làm việc trong IE11: if (window.navigator && window.navigator.msSaveOrOpenBlob) { window.navigator.msSaveOrOpenBlob(blob, filename); } else { document.getElementById('lnkDwnldLnk').click(); }
Jason

17

Tôi chỉ muốn thêm một số mã ở đây cho mọi người trong tương lai vì tôi đang cố gắng xuất JSON sang tài liệu CSV và tải xuống.

Tôi sử dụng $.getJSONđể kéo dữ liệu json từ một trang bên ngoài, nhưng nếu bạn có một mảng cơ bản, bạn có thể sử dụng mảng đó.

Điều này sử dụng mã của Christian Landgren để tạo dữ liệu csv.

$(document).ready(function() {
    var JSONData = $.getJSON("GetJsonData.php", function(data) {
        var items = data;
        const replacer = (key, value) => value === null ? '' : value; // specify how you want to handle null values here
        const header = Object.keys(items[0]);
        let csv = items.map(row => header.map(fieldName => JSON.stringify(row[fieldName], replacer)).join(','));
        csv.unshift(header.join(','));
        csv = csv.join('\r\n');

        //Download the file as CSV
        var downloadLink = document.createElement("a");
        var blob = new Blob(["\ufeff", csv]);
        var url = URL.createObjectURL(blob);
        downloadLink.href = url;
        downloadLink.download = "DataDump.csv";  //Name the file here
        document.body.appendChild(downloadLink);
        downloadLink.click();
        document.body.removeChild(downloadLink);
    });
});

Chỉnh sửa: Cần lưu ý rằng JSON.stringifysẽ thoát khỏi dấu ngoặc kép trong dấu ngoặc kép bằng cách thêm \". Nếu bạn xem CSV trong excel, nó không giống như một ký tự thoát.

Bạn có thể thêm .replace(/\\"/g, '""')vào cuối JSON.stringify(row[fieldName], replacer)để hiển thị điều này đúng trong excel (điều này sẽ thay thế \"bằng ""những gì excel thích hơn).

Dòng đầy đủ: let csv = items.map(row => header.map(fieldName => (JSON.stringify(row[fieldName], replacer).replace(/\\"/g, '""'))).join(','));


11

Nếu ai đó cũng muốn tải xuống.
Đây là một chức năng nhỏ tuyệt vời sẽ chuyển đổi một mảng các đối tượng JSON thành csv, sau đó tải xuống.

downloadCSVFromJson = (filename, arrayOfJson) => {
  // convert JSON to CSV
  const replacer = (key, value) => value === null ? '' : value // specify how you want to handle null values here
  const header = Object.keys(arrayOfJson[0])
  let csv = arrayOfJson.map(row => header.map(fieldName => 
  JSON.stringify(row[fieldName], replacer)).join(','))
  csv.unshift(header.join(','))
  csv = csv.join('\r\n')

  // Create link and download
  var link = document.createElement('a');
  link.setAttribute('href', 'data:text/csv;charset=utf-8,%EF%BB%BF' + encodeURIComponent(csv));
  link.setAttribute('download', filename);
  link.style.visibility = 'hidden';
  document.body.appendChild(link);
  link.click();
  document.body.removeChild(link);
};

Sau đó gọi nó như thế này:

this.downloadCSVFromJson(`myCustomName.csv`, this.state.csvArrayOfJson)

điều này dường như không hiệu quả đối với mọi thứ khi có một câu trích dẫn duy nhất ở một trong các yếu tố, ví dụCap D'antibes
MidnightDataGeek

9

Có nhiều tùy chọn có sẵn để sử dụng lại các thư viện mạnh mẽ hiện có dựa trên các tiêu chuẩn.

Nếu bạn tình cờ sử dụng D3 trong dự án của mình, thì bạn có thể chỉ cần gọi:

    d3.csv.formathoặc các d3.csv.formatRowshàm chuyển một mảng đối tượng thành chuỗi csv.

    d3.csv.formatRows cho phép bạn kiểm soát tốt hơn những thuộc tính nào được chuyển đổi thành csv.

    Vui lòng tham khảo d3.csv.formatd3.csv.formatRows wiki trang.

Có các thư viện khác cũng có sẵn như jquery-csv , PapaParse . Papa Parse không có phụ thuộc - thậm chí không có jQuery.

Đối với các plugin dựa trên jquery, vui lòng kiểm tra điều này .


1
Nó hiệu quả tuyệt vời đối với tôi. Lưu ý rằng API D3 đã thay đổi kể từ 2017.v3 (hiện tại là v4): github.com/d3/d3-dsv/blob/v1.2.0/README.md#csvFormat
aljabear

7

Hãy thử những ví dụ này

Ví dụ 1:

JsonArray = [{
    "AccountNumber": "123",
    "AccountName": "abc",
    "port": "All",
    "source": "sg-a78c04f8"

}, {
    "Account Number": "123",
    "Account Name": "abc",
    "port": 22,
    "source": "0.0.0.0/0",
}]

JsonFields = ["Account Number","Account Name","port","source"]

function JsonToCSV(){
    var csvStr = JsonFields.join(",") + "\n";

    JsonArray.forEach(element => {
        AccountNumber = element.AccountNumber;
        AccountName   = element.AccountName;
        port          = element.port
        source        = element.source

        csvStr += AccountNumber + ',' + AccountName + ','  + port + ',' + source + "\n";
        })
        return csvStr;
}

Ví dụ 2:

JsonArray = [{
    "AccountNumber": "1234",
    "AccountName": "abc",
    "inbound": [{
        "port": "All",
        "source": "sg-a78c04f8"
    },
    {
        "port": 22,
        "source": "0.0.0.0/0",
    }]
}]

JsonFields = ["Account Number", "Account Name", "port", "source"]

function JsonToCSV() {
    var csvStr = JsonFields.join(",") + "\n";

    JsonArray.forEach(element => {
        AccountNumber = element.AccountNumber;
        AccountName = element.AccountName;
        
        element.inbound.forEach(inboundELe => {
            port = inboundELe.port
            source = inboundELe.source
            csvStr += AccountNumber + ',' + AccountName + ',' + port + ',' + source + "\n";
        })
    })
    return csvStr;
}

Bạn thậm chí có thể tải xuống tệp csv bằng cách sử dụng mã sau:

function downloadCSV(csvStr) {

    var hiddenElement = document.createElement('a');
    hiddenElement.href = 'data:text/csv;charset=utf-8,' + encodeURI(csvStr);
    hiddenElement.target = '_blank';
    hiddenElement.download = 'output.csv';
    hiddenElement.click();
}

4
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>JSON to CSV</title>
    <script src="http://code.jquery.com/jquery-1.7.1.js" type="text/javascript"></script>
</head>
<body>
    <h1>This page does nothing....</h1>

    <script type="text/javascript">
        var json3 = {
          "count": 2,
          "items": [{
              "title": "Apple iPhone 4S Sale Cancelled in Beijing Amid Chaos (Design You Trust)",
              "description": "Advertise here with BSA Apple cancelled its scheduled sale of iPhone 4S in one of its stores in China’s capital Beijing on January 13. Crowds outside the store in the Sanlitun district were waiting on queues overnight. There were incidents of scuffle between shoppers and the store’s security staff when shoppers, hundreds of them, were told that the sales [...]Source : Design You TrustExplore : iPhone, iPhone 4, Phone",
              "link": "http://wik.io/info/US/309201303",
              "timestamp": 1326439500,
              "image": null,
              "embed": null,
              "language": null,
              "user": null,
              "user_image": null,
              "user_link": null,
              "user_id": null,
              "geo": null,
              "source": "wikio",
              "favicon": "http://wikio.com/favicon.ico",
              "type": "blogs",
              "domain": "wik.io",
              "id": "2388575404943858468"
            },
            {
              "title": "Apple to halt sales of iPhone 4S in China (Fame Dubai Blog)",
              "description": "SHANGHAI – Apple Inc said on Friday it will stop selling its latest iPhone in its retail stores in Beijing and Shanghai to ensure the safety of its customers and employees. Go to SourceSource : Fame Dubai BlogExplore : iPhone, iPhone 4, Phone",
              "link": "http://wik.io/info/US/309198933",
              "timestamp": 1326439320,
              "image": null,
              "embed": null,
              "language": null,
              "user": null,
              "user_image": null,
              "user_link": null,
              "user_id": null,
              "geo": null,
              "source": "wikio",
              "favicon": "http://wikio.com/favicon.ico",
              "type": "blogs",
              "domain": "wik.io",
              "id": "16209851193593872066"
            }
          ]
        };

        const items = json3.items
        const replacer = (key, value) => value === null ? '' : value // specify how you want to handle null values here
        const header = Object.keys(items[0])
        let csv = items.map(row => header.map(fieldName => JSON.stringify(row[fieldName], replacer)).join(','))
        csv.unshift(header.join(','))
        csv = csv.join('\r\n')

        var link = document.createElement("a");    
        link.id="lnkDwnldLnk";
        document.body.appendChild(link);
        blob = new Blob([csv], { type: 'text/csv' }); 
        var csvUrl = window.webkitURL.createObjectURL(blob);
        var filename = 'UserExport.csv';
        jQuery("#lnkDwnldLnk")
        .attr({
            'download': filename,
            'href': csvUrl
        });
        jQuery('#lnkDwnldLnk')[0].click();
        document.body.removeChild(link);
    </script>
</body>
</html>

1

Đây là một cách để làm điều đó cho các đối tượng sâu động theo cách hướng đối tượng cho các phiên bản js mới hơn. bạn có thể phải thay đổi kiểu phân loại này sang vùng khác.

private ConvertToCSV(objArray) {
    let rows = typeof objArray !== "object" ? JSON.parse(objArray) : objArray;
    let  header = "";
    Object.keys(rows[0]).map(pr => (header += pr + ";"));

    let str = "";
    rows.forEach(row => {
        let line = "";
        let columns =
            typeof row !== "object" ? JSON.parse(row) : Object.values(row);
        columns.forEach(column => {
            if (line !== "") {
                line += ";";
            }
            if (typeof column === "object") {
                line += JSON.stringify(column);
            }  else {
                line += column;
            }
        });
        str += line + "\r\n";
    });
    return header + "\r\n" + str;
}

1

Đôi khi các đối tượng có độ dài khác nhau. Vì vậy, tôi đã gặp phải vấn đề tương tự như Kyle Pennell. Nhưng thay vì sắp xếp mảng, chúng ta chỉ cần xem qua nó và chọn mảng dài nhất. Độ phức tạp về thời gian giảm xuống còn O (n), so với O (n log (n)) khi sắp xếp trước.

Tôi bắt đầu với mã từ phiên bản cập nhật ES6 (2016) của Christian Landgren .

json2csv(json) {
    // you can skip this step if your input is a proper array anyways:
    const simpleArray = JSON.parse(json)
    // in array look for the object with most keys to use as header
    const header = simpleArray.map((x) => Object.keys(x))
      .reduce((acc, cur) => (acc.length > cur.length ? acc : cur), []);

    // specify how you want to handle null values here
    const replacer = (key, value) => (
      value === undefined || value === null ? '' : value);
    let csv = simpleArray.map((row) => header.map(
      (fieldName) => JSON.stringify(row[fieldName], replacer)).join(','));
    csv = [header.join(','), ...csv];
    return csv.join('\r\n');
}

1

Tôi muốn cắt nghĩa câu trả lời của @Christian Landgren ở trên. Tôi đã nhầm lẫn tại sao tệp CSV của tôi chỉ có 3 cột / tiêu đề. Điều này là do phần tử đầu tiên trong json của tôi chỉ có 3 khóa. Vì vậy, bạn cần phải cẩn thận với const header = Object.keys(json[0])đường dây. Nó giả định rằng phần tử đầu tiên trong mảng là đại diện. Tôi đã có JSON lộn xộn với một số đối tượng có nhiều hơn hoặc ít hơn.

Vì vậy, tôi đã thêm một array.sortvào điều này sẽ sắp xếp JSON theo số lượng khóa. Vì vậy, theo cách đó, tệp CSV của bạn sẽ có số cột tối đa.

Đây cũng là một chức năng mà bạn có thể sử dụng trong mã của mình. Chỉ cần cung cấp cho nó JSON!

function convertJSONtocsv(json) {
    if (json.length === 0) {
        return;
    }

    json.sort(function(a,b){ 
       return Object.keys(b).length - Object.keys(a).length;
    });

    const replacer = (key, value) => value === null ? '' : value // specify how you want to handle null values here
    const header = Object.keys(json[0])
    let csv = json.map(row => header.map(fieldName => JSON.stringify(row[fieldName], replacer)).join(','))
    csv.unshift(header.join(','))
    csv = csv.join('\r\n')

    fs.writeFileSync('awesome.csv', csv)
}

1

Một sự điều chỉnh từ câu trả lời praneybehl để làm việc với các đối tượng lồng nhau và dấu phân cách tab

function ConvertToCSV(objArray) {
  let array = typeof objArray != 'object' ? JSON.parse(objArray) : objArray;
  if(!Array.isArray(array))
      array = [array];

  let str = '';

  for (let i = 0; i < array.length; i++) {
    let line = '';
    for (let index in array[i]) {
      if (line != '') line += ','

      const item = array[i][index];
      line += (typeof item === 'object' && item !== null ? ConvertToCSV(item) : item);
    }
    str += line + '\r\n';
  }

  do{
      str = str.replace(',','\t').replace('\t\t', '\t');
  }while(str.includes(',') || str.includes('\t\t'));

  return str.replace(/(\r\n|\n|\r)/gm, ""); //removing line breaks: https://stackoverflow.com/a/10805198/4508758
}

1
Điều này hoạt động hoàn hảo để sao chép và dán thẳng vào Excel / Trang tính! Cảm ơn!
UP

0

Viết Csv.

function writeToCsv(dataToWrite, callback) {
    var dataToWrite;
    var fs = require('fs');
    dataToWrite = convertToCSV(dataToWrite);
    fs.writeFile('assets/distanceInfo.csv', dataToWrite, 'utf8', function (err) {
      if (err) {
        console.log('Some error occured - file either not saved or corrupted file saved.');
      } else{
        console.log('It\'s saved!');
      }
      callback("data_saved | assets/distanceInfo.csv")
    });
}

function convertToCSV(objArray) {
    var array = typeof objArray != 'object' ? JSON.parse(objArray) : objArray;
    var str = '';
    for (var i = 0; i < array.length; i++) {
        var line = '';
        for (var index in array[i]) {
            if (line != '') line += ','

            line += array[i][index];
        }
        str += line + '\r\n';
    }
    return str;
}

2
Tôi không nghĩ điều này có nhiều giá trị. Vui lòng chỉnh sửa để thêm một số giải thích về cách điều này giúp trả lời câu hỏi.
fedorqui 'SO dừng hại'

0

Buồn cười là không có gì hoàn chỉnh cũng như không hoạt động ở đây (IE cũng như node.js). Trả lời cho câu hỏi tương tự, JSON có cấu trúc bit (giả sử không cần sao chép lại), cũng bao gồm đoạn mã demo. Chuyển đổi JSON sang CSV (JavaScript): Cách định dạng đúng cách chuyển đổi CSV Hy vọng không chỉ trình chuyển đổi loại đơn, trên Github của tôi (được đề cập trong hồ sơ) cũng được sử dụng tương tự để phân tích cấu trúc JSON chưa biết. Tôi là tác giả của mã trong câu trả lời này và tất cả mã trên Github của tôi (ngoại trừ một số dự án bắt đầu dưới dạng bản dịch fork / +).


0

Cá nhân tôi sẽ sử dụng thư viện d3-dsv để làm điều này. Tại sao phải reinvent the wheel?


import { csvFormat } from 'd3-dsv';
/**
 * Based on input data convert it to csv formatted string
 * @param (Array) columnsToBeIncluded array of column names (strings)
 *                which needs to be included in the formated csv
 * @param {Array} input array of object which need to be transformed to string
 */
export function convertDataToCSVFormatString(input, columnsToBeIncluded = []) {
  if (columnsToBeIncluded.length === 0) {
    return csvFormat(input);
  }
  return csvFormat(input, columnsToBeIncluded);
}

Với rung cây, bạn chỉ có thể nhập hàm cụ thể đó từ d3-dsvthư viện


0

Đây là phiên bản đơn giản của tôi về việc chuyển đổi một mảng đối tượng thành CSV (giả sử các đối tượng đó đều có cùng thuộc tính):

var csv = []
if (items.length) {
  var keys = Object.keys(items[0])
  csv.push(keys.join(','))
  items.forEach(item => {
    let vals = keys.map(key => item[key] || '')
    csv.push(vals.join(','))
  })
}

csv = csv.join('\n') 
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.