storage
starsforks
How to install storage?
lightpointventures/claude-code-starter/storage
$npx -y skills add lightpointventures/claude-code-starter --skill storage当用户想加文件上传、上传图片、上传文档、配置云存储时使用 — 添加文件上传和存储功能
SKILL.md
| 1 | # 添加文件上传 |
| 2 | |
| 3 | 帮用户为项目添加文件上传和存储功能。 |
| 4 | |
| 5 | ## 步骤 |
| 6 | |
| 7 | ### 1. 了解需求 |
| 8 | |
| 9 | **问题 1：上传什么文件** |
| 10 | > 用户需要上传什么？ |
| 11 | > - 图片（头像、产品图） |
| 12 | > - 文档（PDF、Word） |
| 13 | > - 通用文件 |
| 14 | > 这决定了需要的文件验证和处理逻辑。 |
| 15 | |
| 16 | **问题 2：存储方案** |
| 17 | > 文件存在哪里？ |
| 18 | > - 本地存储（最简单，适合开发和小项目） |
| 19 | > - Cloudflare R2（便宜，兼容 S3 API，推荐生产用） |
| 20 | > - AWS S3（成熟稳定，企业首选） |
| 21 | > - Supabase Storage（如果已经用 Supabase） |
| 22 | > 不确定就先用本地存储，后面再换。 |
| 23 | |
| 24 | ### 2. 生成上传功能 |
| 25 | |
| 26 | **后端：** |
| 27 | - 上传接口 — 接收文件，验证类型和大小 |
| 28 | - 文件验证 — 限制文件类型（白名单）、大小上限 |
| 29 | - 存储逻辑 — 保存到选定的存储位置 |
| 30 | - 文件 URL — 返回可访问的文件地址 |
| 31 | |
| 32 | **前端：** |
| 33 | - 上传组件 — 拖拽上传 + 点击选择 |
| 34 | - 上传进度 — 进度条显示 |
| 35 | - 预览 — 图片类文件支持上传前预览 |
| 36 | - 错误提示 — 文件太大、格式不对等 |
| 37 | |
| 38 | **安全措施：** |
| 39 | - 文件名随机化，防止路径穿越 |
| 40 | - 文件类型服务端二次验证 |
| 41 | - 设置合理的大小上限 |
| 42 | |
| 43 | ### 3. 测试 |
| 44 | |
| 45 | 上传一个测试文件，确认可以上传、预览和下载。 |
| 46 | |
| 47 | > 文件上传功能已添加。 |
| 48 | > 如果需要图片裁剪或压缩，告诉我。 |
People who liked this also viewed
6 picksType
- azure-storageAzure Storage Services including Blob Storage, File Shares, Queue Storage, Table Storage, and Data Lake. Answers questions about storage access tiers (hot, cool, cold, archive), when to use each tier,SkillsJul 2026
- supabase-postgres-best-practicesPostgres performance optimization and best practices from Supabase. Use this skill when writing, reviewing, or optimizing Postgres queries, schema designs, or database configurations.SkillsJul 2026
- supabaseUse when doing ANY task involving Supabase. Triggers: Supabase products (Database, Auth, Edge Functions, Realtime, Storage, Vectors, Cron, Queues); client libraries and SSR integrations (supabase-js, SkillsJul 2026
- convex-quickstartCreates or adds Convex to an app. Use for new Convex projects, npm create convex@latest, frontend setup, env vars, or the first npx convex dev run.SkillsJul 2026
- convex-performance-auditAudits Convex performance for reads, subscriptions, write contention, and function limits. Use for slow features, insights findings, OCC conflicts, or read amplification.SkillsJul 2026
- convex-setup-authSets up Convex auth, identity mapping, and access control. Use for login, auth providers, users tables, protected functions, or roles in a Convex app.SkillsJul 2026
