通过PostgREST API POST插入CSV至PostgreSQL遇PGRST102解析错误排查

问题根源 #

你的代码里fetch请求在FileReader的load事件回调外执行了。因为readAsText是异步操作，文件还没读取完成，fetch就已经发送请求，此时datafinal是空字符串，PostgREST收到空内容自然会报parse error (not enough input)的错误。

另外你提供的原始CSV格式存在问题，正确的CSV应该每行对应一条记录，比如：

num,description
3,bli bli
4,bli

修正后的代码 #

把fetch逻辑移到load事件回调内部，确保文件读取完成后再发送请求，同时优化CSV处理逻辑：

const btnIntegrer = document.querySelector(".btn-integrer");

btnIntegrer.addEventListener("click", () => {
  const fichierCsvInput = document.querySelector(".fichier-csv");
  const fichierCsv = fichierCsvInput.files[0];
  if (!fichierCsv) return; // 先判断是否选择了文件

  const reader = new FileReader(); // 原代码漏创建FileReader实例，必须补上
  reader.addEventListener("load", (e) => {
    let data = e.target.result;
    // 兼容不同系统的换行符，同时过滤空行
    const lignes = data.split(/\r?\n/).filter(ligne => ligne.trim() !== "");
    const datafinal = lignes.join("\n");

    fetch('http://blabla/testapi', { // 去掉URL末尾多余的?
      method: "POST",
      headers: {
        "Content-Type": "text/csv",
        // 若PostgREST需要认证，需在此添加对应头部，比如Authorization: Bearer xxx
      },
      body: datafinal
    })
    .then(result => {
      if (!result.ok) throw new Error(`HTTP错误: ${result.status}`);
      console.log('插入成功:', result);
    })
    .catch(err => {
      console.error('插入失败:', err); // 修正原代码错误的console调用
    });
  });

  reader.readAsText(fichierCsv); // 读取操作需放在事件监听之后
});

关键修正点 #

• 异步逻辑调整：将fetch完全放在load回调内，确保文件读取完成后再发送请求
• 补全FileReader实例：原代码未创建FileReader实例，会导致reader未定义的隐性错误
• URL修正：去掉URL末尾的?，PostgREST的表端点不需要该符号
• CSV处理优化：用正则兼容Windows/Linux的换行符，过滤空行避免无效内容被发送
• 错误处理修正：修正原代码错误的console.assert.error调用，同时新增响应状态码检查

PostgREST CSV插入注意事项 #

确保你的PostgREST端点/testapi对应的PostgreSQL表结构和CSV完全匹配：

• CSV第一行必须是表的列名（如num,description）
• 后续每行的字段数量要和列数一致
• 若表存在必填字段，CSV中必须提供对应值

内容的提问来源于stack exchange，提问作者Leehan