跳到主要内容
极客日志极客日志面向AI+效率的开发者社区
首页博客我的书AI学习GitHub 精选镜像AI工具UI配色美学关于
搜索内容 / 工具 / 仓库 / 镜像...⌘K搜索
注册
博客列表
TypeScriptNode.jsAI大前端

Supabase 全栈开发实战:从入门到本地部署

Supabase 基于 PostgreSQL 提供开箱即用的后端服务,涵盖用户认证、文件存储及边缘函数。其核心功能,包括行级安全策略(RLS)保障数据访问权限,以及通过 SDK 在前端直接操作数据库的安全性。此外,还介绍了本地 Docker 部署流程,帮助开发者在私有环境中构建完整的 Supabase 实例,实现前后端一体化开发。

AiEngineer发布于 2026/4/11更新于 2026/10/2491 浏览
Supabase 全栈开发实战:从入门到本地部署

Supabase 是一个基于 PostgreSQL 的开源后端服务框架,封装了用户认证、文件存储、边缘函数等功能,为开发者提供了一套开箱即用的后端基础设施。它在 GitHub 上拥有极高的关注度,是顶级开源项目之一。

总的来说,Supabase 提供了三大部分能力:后端基础设施、前端 SDK 以及云服务选项。后端涵盖数据库、存储和鉴权;前端方面,SDK 支持 React、Vue 甚至移动端应用快速接入。作为完全开源免费的项目,既可以使用官方云服务,也能通过 Docker 自行部署完整实例。

数据库核心

进入 Supabase 官网并登录,创建组织与项目即可拥有一个完整的 PostgreSQL 实例。在左侧 Table Editor 中,可以直观地创建表、编辑字段及记录。SQL Editor 则允许直接编写和执行 SQL 语句。Database 菜单下包含了 Schema、函数、触发器、索引等所有基础功能。

插件(Extensions)是 Supabase 的一大亮点。例如安装 PostGIS 插件后,PostgreSQL 便具备了存储地理位置信息的能力,可构建地理信息系统。我们创建一个城市地图表来演示:

CREATE TABLE city_map (
    id SERIAL PRIMARY KEY,
    name TEXT NOT NULL,
    geom GEOMETRY(GEOMETRY, 4326)
);

插入测试数据后,利用插件提供的函数如 ST_Area 计算面积,或使用操作符计算距离,无需额外安装软件包,配置十分便捷。

数据库连接

除了网页操作,Supabase 支持远程直连。点击 Connect 按钮获取连接地址,可接入 DBeaver 或 Java/Python 代码。连接模式分为 Direct Connection(直连)、Session Pooler 和 Transaction Pooler。直连不支持 IPv4,若网络受限可选用 Session Pooler。Transaction Pooler 适合无状态服务,由 Supabase 自动维护连接池,降低数据库压力。

Supabase SDK

Supabase SDK 让前端框架能轻松接入后端。以 Vue 为例,初始化项目后安装 SDK:

npm install @supabase/supabase-js

在组件中引入并配置 URL 与 API Key。虽然将 Key 暴露在前端看似有风险,但得益于 RLS(行级安全策略),只要配置得当,数据访问依然安全。实现用户注册只需几行代码:

await supabase.auth.signUp({
    email: '[email protected]',
    password: 'SecurePassword123!'
});

验证邮件确认后账户生效。登录同理,将方法改为 signInWithPassword 即可,返回结果包含 Session 和用户信息。

RLS 行级安全策略

RLS 源自 PostgreSQL 原生功能,约束特定用户对数据的读写权限。演示前,先创建业务表 user_info,关联系统用户表 auth.users 的 ID,并启用 RLS。

需求设定为:用户仅能查看和修改自己的数据。配置 Select 策略时,选择模板'启用用户查看自身数据',核心逻辑在于匹配登录用户 ID 与表中 user_id 字段。这样即使查询语句写在前端,也无法获取他人数据。

写入保护同样有效。新建 Insert 策略限制只能插入 user_id 匹配当前用户的记录。尝试修改 user_id 插入他人数据时,会收到 403 Forbidden 错误。这解释了为何 Supabase 允许在前端直接操作数据库——安全性由 RLS 兜底。

文件存储

