javascript - 如何跨浏览器一致地导出 csv 数据？

Question

我有一组要导出为 csv 文件的时间表数据。我目前的实现在 Chrome 中效果很好，但在 Firefox 或 Safari 中效果不佳（我还没有测试过其他浏览器）。

这是我正在使用的示例

rows = [
  ["Client", "Project", "User", "Duration (mins)", "Description", "Duration (hh:mm)"],
  ["foo", "foo_project", "foo bar", 30, "I did some stuff here", "0:30"],
  ["foo", "foo_project", "foo bar", 180, "And some more stuff during this one", "2:00"],
  ["bar", "bar_project", "foo bar", 9, "Only worked for nine minutes here", "0:09"]
]

data = "data:text/csv;charset=utf-8,"

joinedRows = rows.map(row => row.join(','))

data = data + joinedRows.join("\n")

link = document.createElement("a")

link.setAttribute('href', data)

link.click()

在 Chrome 中运行此代码段将为您提供格式正确的 csv 文件，但在 Firefox 中，这将是一行。

我创造data的方式是正确的吗？

let el = document.getElementById('button')
el.addEventListener('click', () => {
  rows = [
    ["Client", "Project", "User", "Duration (mins)", "Description", "Duration (hh:mm)"],
    ["foo", "foo_project", "foo bar", 30, "I did some stuff here", "0:30"],
    ["foo", "foo_project", "foo bar", 180, "And some more stuff during this one", "2:00"],
    ["bar", "bar_project", "foo bar", 9, "Only worked for nine minutes here", "0:09"]
  ]

  data = "data:text/csv;charset=utf-8,"

  joinedRows = rows.map(row => row.join(','))

  data = data + joinedRows.join("\n")

  link = document.createElement("a")

  link.setAttribute('href', data)

  link.click()
})

<button id="button">Click to download</button>

标签： javascriptcsvexport-to-csv