swebsy

@swebsy/mcp — 将编码 Agent 连接到 Swebsy

使用你已经付费的编码 Agent 构建和编辑真实网站——无需支付按 token 计费的 AI 费用。

@swebsy/mcp 是一个 MCP 服务，可让 Claude Code、Codex、Cursor、Windsurf、Cline、GitHub Copilot——或任何支持 Model Context Protocol 的 Agent——操控一个已打开的 Swebsy Studio 标签页。你的 Agent 可以发现模板、创建并打开网站、重命名项目、添加板块、编辑内容、切换页面、设置所有网站选项（SEO、favicon、字体、分析、robots.txt、部署目标）、截取屏幕截图，并导出完成的网站，所有操作都通过本地 127.0.0.1 WebSocket 中继完成。任何内容都不会经由我们的服务器转发；Studio 会在任何内容通过桥接传输之前，对机密信息（API 密钥、部署令牌、聊天记录）进行脱敏。你的编码 Agent 所属服务的服务条款和隐私政策仍适用于它接收的非机密内容。

在用 ChatGPT 或 Claude（应用）？ 你不需要这个软件包。在 ChatGPT 中添加 https://mcp.swebsy.com/mcp 作为自定义应用，或在 Claude 中添加为自定义连接器，登录 Swebsy 并点击 Allow — 设置步骤。这个软件包适用于在你机器上运行的编码 Agent。

什么是 Swebsy？

Swebsy 是一款可视化网站构建工具，具有真正的所有权模式：你可以通过可视化方式构建、导出真实文件（HTML/CSS/JS），并在任意位置发布——没有平台锁定，也不要求使用专有托管服务。免费方案完全在本地运行；无需账户。

为什么要用 MCP，而不是内置 AI 面板？

大多数“AI 网站构建工具”都会附加一个聊天面板，并在你已经订阅的大模型费用之外，按 token 向你收费。Swebsy 采取相反的做法——它将编辑器作为工具开放，让你自己的 Agent 来操控：

• 没有按 token 计费的 API 费用。 Swebsy 不参与大模型费用结算。你可以使用自己已经付费订阅的 Claude、Cursor、Codex 或 Copilot 方案。
• 在你的机器上运行。 Agent 通过本地 127.0.0.1 桥接与已打开的 Studio 标签页通信——提示词和内容不会被发送出去计费。
• 使用你自己的 Agent。 你的模型、你的自定义指令、你的工作流——而非受限的封装工具。任何支持 MCP 的 Agent 都能使用。
• 输出归你所有。 Agent 构建的所有内容都会导出为真实、可移植的文件，你可以在任意位置托管。

设置

一条命令即可将 Swebsy 注册到检测到的所有受支持的 Agent（Claude Code、 Codex、Cursor、Windsurf、VS Code、Cline）：

npx -y @swebsy/mcp setup

它不会更改现有的 swebsy 条目，也不会重写无法解析的配置文件；它会报告每个 Agent 的结果。也可以手动注册：

Claude Code

claude mcp add swebsy -- npx -y @swebsy/mcp

Codex

codex mcp add swebsy -- npx -y @swebsy/mcp

Cursor — 添加到 ~/.cursor/mcp.json（或项目的 .cursor/mcp.json）：

{
  "mcpServers": {
    "swebsy": { "command": "npx", "args": ["-y", "@swebsy/mcp"] }
  }
}

GitHub Copilot（VS Code）

code --add-mcp '{"name":"swebsy","command":"npx","args":["-y","@swebsy/mcp"]}'

Windsurf — 将相同的 JSON 代码块添加到 ~/.codeium/windsurf/mcp_config.json。

Cline — 将相同的 JSON 代码块添加到 cline_mcp_settings.json，或使用扩展中的 MCP Servers → Configure 按钮打开该文件：

• macOS ~/Library/Application Support/Code/User/globalStorage/saoudrizwan.claude-dev/settings/cline_mcp_settings.json
• Linux ~/.config/Code/User/globalStorage/saoudrizwan.claude-dev/settings/cline_mcp_settings.json
• Windows %APPDATA%\Code\User\globalStorage\saoudrizwan.claude-dev\settings\cline_mcp_settings.json

Cline CLI（npm i -g cline）与扩展程序是分开安装的，使用独立的配置文件 ~/.cline/data/settings/cline_mcp_settings.json，并带有嵌套的 transport 代码块：

{
  "mcpServers": {
    "swebsy": {
      "transport": { "type": "stdio", "command": "npx", "args": ["-y", "@swebsy/mcp"] }
    }
  }
}

或者让它自己的 CLI 写入配置：cline mcp add swebsy --yes -- npx -y @swebsy/mcp。

配对

1. 运行 npx -y @swebsy/mcp setup
2. 重启 Agent。
3. 对它说：“用 Swebsy 给我构建一个落地页。”首次请求会打开 Studio 并连接它。

