Node.js中通过复选框值动态修改CSV文件路径的实现方案

嘿，针对你的两个技术需求，我整理了一套清晰的实现方案，分前端和Node.js后端两部分来做：

1. 前端获取复选框值并传给后端 #

首先得在前端页面里处理复选框，把用户选中的文件名传到你的/import路由。这里给你两种实现方式，选适合你的就行：

方式一：表单直接提交 #

<!-- 复选框表单，action指向你的/import路由 -->
<form action="/import" method="POST">
  <div>
    <label>
      <input type="checkbox" name="selectedCsv" value="Core Front End -Membership Services - defects.csv">
      会员服务缺陷CSV
    </label>
    <!-- 可以添加更多复选框，对应不同的CSV文件 -->
  </div>
  <button type="submit">开始导入</button>
</form>

方式二：AJAX异步提交（更友好的用户体验） #

<form id="csvImportForm">
  <div>
    <label>
      <input type="checkbox" name="selectedCsv" value="Core Front End -Membership Services - defects.csv">
      会员服务缺陷CSV
    </label>
  </div>
  <button type="submit">开始导入</button>
</form>

<script>
document.getElementById('csvImportForm').addEventListener('submit', async (e) => {
  e.preventDefault();
  const formData = new FormData(e.target);
  // 获取选中的复选框值，如果是多个选中可以用formData.getAll('selectedCsv')
  const selectedFileName = formData.get('selectedCsv');

  if (!selectedFileName) {
    alert('请先选择要导入的CSV文件哦');
    return;
  }

  try {
    const response = await fetch('/import', {
      method: 'POST',
      headers: {
        'Content-Type': 'application/x-www-form-urlencoded',
      },
      body: `selectedCsv=${encodeURIComponent(selectedFileName)}`
    });
    const result = await response.text();
    console.log(result);
    // 这里可以加成功提示
  } catch (err) {
    console.error('请求出错：', err);
  }
});
</script>

2. Node.js后端处理路由，动态替换路径并创建流 #

接下来在你的/import路由里，把硬编码的CSV路径换成前端传过来的复选框值，然后安全地创建读取流。

首先确保你已经引入了必要的模块，并且配置了基础的Express中间件：

const express = require('express');
const router = express.Router();
const fs = require('fs');
const path = require('path');
// 别忘了配置body解析，不然拿不到前端传的值
router.use(express.urlencoded({ extended: true }));

然后修改你的/import路由逻辑：

router.post('/import', (req, res) => {
  // 拿到前端传过来的选中文件名
  const selectedFileName = req.body.selectedCsv;

  // 先做参数校验，避免空值
  if (!selectedFileName) {
    return res.status(400).send('请选择要导入的CSV文件');
  }

  // 用path模块拼接路径，比直接字符串拼接更安全，适配不同操作系统
  const csvFilePath = path.join(__dirname, '../uploads', selectedFileName);
  // 这里的../uploads要根据你的项目目录结构调整，确保路径正确

  // 先检查文件是否存在，避免报错
  fs.access(csvFilePath, fs.constants.F_OK, (err) => {
    if (err) {
      return res.status(404).send(`找不到指定文件：${selectedFileName}`);
    }

    // 现在创建读取流，替换原来的硬编码路径
    const stream = fs.createReadStream(csvFilePath);

    // 监听流的事件，处理后续逻辑
    stream.on('open', () => {
      console.log(`开始读取文件：${csvFilePath}`);
      // 这里可以继续你的CSV解析逻辑，比如用csv-parser模块处理
      res.send(`正在处理文件：${selectedFileName}`);
    });

    stream.on('error', (streamErr) => {
      console.error('读取文件出错：', streamErr);
      res.status(500).send('文件读取失败，请稍后重试');
    });
  });
});

几个关键注意点 #

• 路径安全：一定要用path模块拼接路径，不要直接用字符串相加，不然在Windows和Linux上可能出现路径分隔符的问题。
• 参数校验：必须检查前端传过来的文件名是否为空，以及文件是否存在，避免服务器抛出未捕获的错误。
• 中间件配置：如果用表单提交或者AJAX的urlencoded格式，一定要配置express.urlencoded()中间件，不然req.body会是空的。

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