存储

使用示例上传流程和 Supabase Storage 策略。

Upload sample 是一个 Example 功能,用来展示 Expo 中的私有 Supabase Storage 上传:选择文件、流式展示上传进度、写入可查询的 sample_uploads row,并列出当前用户最近的上传。

已包含内容

step7_examples 迁移已经创建示例需要的一切:

  • 名为 sample-uploads 的私有 Storage bucket。
  • 50 MB bucket 文件大小限制。
  • 按文件夹隔离的 storage.objects policies。
  • bucketpath、文件 metadata 和 RLS 的 sample_uploads 表。

如果已经运行下面命令,就不需要在 dashboard 手动创建 bucket:

supabase db push --project-ref <ref>

上传流程

app/upload-sample.tsx 渲染 screen。lib/sample-uploads.ts 负责数据和上传机制。

选择文件

Screen 调用 DocumentPicker.getDocumentAsync({ multiple: true, type: "*/*" })。支持多文件队列,并显示每个文件的进度。

生成私有对象路径

路径格式为:

<user-id>/<timestamp>-<random>-<sanitized-filename>

第一个路径段是用户 UUID,这样 Storage policy 可以把它和 auth.uid() 比较。

带进度上传

应用用 expo-file-system 读取 bytes,然后通过 XMLHttpRequest 直接上传到 Supabase Storage REST endpoint,以便用 progress events 更新队列 UI。

写入 metadata

对象上传成功后,应用插入一条 sample_uploads row,包含 bucket、path、原始文件名、content type、byte size 和 user ID。

这和 Swift 版本不同:Expo 原版会同时写 Storage object 和 sample_uploads 表 row,因此无需列 bucket 就能查询最近上传。

Policies

迁移会把 rows 和 objects 限制在已登录用户范围内:

资源Policy 行为
sample_uploads已认证用户只能 select、insert、delete user_id = auth.uid() 的 rows
sample-uploads bucket私有 bucket,50 MB 文件大小限制
storage.objects已认证用户只能 read、insert、update、delete bucket_id = "sample-uploads"(storage.foldername(name))[1] = auth.uid()::text 的对象

如果换成自己的 bucket,请保留 <user-id>/... 文件夹约定,或重写 policies 以匹配你的路径布局。

展示和清理

最近上传通过 useSampleUploadssample_uploads 表渲染。示例只展示 metadata rows;如果产品需要预览或下载,请添加 signed URL 生成。

账号删除由 delete-account Edge Function 处理。它会列出 sample-uploads/<user-id>/ 下的文件,删除这些对象,然后删除 auth user。sample_uploads rows 会通过 auth user 外键级联删除。

头像 bucket 说明

lib/profile.ts 包含头像上传 helper:用 expo-image-manipulator 压缩图片,上传到 avatars bucket,并把头像路径写到 profiles.avatar_url。随附迁移没有创建该 bucket。如果保留头像上传,请先创建 avatars bucket 和 owner-scoped policies,再把它作为生产功能暴露。

自定义存储

  • 修改 lib/sample-uploads.ts 中的 bucket 常量。
  • 在 DocumentPicker options 中限制接受的文件类型。
  • 如果需要快速列表、审计记录或清理 UI,保留 metadata insert。
  • 为预览、下载和图片渲染添加 signed URL helpers。
  • 为新的私有 bucket 复制按文件夹隔离的 policies。

验证上传

  • 登录,打开 Upload sample,选择一个或多个文件。
  • 确认队列显示 "Uploaded",最近上传列表刷新。
  • 在 Supabase Storage 中确认对象位于 sample-uploads/<user-id>/
  • 在 SQL editor 中确认插入了 sample_uploads rows。
  • 删除测试账号,并确认该用户的上传文件夹被移除。

相关页面

On this page