从解析的 CSV 数据创建 File 对象

Question

我目前正在开发一个项目，涉及上传 CSV 文件并对该文件进行一些处理。我正在使用 papa parse 从原始文件中获取数据，以便我可以根据需要对其进行修改：

const reader = new FileReader()

reader.onload = async ({ target }) => {
  const csv = Papa.parse(target?.result as any, {
    header: true
  })
  const parsedData: any[] = csv?.data;
  setOriginalData(parsedData);
}

reader.readAsText(file)

然后，我点击 API 端点来映射数据并根据需要进行修改。修改后，我需要将其转换回文件对象，以便可以通过 API 将其上传到 S3 存储桶。处理后，数据的形状为：

[
  {
    Col_1: 'value_1',
    Col_2: 'value_2,
    ...
  },
  ...
]

我需要获取此数据并将其转换为文件对象，以便上传端点正常工作。

我花了一些时间深入研究文档，但似乎更关注将数据下载为 CSV 文件（例如使用 React-csv 等库）。我需要保存原始文件和处理后的文件，这就是我目前正在尝试的方法：

const originalFormData = new FormData();
originalFormData.append('file', file);

const uploadOriginalRes = await fetch('/api/lists/save', {
  method: 'POST',
  body: originalFormData
})
const originalJsonRes = await uploadOriginalRes.json();

const fileName = originalJsonRes.data.filename;
const processedFile = new File(processData, `${fileName}-processed`, { type: 'text/csv' })

const processedFormData = new FormData();
processedFormData.append('file', processedFile)

const processedFileUploadRes = await fetch('/api/lists/save', {
  method: 'POST',
  body: processedFormData
})

const processedFileJsonRes = await processedFileUploadRes.json();
console.log('PROCESSED FILE:', processedFileJsonRes);

我在第一个 API 调用中上传的文件是直接从文件输入中读取的，并按照我期望的方式保存为 csv 文件。但毫不奇怪的是，我尝试上传处理后的数据的调用生成的 CSV 文件如下所示：

[object Object][object Object][object Object][object Object]...

我不确定需要如何修改数据才能将其正确读取为 CSV 数据。

Answer 1

在上传 CSV 文件之前，您需要在创建 File 对象之前对其进行格式化。由于您处理的数据是对象数组的形式，因此您需要先将其转换为 CSV 字符串。

// Convert processed data to CSV string
const csvContent = Papa.unparse