如何基于Node.js Express为每位访客生成独立JSON文件

核心思路 #

利用Express的express-session中间件给每个访客分配唯一的Session ID（存储在客户端Cookie中），以此ID作为JSON文件名，让每个访客的表单数据单独存入对应文件。无需数据库，纯文件操作实现数据隔离。

步骤1：安装依赖 #

需要的包：

• express：Web框架
• express-session：处理Session和Cookie
• ejs：模板引擎
• 内置fs/promises：处理JSON文件读写（无需额外安装）

执行安装命令：

npm install express express-session ejs

步骤2：配置Express与Session #

创建app.js，完成基础配置：

const express = require('express');
const session = require('express-session');
const fs = require('fs').promises;
const path = require('path');

const app = express();
const PORT = 3000;
const USER_DATA_DIR = path.join(__dirname, 'user-data'); // 存储用户JSON文件的目录

// 配置EJS模板
app.set('view engine', 'ejs');
app.set('views', path.join(__dirname, 'views'));

// 配置Session：自动给访客分配Session ID，存在Cookie中
app.use(session({
  secret: 'your-own-secret-key-keep-it-safe', // 自定义密钥，生产环境要保密
  resave: false,
  saveUninitialized: true, // 新访客自动创建Session
  cookie: { 
    secure: false, // 开发环境设为false，生产环境HTTPS下改为true
    maxAge: 30 * 24 * 60 * 60 * 1000 // Cookie有效期30天，按需调整
  }
}));

// 解析表单提交的URL编码数据
app.use(express.urlencoded({ extended: true }));

// 启动时确保用户数据目录存在
(async () => {
  try {
    await fs.access(USER_DATA_DIR);
  } catch {
    await fs.mkdir(USER_DATA_DIR, { recursive: true });
  }
})();

步骤3：绑定用户与JSON文件 #

添加中间件，每个请求进来时，自动为当前访客创建/关联对应的JSON文件：

app.use(async (req, res, next) => {
  const userId = req.session.id; // 用Session ID作为唯一用户标识
  req.userFile = path.join(USER_DATA_DIR, `${userId}.json`);

  // 如果用户文件不存在，初始化空数据结构
  try {
    await fs.access(req.userFile);
  } catch {
    await fs.writeFile(req.userFile, JSON.stringify({ submissions: [] }, null, 2));
  }

  next();
});

步骤4：实现表单展示与提交路由 #

添加首页（展示表单+历史数据）和表单提交的路由：

// 首页：展示表单和用户已提交的数据
app.get('/', async (req, res) => {
  try {
    const userData = JSON.parse(await fs.readFile(req.userFile, 'utf8'));
    res.render('index', { submissions: userData.submissions });
  } catch (err) {
    console.error('读取用户数据失败:', err);
    res.status(500).send('服务器错误');
  }
});

// 处理表单提交
app.post('/submit', async (req, res) => {
  try {
    // 读取现有用户数据
    const userData = JSON.parse(await fs.readFile(req.userFile, 'utf8'));
    // 添加新的表单数据（带时间戳）
    userData.submissions.push({
      ...req.body,
      timestamp: new Date().toISOString()
    });
    // 写入更新后的数据
    await fs.writeFile(req.userFile, JSON.stringify(userData, null, 2));
    // 重定向回首页
    res.redirect('/');
  } catch (err) {
    console.error('保存表单数据失败:', err);
    res.status(500).send('提交失败，请重试');
  }
});

// 启动服务器
app.listen(PORT, () => {
  console.log(`Server running on http://localhost:${PORT}`);
});

步骤5：编写EJS模板 #

在views目录下创建index.ejs，实现表单和数据展示：

<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <title>访客数据提交</title>
  <style>
    .submission { border: 1px solid #eee; padding: 10px; margin: 10px 0; border-radius: 4px; }
  </style>
</head>
<body>
  <h1>提交你的信息</h1>
  <form method="POST" action="/submit">
    <div>
      <label>姓名：</label>
      <input type="text" name="name" required>
    </div>
    <div>
      <label>邮箱：</label>
      <input type="email" name="email" required>
    </div>
    <div>
      <label>留言：</label>
      <textarea name="message" rows="3" required></textarea>
    </div>
    <button type="submit">提交</button>
  </form>

  <h2>你的历史提交</h2>
  <% if (submissions.length > 0) { %>
    <% submissions.forEach(sub => { %>
      <div class="submission">
        <p><strong>姓名：</strong><%= sub.name %></p>
        <p><strong>邮箱：</strong><%= sub.email %></p>
        <p><strong>留言：</strong><%= sub.message %></p>
        <p><small>提交时间：<%= new Date(sub.timestamp).toLocaleString() %></small></p>
      </div>
    <% }) %>
  <% } else { %>
    <p>暂无提交记录</p>
  <% } %>
</body>
</html>

关键说明 #

1. Cookie与Session的作用：
   • Cookie：存储在访客浏览器中，内容是Session ID，服务器通过这个ID识别用户
   • Session：服务器端维护的用户标识，这里我们用Session ID关联用户的JSON文件
2. 数据持久化：用户的表单数据直接存在user-data目录下的JSON文件中，服务器重启不会丢失（除非Session过期，此时访客会生成新的Session ID和对应文件）
3. 扩展建议：
   • 如果需要让用户能跨设备访问数据，可以添加登录功能，用用户名/邮箱作为JSON文件名替代Session ID
   • 可以优化文件读写性能，比如用缓存减少重复IO操作
   • 生产环境建议给express-session配置持久化Store（比如connect-file-store），避免服务器重启丢失Session映射

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