SuperAPI AI 工具集

file-upload-fullstack

编程与开发

查看项目

更新于 10-15 22:19

技能介绍

用途:实现端到端文件上传管线,覆盖拖拽 UI、预签名 URL、客户端直传云存储、进度处理、后端确认与 CDN 分发。前提是已存在存储桶,不涉及基础表单处理。

主要能力:先做发现式确认(存储提供商、文件类型与大小限制、访问控制、确认模式、替换行为);核心模式包括:不代理文件字节而用预签名 URL 直传;后端生成预签名 PUT URL 并服务端生成文件 key、校验类型与大小、设置 ContentLength 与元数据;前端两步上传(取预签名→PUT→确认),用 XMLHttpRequest 获取进度,处理 dragover/drop 事件;两阶段提交确认,校验 fileKey 归属并 HeadObject 验证后写库、触发异步处理;客户端校验仅作 UX,真正安全校验在后端;CDN 分发与缓存失效,私有文件用签名 URL,替换文件优先用唯一 key 或按需失效;大于 100MB 用分片上传,分片需 ≥5MB 并捕获 ETag。

使用方式:按资料中的代码结构产出 api/uploads.ts、uploadFile.ts、FileDropZone.tsx、cdn.ts,并在注释中标明哪些校验仅为 UX、哪些是安全边界,以及所有权校验、缓存失效成本、分片阈值。

适用场景:需要直传云存储并保证后端可确认、可追踪、可处理的上传功能。

限制:资料未提供具体收费、价格、平台支持范围或效果数据;示例以 AWS S3 为主,其他提供商 API 不同;分片上传、CDN 失效等细节需按实际环境调整。