每个浏览器只需连接一次。只要没有 Studio 标签页处于连接状态，下次调用工具时就会自动打开 Studio 并重新连接（最多等待 20 秒）。会话保存在 ~/.swebsy/agent-<port>.session 中，因此即使桥接服务重启，会话也会保留。

Claude Code 还会列出 /swebsy:swebsy (MCP) 提示词，引导 Agent 完成连接并打开网站。其他 Agent 是否以及如何显示 MCP 提示词各不相同。

手动配对（浏览器未打开、Swebsy 在其他浏览器中运行，或已设置 SWEBSY_NO_OPEN=1）：

1. 让 Agent 运行 swebsy_start_pairing 工具。它会自动在默认浏览器中打开配对链接，同时返回链接、原始代码和中继端口。
2. Swebsy 会自动连接，并在代码使用后从地址栏中移除该代码。（设置 SWEBSY_NO_OPEN=1 可跳过自动打开，仅获取链接。）
3. 如果浏览器未打开，或 Swebsy 在其他浏览器中运行，请在该浏览器中手动打开返回的链接，或使用 Global settings → Coding agents → Didn't connect? Pair by hand 下的备用字段：粘贴原始代码；除非你更改了 SWEBSY_AGENT_PORT，否则端口保持为 37373；然后点击 Connect。
4. 像往常一样向 Agent 提示，它会通过 swebsy_* 工具操控标签页。

请保持 Studio 标签页处于打开状态。如果浏览器将其置于休眠状态，工具会返回 tab_unresponsive，直到你点击该标签页。将其固定可能会有帮助；也可以在 Chrome 的 Settings → Performance → “Always keep these sites active” 中添加 Studio。

完整指南：https://docs.swebsy.com/settings/ai-coding-agent/

多个 Agent

多个编码 Agent 可以共用一个已配对的 Studio 标签页。在每个 Agent 中注册 @swebsy/mcp，并为每个服务使用相同的 SWEBSY_AGENT_PORT（默认值为 37373）。第一个 MCP 进程会启动本地代理；后续进程会自动加入，因此 Studio 只需配对一次。

Studio 会显示已连接 Agent 列表及其活动。代理会按顺序处理各 Agent 的命令，让编辑器一次只处理一条命令，并将每条命令的结果、截图和导出内容返回给发起请求的 Agent。一个 Studio 标签页一次只能与一个代理配对；与另一个标签页配对会撤销之前的标签页配对。

Agent 可以做什么

配对后，Agent 可以在 Home 或 Studio 中工作。它可以刷新并列出已安装的模板，创建标准空白站点或原样导入模板，列出已保存站点的元数据，按 ID 打开站点，并重命名站点内部使用的 Swebsy 名称。名称可以重复；ID 才是权威标识。

调用 swebsy_create_site 或 swebsy_open_site 后，轮询 swebsy_status，直到出现预期的 siteId 且 editorReady 为 true。随后，Agent 可以读取页面树、添加和编辑分区、创建页面并建立链接、插入区块、管理可复用符号——包括重复使用符号并为每个实例设置不同内容，同时保持样式同步——在任意视口尺寸下截取屏幕截图，并导出项目。

swebsy_list_sites 只返回元数据——绝不包含页面内容、缩略图、资源、修订记录或设置。由 Agent 驱动的创建／重命名分析数据只包含来源、模板和站点 ID，绝不包含内部名称或站点内容。

配置

环境变量	默认值	用途
SWEBSY_AGENT_PORT	37373	本地中继监听的端口
SWEBSY_AGENT_DIR	工作区 .swebsy-agent	屏幕截图／导出文件的存放位置
SWEBSY_APP_URL	https://studio.swebsy.com	swebsy_start_pairing 链接的 Studio 源（本地／自托管时设置）
SWEBSY_NO_OPEN	(unset)	设置后跳过在浏览器中自动打开配对链接

从源代码构建

使用此项目只需安装已发布的软件包；源代码可供阅读、审查或修改。

git clone https://github.com/swebsy/MCP.git
cd MCP
npm install
npm test
npm run build      # -> dist/server.js

将 Agent 指向本地构建版本，而不是 npm：

claude mcp add swebsy -- node /absolute/path/to/MCP/dist/server.js

此仓库是生成的镜像，每次发布时都会从 Swebsy 主仓库的 mcp/ 目录生成快照。下次同步时，这里的每个文件都会被覆盖，因此针对本仓库提交的拉取请求会被抹去，而不会合并——请改为提交 issue，我们会在上游应用更改。

链接

• 网站：https://swebsy.com
• 设置指南：https://docs.swebsy.com/settings/ai-coding-agent/
• npm：https://www.npmjs.com/package/@swebsy/mcp
• 源代码：https://github.com/swebsy/MCP

许可证

MIT