Как я могу экспортировать данные из файла CSV или Excel в объект JavaScript?

Question

Я хотел бы знать, есть ли способ экспортировать данные из файла CSV в объект javascript, и когда кто-то редактирует файл CSV, он автоматически изменяется в файле javascript. Большое вам спасибо.

Answer 1

Следующие шаги реализованы в следующем фрагменте кода. Настройте его по мере необходимости.

1. Выберите входной CSV-файл. (Фрагмент кода протестирован для файла CSV в кодировке UTF-8)
2. Чтение данных файла CSV
3. Анализ данных файла CSV и создание объекта JSON
4. Управление или изменениеобъект JSON, если требуется.
5. Экспорт объекта JSON как CSV

var CsvRows;
var headers;

// This event will be triggered when file is selected
// Note: This code is tested for UTF-8 encoded CSV file 
function handleChange(evt) {
  var reader = new FileReader();
  reader.onload = function() {
  
    //reader.result gives the file content
    document.getElementById('out').innerHTML = reader.result;
    
    //parse the result into javascript object
    var lines = reader.result.split('\r\n');
    headers = lines[0].split(',');
    lines.shift();
    CsvRows = lines.map((item) => {
      var values = item.split(',');
      var row = {};
      headers.map((h, i) => {
        row[h] = values[i];
      });
      return row;
    });
    console.log(CsvRows);
    document.getElementById('result').style.display = 'block'
  };

  //read the selected file
  reader.readAsBinaryString(evt.files[0]);
};


//export the javscript object as csv
function exportCSV() {
  //contruct the csv ad data url
  let csvContent = "data:text/csv;charset=utf-8," +
    headers.join(",") + "\r\n";


  //contruct the data in csv format
  var data = CsvRows.map(e => {
    var line = '';
    headers.map((h) => {
      line += e[h] + ',';
    });
    return line.substr(0, line.length - 1);
  }).join("\r\n")

  csvContent += data;

  //contruct an anchor tag 
  var encodedUri = encodeURI(csvContent);
  var link = document.createElement("a");
  link.setAttribute("href", encodedUri);
  
  //provide the export file name
  link.setAttribute("download", "mydata.csv");
  document.body.appendChild(link); // Required for FF

  //trigger download of CSV
  link.click();

  link.remove();
}

<input type="file" onchange="handleChange(this)" accept=".csv" />

<div id="result" style="display:none;">
  <div id="out"></div>
  <div>See console for Javascript Object.</div>
  <div>Export the imported file <button onclick="exportCSV()">Export</button></div>
</div>

Приведенный выше фрагмент кода работает только для файлов CSV. Пользовательская реализация должна быть сделана для файлов Excel.