如何將 Google 表格數據導入為可用的 json 值？

Question

如何將谷歌表格中的數據導入可用的 JSON 數據？ 我不想只是 console.log 它或將其作為 div 元素插入。

我希望能夠將從 get 請求收到的 csv 文件分配給一個變量，並將其轉換為 JSON 字典。

function loadData() {
  var url="https://docs.google.com/spreadsheets/d/e/2PACX-1vQ3CoW5ktyMAa8YTdQc5hrh_z7jqCURxa3kqxjZTuLGZ-067Un7uryjv1F6Yt7AXHQrz7KUJf7ZRRWl/pub?output=csv";
  xmlhttp=new XMLHttpRequest();
  xmlhttp.onreadystatechange = function() {
    if(xmlhttp.readyState == 4 && xmlhttp.status==200){
      console.log(xmlhttp.response);
      return xmlhttp.response;
    }
  };
  xmlhttp.open("GET",url,true);
  xmlhttp.send(null);
}

const csv = loadData()
console.log(loadData())

目前，數據記錄在控制台上，但我不確定如何將其轉換為可用數據。

Answer 1

在您的情況下，如何進行以下修改？

修改后的腳本：

function loadData() {
  return new Promise((resolve, reject) => {
    var url = "https://docs.google.com/spreadsheets/d/e/2PACX-1vQ3CoW5ktyMAa8YTdQc5hrh_z7jqCURxa3kqxjZTuLGZ-067Un7uryjv1F6Yt7AXHQrz7KUJf7ZRRWl/pub?output=csv";
    xmlhttp = new XMLHttpRequest();
    xmlhttp.onreadystatechange = function () {
      if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
        resolve(xmlhttp.response);
      } else if (xmlhttp.readyState == 4 && xmlhttp.status != 200) {
        reject(xmlhttp.responseText);
      }
    };
    xmlhttp.open("GET", url, true);
    xmlhttp.send(null);
    xmlhttp.onerror = function () {
      reject(xmlhttp.responseText);
    }
  });
}

async function sample() {
  // Retrieve CSV data.
  const csv = await loadData().catch(err => console.log(err));
  if (!csv) return;
  console.log(csv);

  // Convert CSV to JSON data.
  const [header, ...values] = csv.split("\n").map(r => r.split(","));
  const json = values.map(r => r.reduce((o, c, j) => {
    const v = c.trim();
    o[header[j]] = isNaN(v) ? v : Number(v);
    return o;
  }, {}));
  console.log(json)
}

sample();

• 運行此腳本時，您可以在console.log(csv)的日志中看到檢索到的 CSV 數據。 此外，您可以在console.log(json)的日志中看到轉換后的 JSON 值。
  • 關於 JSON 數據，不幸的是，我無法找到您在評論中提到的預期值。 所以，我通過猜測你的目標來准備它。 如果這不是您的預期值，請提供您的預期值。 通過這個，我想修改它。