添加文件上传
帮用户为项目添加文件上传和存储功能。
步骤
1. 了解需求
问题 1:上传什么文件
用户需要上传什么?
- 图片(头像、产品图)
- 文档(PDF、Word)
- 通用文件 这决定了需要的文件验证和处理逻辑。
问题 2:存储方案
文件存在哪里?
- 本地存储(最简单,适合开发和小项目)
- Cloudflare R2(便宜,兼容 S3 API,推荐生产用)
- AWS S3(成熟稳定,企业首选)
- Supabase Storage(如果已经用 Supabase) 不确定就先用本地存储,后面再换。
2. 生成上传功能
后端:
- 上传接口 — 接收文件,验证类型和大小
- 文件验证 — 限制文件类型(白名单)、大小上限
- 存储逻辑 — 保存到选定的存储位置
- 文件 URL — 返回可访问的文件地址
前端:
- 上传组件 — 拖拽上传 + 点击选择
- 上传进度 — 进度条显示
- 预览 — 图片类文件支持上传前预览
- 错误提示 — 文件太大、格式不对等
安全措施:
- 文件名随机化,防止路径穿越
- 文件类型服务端二次验证
- 设置合理的大小上限
3. 测试
上传一个测试文件,确认可以上传、预览和下载。
文件上传功能已添加。 如果需要图片裁剪或压缩,告诉我。