Storage 用于存放文件,适配 S3 协议。创建存储桶后,可拖拽上传文件。安全策略同样适用,例如限制用户仅能操作同名文件夹的文件。前端上传时,路径需严格匹配用户 ID,否则违反策略无法上传。免费版数据库上限 500MB,存储桶 1GB,空间不足时可考虑本地部署。

边缘函数与实时推送

Edge Function 类似 Cloudflare Worker,支持运行边缘代码。RealTime 功能通过监听数据库变化发送 WebSocket 通知,可实现客户端弹窗提醒等实时交互。篇幅所限,此处不再详述具体配置步骤。

MCP 支持

Supabase 支持 MCP(Model Context Protocol),可将数据库能力集成至 AI 工具中,赋予 AI 操作 Supabase 的权限。具体安装与配置可参考官方文档。

Supabase 本地部署指引

若需私有化部署,可访问 Docs 中的 Self Hosting 部分,选择 Docker 方式。克隆源码后,复制 docker 目录文件至本地项目,配置 .env 文件(注意 Windows 下端口需调整)。执行以下命令启动 13 个组件容器:

cd supabase-project
docker compose pull
docker compose up -d

启动后访问 localhost:18000,使用默认凭证登录。自托管版本保留了数据库鉴权、存储、边缘函数等全部功能,SDK 仅需替换地址与 Key 即可正常使用。Supabase 采用 Apache 2.0 协议开源,支持免费商用,这也是其获得广泛支持的原因。

目录

  1. 数据库核心
  2. 数据库连接
  3. Supabase SDK
  4. RLS 行级安全策略
  5. 文件存储
  6. 边缘函数与实时推送
  7. MCP 支持
  8. Supabase 本地部署指引

更多推荐文章

查看全部
  • 使用 Docker Compose UI 配合内网穿透实现远程可视化运维
  • OpenClaw 龙虾机器人本地部署与配置指南
  • C++ STL list 容器底层实现分析
  • 使用 OpenClaw 与飞书构建 7x24 小时自动化运维机器人
  • 职场人士如何自学 Python:目标规划与学习路径
  • 基于 SpringBoot 的图书租借系统设计与实现
  • C++ 基础进阶:引用、内联函数与 nullptr 详解
  • 声源定位算法基础:CBF(延时求和波束形成)
  • QA 一来,大家都要靠边站
  • Java 集成 Umi-OCR 实现本地图片文字提取
  • LangChain 实战:基于网页数据的 RAG 问答及来源溯源
  • Google 秘密计划曝光:AI 或取代人类程序员敲代码
  • 医疗 AI 场景下的模型融合与集成策略实战
  • 医疗 AI 多智能体资源调度:用 Python 构建 MCU 资源池
  • OpenClaw 深度解析:构建从认知到行动的 AI 智能体框架
  • Windows 11 资源管理器增强工具 QTTabBar 中文优化版安装指南
  • AIGC 核心技术解析:生成对抗网络(GAN)应用与原理
  • VS Code GitHub Copilot 登录报错“尚未完成授权”解决方案
  • Spring Boot 集成本地 OCR 服务模块实战
  • 2025 年 AI 工程师 RAG 面试核心问题与解答

相关免费在线工具

  • RSA密钥对生成器

    生成新的随机RSA私钥和公钥pem证书。 在线工具,RSA密钥对生成器在线工具,online

  • Mermaid 预览与可视化编辑

    基于 Mermaid.js 实时预览流程图、时序图等图表,支持源码编辑与即时渲染。 在线工具,Mermaid 预览与可视化编辑在线工具,online

  • 随机西班牙地址生成器

    随机生成西班牙地址(支持马德里、加泰罗尼亚、安达卢西亚、瓦伦西亚筛选),支持数量快捷选择、显示全部与下载。 在线工具,随机西班牙地址生成器在线工具,online

  • Base64 字符串编码/解码

    将字符串编码和解码为其 Base64 格式表示形式即可。 在线工具,Base64 字符串编码/解码在线工具,online

  • Base64 文件转换器

    将字符串、文件或图像转换为其 Base64 表示形式。 在线工具,Base64 文件转换器在线工具,online

  • Markdown转HTML

    将 Markdown(GFM)转为 HTML 片段,浏览器内 marked 解析;与 HTML转Markdown 互为补充。 在线工具,Markdown转HTML在线工具,online