当前位置：首页 > news >正文

Supabase 的入门详细介绍

news 2025/11/4 10:18:42

Supabase 是什么？

简单来说，Supabase 是一个开源的 Firebase 替代品。它提供了一整套后端即服务 (BaaS - Backend as a Service) 的工具，让你能够快速构建应用程序的后端，而无需自己从头搭建和管理服务器、数据库等基础设施。

Supabase 的核心是强大的 PostgreSQL 数据库，并在此基础上提供了一系列围绕数据、用户、文件和自定义逻辑的功能。

为什么选择 Supabase？（核心优势）

开源和可移植性：
- 核心技术栈是开源的，这意味着你拥有更大的控制权。
- 你可以选择使用 Supabase 官方的托管服务，也可以选择在自己的服务器上自托管 (self-hosting)。
强大的 PostgreSQL 核心：
- 在这儿你会获得的一个功能齐全的 PostgreSQL 数据库，可以使用完整的 SQL 功能，包括复杂的查询、事务、触发器、函数和丰富的扩展 (如 PostGIS, pg_cron, pgvector)。
- 对于熟悉 SQL 的开发者来说，上手非常快。
易用性和开发者体验：
- 提供直观的图形用户界面 (Supabase Studio) 用于管理数据库、用户、存储等。
- 自动生成 RESTful 和 GraphQL API，无需编写后端代码即可进行数据操作。
- 提供多种语言的客户端库 (JavaScript, Python, Dart/Flutter, Swift, Kotlin 等)，方便与前端和移动应用集成。
一体化解决方案：
- 数据库 (Database): 核心功能。
- 用户认证 (Authentication): 轻松实现用户注册、登录、第三方登录等。
- 文件存储 (Storage): 存储和提供图片、视频等大文件。
- 边缘函数 (Edge Functions): 编写和部署无服务器函数，处理自定义后端逻辑。
- 实时 (Realtime): 订阅数据库变更，实现实时数据同步。
成本效益：
- 提供慷慨的免费套餐，非常适合个人项目、学习和原型开发。
- 付费套餐的价格也相对透明和合理。

Supabase 的核心功能组件详解：

数据库 (Database - PostgreSQL):
- 表格编辑器： 在 Supabase Studio 中可以像操作电子表格一样创建、修改表结构和数据。
- SQL 编辑器： 直接在浏览器中编写和执行 SQL 查询。
- 行级安全策略 (Row Level Security - RLS): 这是 Supabase 安全模型的基石。你可以基于用户身份、角色等定义精细的数据访问规则，确保用户只能访问他们被授权的数据。强烈建议启用并配置 RLS。
- 数据库函数和触发器： 利用 PostgreSQL 的强大功能，在数据库层面实现复杂的业务逻辑。
- 数据库扩展： 安装如 pg_cron (定时任务)、pgvector (向量数据，用于 AI/ML) 等扩展增强功能。
用户认证 (Authentication):
- 多种登录方式： 邮箱密码、手机 OTP、魔法链接 (Magic Links)、匿名登录。
- 社交登录 (OAuth)： 支持 Google, GitHub, Apple, Facebook, Twitter, Azure, GitLab 等众多提供商。
- JWT (JSON Web Tokens)： 使用行业标准的 JWT 进行会话管理。
- 用户管理： 在 Supabase Studio 中查看和管理用户。
- 与 RLS 集成： 认证信息 (如用户 ID) 可以直接在 RLS 策略中使用。
文件存储 (Storage):
- 存储桶 (Buckets)： 类似于文件夹，用于组织文件。可以设置公开或私有。
- 权限控制： 可以为存储桶和单个对象设置精细的访问权限，与用户认证系统和 RLS 集成。
- CDN 集成： 通常会自动配置 CDN，加速全球文件访问。
边缘函数 (Edge Functions):
- Serverless 架构： 无需管理服务器，按需执行。
- 使用 Deno (TypeScript/JavaScript)： 编写函数逻辑。
- 用途： 处理 Webhooks、与第三方 API 交互、执行需要保密的后端逻辑、数据校验和转换等。
- 全球部署： 部署在靠近用户的边缘节点，减少延迟。
实时 (Realtime):
- 订阅数据库变更： 当数据库中的数据发生插入、更新或删除时，客户端可以实时收到通知。
- 用途： 聊天应用、实时协作、实时仪表盘、通知系统等。
- 基于 PostgreSQL 的 LISTEN/NOTIFY 和 Supabase Realtime 服务器。
自动生成的 API:
- RESTful API: Supabase 使用 PostgREST 自动为你的数据库表生成 RESTful API 端点。
- GraphQL API: 通过 pg_graphql 扩展，可以自动生成 GraphQL API。
Supabase Studio (管理后台):
- 一个用户友好的 Web 界面，用于管理上述所有功能：
  - 数据库表和数据
  - SQL 编辑器
  - 用户认证配置和用户列表
  - 文件存储桶和文件
  - 边缘函数部署和日志
  - API 文档和密钥管理
  - 项目设置、日志、使用量监控等

