一个基于React前端和SQLite数据库的完整用户认证系统，包含用户注册、登录、密码加密和JWT令牌验证功能。

• ✅ 用户注册（用户名、邮箱、密码验证）
• ✅ 用户登录验证
• ✅ 密码加密存储（bcrypt）
• ✅ JWT令牌认证
• ✅ 响应式UI设计
• ✅ 表单验证和错误提示
• ✅ SQLite数据库存储

• React 18
• React Router DOM
• Vite
• CSS3（响应式设计）

• Node.js
• Express.js
• SQLite3
• bcryptjs（密码加密）
• JWT（令牌认证）
• CORS

/workspace/
├── src/                    # React前端源码
│   ├── components/         # React组件
│   │   ├── Login.jsx      # 登录组件
│   │   ├── Register.jsx   # 注册组件
│   │   └── Dashboard.jsx  # 用户仪表板
│   ├── App.jsx            # 主应用组件
│   ├── main.jsx           # 应用入口
│   └── index.css          # 全局样式
├── server/                # Node.js后端
│   └── server.js          # Express服务器
├── package.json           # 项目依赖
├── vite.config.js         # Vite配置
└── index.html            # HTML模板

npm install

npm run dev

这将同时启动：

• 前端开发服务器（http://localhost:3000）
• 后端API服务器（http://localhost:5000）

打开浏览器访问 http://localhost:3000

• POST /api/auth/register - 用户注册
• POST /api/auth/login - 用户登录
• GET /api/auth/verify - 验证JWT令牌

• GET /api/user/profile - 获取用户信息（需要认证）

项目使用SQLite数据库，数据库文件 users.db 会在首次运行时自动创建。

CREATE TABLE users (
  id INTEGER PRIMARY KEY AUTOINCREMENT,
  username TEXT UNIQUE NOT NULL,
  email TEXT UNIQUE NOT NULL,
  password TEXT NOT NULL,
  created_at DATETIME DEFAULT CURRENT_TIMESTAMP
)

• 🔒 密码使用bcrypt加密存储
• 🔑 JWT令牌认证
• 🛡️ CORS跨域保护
• ✅ 输入验证和清理
• 🚫 SQL注入防护

• 用户名：3-20个字符，只能包含字母、数字和下划线
• 邮箱：有效的邮箱格式
• 密码：至少6个字符，必须包含大小写字母和数字
• 确认密码：必须与密码一致

• 用户名：至少3个字符
• 密码：至少6个字符

• 📱 移动设备优化
• 💻 桌面设备适配
• 🎨 现代化UI设计
• ⚡ 流畅的动画效果

• npm run dev - 启动开发服务器
• npm run client - 仅启动前端开发服务器
• npm run server - 仅启动后端服务器
• npm run build - 构建生产版本
• npm run preview - 预览生产构建

可以设置以下环境变量：

• PORT - 后端服务器端口（默认5000）
• JWT_SECRET - JWT密钥（生产环境请设置强密钥）

1. 生产环境请更改JWT密钥
2. 建议使用HTTPS协议
3. 定期备份数据库文件
4. 可以根据需要添加更多安全中间件

MIT License