QR 图片上传器

一个现代化的扫码上传图片服务，支持 PC 显示二维码，手机扫码上传图片，并保留完整的图片历史记录。

✨ 核心功能

PC 端

1. 🔐 生成唯一房间号和二维码
2. 📊 实时统计信息（已上传数量、连接状态、最近上传时间）
3. 🖼️ 图片历史记录（新图片不覆盖旧图片）
4. 👁️ 全屏图片预览
5. 📋 一键复制图片 - 悬停图片显示复制按钮，点击直接复制到剪贴板
6. 🗑️ 一键清空历史

手机端

1. 📱 扫描二维码快速连接
2. 📤 支持点击选择或拖拽上传图片
3. 🎯 自动图片压缩（1200px 以内，压缩率 85%+）
4. 👀 上传前图片预览和压缩信息
5. ✅ 实时上传状态反馈
6. 📐 智能 UI - 选择图片后自动隐藏上传区域

🎨 UI 特性

• 左右分栏布局 - 左侧扫码区 + 右侧历史区（PC 端）
• 网格图片展示 - 卡片式布局，支持滚动浏览
• 智能空间优化 - 移动端选择图片后自动隐藏上传区域
• 平滑动画效果 - 图片添加、悬停、预览动画
• 响应式设计 - 自适应各种屏幕尺寸
• 美观的渐变主题 - 紫色渐变配色

⚡ 性能优化

• 自动图片压缩 - 限制尺寸 1200px，质量 85%
• 传输速度提升 - 文件大小减少 80-90%
• 流量节省 - 压缩后上传更快更省
• 智能判断 - 小图无需压缩

本地开发

# 安装依赖
npm install

# 启动开发服务器
npm run dev

然后访问 http://localhost:3000

部署到 Vercel

1. 安装 Vercel CLI: npm i -g vercel
2. 登录: vercel login
3. 部署: vercel --prod

或者直接在 Vercel 网站上导入 GitHub 仓库。

技术栈

• Express.js - 服务端框架
• Socket.IO - 实时通信
• QRCode.js - 二维码生成
• 原生 HTML/CSS/JavaScript - 前端