如何开始使用 Supabase (基本步骤):

注册账户： 访问 Supabase 官网并注册一个账户。
创建新项目：
- 登录后，点击 “New project”。
- 选择一个组织 (Organization)。
- 填写项目名称 (Name)。
- 设置一个强大的数据库密码 (Database Password)，并务必妥善保存！ 创建后 Supabase 不会再显示它。
- 选择一个区域 (Region)，通常选择离你的用户最近的区域。
- 选择定价计划 (Pricing Plan)，通常从 “Free” 开始。
- 点击 “Create new project”。
等待项目创建： 大约需要几分钟时间。
探索项目仪表盘 (Supabase Studio)：
- 项目创建完成后，你会被带到项目仪表盘。
- 获取 API 信息： 在 “Project Settings” -> “API” 页面，你会找到：
  - Project URL: 你的项目 API 的基础 URL。
  - anon (public) key: 用于客户端的公共 API 密钥。这个密钥是安全的，可以暴露在前端代码中，因为它会受到 RLS 策略的限制。
  - service_role key: 拥有超级权限的密钥，绝不能暴露在前端或不安全的环境中。 仅用于后端服务、脚本或受信任的环境 (如 Edge Functions)。
安装客户端库：
- 根据你的前端框架或语言选择合适的 Supabase 客户端库。最常用的是 supabase-js (用于 JavaScript/TypeScript 项目)。
- 例如，在 JavaScript 项目中：npm install @supabase/supabase-js 或 yarn add @supabase/supabase-js

在你的应用中初始化 Supabase Client：

// 示例 (JavaScript)
import { createClient } from '@supabase/supabase-js';const supabaseUrl = 'YOUR_SUPABASE_URL'; // 从项目 API 设置中获取
const supabaseAnonKey = 'YOUR_SUPABASE_ANON_KEY'; // 从项目 API 设置中获取const supabase = createClient(supabaseUrl, supabaseAnonKey);export default supabase;

开始使用 Supabase 功能：

数据库操作 (CRUD):

// 插入数据
const { data, error } = await supabase.from('your_table_name').insert([{ some_column: 'someValue', other_column: 'otherValue' }]);// 查询数据
const { data, error } = await supabase.from('your_table_name').select('*') // 或者 'column1, column2'.eq('some_column', 'someValue'); // 添加查询条件

用户认证：

// 邮箱密码注册
const { data, error } = await supabase.auth.signUp({email: 'user@example.com',password: 'securepassword123',
});// 邮箱密码登录
const { data, error } = await supabase.auth.signInWithPassword({email: 'user@example.com',password: 'securepassword123',
});// 获取当前用户
const { data: { user } } = await supabase.auth.getUser();// 退出登录
const { error } = await supabase.auth.signOut();

文件存储：

// 上传文件
const { data, error } = await supabase.storage.from('your_bucket_name').upload('path/to/your_file.png', fileObject);// 下载文件
const { data, error } = await supabase.storage.from('your_bucket_name').download('path/to/your_file.png');