点击上方卡片关注我

设置星标  分享更多AI 编程出海

当 Claude 不止能写代码，还能直接操作数据库时，AI 编程正在进入一个全新的阶段。

过去，我们用 AI 写前端、生成 API、写文档，但真正能让 AI “动起来”的，是让它能访问真实的数据系统，这正是 Claude Code + Supabase MCP 的强大之处。

这篇文章分享在 Cursor 中安装 Claude Code 插件后，如何配置 Supabase MCP，让 Claude 直接帮你创建表、插入数据、查询结果，真正实现「AI 全栈开发」。

为什么要让 Claude 连接 Supabase？

Claude Code 本身已经很强，它可以帮你生成、重构、解释代码，当它只能“看代码、写代码”时，它仍停留在离线开发助手的层面。

Supabase 的出现，为 Claude 提供了一个“可读写”的世界。Claude 可以直接访问你的数据库；Claude 可以分析数据并生成接口；Claude 可以在上下文中感知数据库结构

换句话说： Claude Code 不再只是一个编码助手，而是一个真正的“AI 开发代理”。

MCP 是什么？

MCP（Model Context Protocol） 是 Anthropic 推出的新协议，用于让 Claude 与外部系统安全通信，比如数据库、文件系统、API 服务，它像一个“标准接口”，把 Claude 和真实世界连接起来：

Claude Code ↔ MCP ↔ Supabase ↔ 你的应用

通过 MCP，Claude 可以执行这些操作：

• 查询数据库；

• 写入数据；

• 调用第三方服务；

• 生成代码并立刻运行。

而 Supabase 则是 Claude 最理想的后端对象：开源 Postgres；自动生成 API；自带鉴权、存储和函数；免费层就能搭建完整后端。

环境准备

目前 Claude Code 的 MCP 插件系统还在逐步开放，@anthropic-ai/mcp-supabase 暂未发布到 npm 官方仓库，因此我们可以采用手动创建脚本的方式配置 Supabase MCP。

Step 1：创建 MCP 目录

mkdir -p ~/.mcp/supabase
cd ~/.mcp/supabase

Step 2：创建连接脚本

新建一个文件 index.js，内容如下：

#!/usr/bin/env node
import { createClient } from "@supabase/supabase-js";

const [,, url, key] = process.argv;

const supabase = createClient(url, key);
console.log("✅ Connected to Supabase:", url);

Step 3：配置 Claude Code

打开或新建配置文件：

~/.mcp/config.toml

在文件中加入以下内容（替换为你的项目地址与密钥）：

[mcp.supabase]
command = "node"
args = ["/Users/你的用户名/.mcp/supabase/index.js", "https://xxx.supabase.co", "your_supabase_key"]

保存退出后，Claude Code 即可在 Cursor 中通过 MCP 连接 Supabase。

Step 4：测试连接

打开 Cursor，进入 Claude 面板输入：

我已经安装了 Supabase MCP，请检查是否可以连接数据库。

如果 Claude 返回：“✅ Connected to Supabase: https://xxx.supabase.co”

说明配置成功，此时 Claude 就能通过 MCP 与 Supabase 交互。

Claude Code + Supabase 实战

1️⃣ 创建数据库表

在 Claude 面板输入：

帮我在 Supabase 数据库中新建一个 users 表，有 id、name、email 三个字段。

Claude 会生成 SQL：

create table users (
  id uuid primary key,
  name text,
  email text,
  created_at timestamp default now()
);

并自动执行（通过 MCP 调用 Supabase）。

2️⃣ 插入数据

Claude 可以直接帮你插入数据：

from supabase import create_client

supabase = create_client(SUPABASE_URL, SUPABASE_KEY)
supabase.table("users").insert({"name": "Miaomiao", "email": "hi@example.com"}).execute()

执行后，你的数据库就会多出一条记录。

3️⃣ 查询数据

输入：

请用 Supabase MCP 查询 users 表的所有用户。

Claude 会调用 MCP 查询接口，并把结果直接展示在对话里，不需要打开 SQL 控制台，Claude 就能帮你完成所有数据库操作。

4️⃣ 结合前端页面

Claude 还能帮你用 Next.js 生成一个简单的用户管理界面：

npx create-next-app my-app

让 Claude 写一个 /api/users 路由，自动调用 Supabase SDK，实现全栈交互。

最后

当 Claude Code 与 Supabase 相连，AI 不再只是在“生成代码”，而是在理解你的应用逻辑、操作你的真实数据。从写代码到操作数据库，从问答到执行命令，Claude Code 正在重塑开发者与工具的关系。

如果你也想体验“AI 全栈开发”的新方式，可以在 Cursor 里安装 Claude Code 插件，并尝试接入 Supabase MCP，你会发现，AI 编程的未来，已经开始了。

推荐阅读

推荐一个第三方 Claude code 共享平台，内容介绍和付费兑换详见文末阅读原文。

Claude Code 太贵且容易封号？国内也能稳定用的新方法来了！

Claude Code 新手必看！分享从 0 到 1 高性价比使用攻略

Claude Code 必备！最常用的 MCP 工具合集（附安装命令）

---

如果你想尝试AI编程出海这个方向，欢迎加入我们。推荐我的 AI 编程出海训练营！

也可扫码或搜索 257735 添加微信，发送暗号「美金」，了解详细信息。