Webflow MCP Server

此MCP服务器使Claude能够与Webflow的API进行交互。

<a href="https://glama.ai/mcp/servers/un9r0vtmku"> <img width="380" height="200" src="https://gips1.baidu.com/it/u=3614984360,1289179518&fm=3081&app=3081&f=PNG?w=760&h=400" alt="Webflow Server MCP服务器" /> </a>

预备条件

• Node.js（v16或更高版本）
• Claude桌面应用程序
• Webflow账户
• Webflow API令牌（站点令牌或OAuth访问令牌）

设置说明

1. 创建Webflow API令牌

• 登录到您的Webflow账户
• 导航至站点设置 > 应用程序与集成
• 生成一个新的API令牌
• 复制令牌值（您将无法再次查看它）

或者，您也可以生成一个OAuth访问令牌。

2. 初始项目设置

安装依赖项：

npm install

3. 配置环境变量

创建一个用于本地开发的.env文件（不要提交此文件）：

WEBFLOW_API_TOKEN=your-api-token

4. 配置Claude桌面

打开您的Claude桌面配置文件：

对于MacOS：

code ~/Library/Application\ Support/Claude/claude_desktop_config.json

对于Windows：

code %AppData%\Claude\claude_desktop_config.json

添加或更新配置：

{
    "mcpServers": {
        "webflow": {
            "command": "node",
            "args": [
                "/ABSOLUTE/PATH/TO/YOUR/build/index.js"
            ],
            "env": {
                "WEBFLOW_API_TOKEN": "your-api-token"
            }
        }
    }
}

保存文件并重新启动Claude桌面。

通过Smithery安装

要通过Smithery自动安装Webflow MCP服务器：

npx -y @smithery/cli install @kapilduraphe/webflow-mcp-server --client claude

可用工具

该服务器当前提供以下工具：

get_sites

检索所有可由认证用户访问的Webflow站点列表。返回详细信息包括：

• 站点显示名称和短名称
• 站点ID和工作区ID
• 创建、最后更新和最后发布日期
• 预览URL
• 时区设置
• 自定义域名配置
• 本地化设置（主要和次要区域）
• 数据收集偏好

get_site

根据ID检索特定Webflow站点的详细信息。需要siteId参数，并返回与get_sites相同的单个站点详细信息。

类型定义

interface WebflowApiError {
    status?: number;
    message: string;
    code?: string;
}

interface WebflowCustomDomain {
    id: string;
    url: string;
    lastPublished: string;
}

interface WebflowLocale {
    id: string;
    cmsLocaleId: string;
    enabled: boolean;
    displayName: string;
    redirect: boolean;
    subdirectory: string;
    tag: string;
}

interface WebflowSite {
    id: string;
    workspaceId: string;
    createdOn: string;
    displayName: string;
    shortName: string;
    lastPublished: string;
    lastUpdated: string;
    previewUrl: string;
    timeZone: string;
    parentFolderId?: string;
    customDomains: WebflowCustomDomain[];
    locales: {
        primary: WebflowLocale;
        secondary: WebflowLocale[];
    };
    dataCollectionEnabled: boolean;
    dataCollectionType: string;
}

错误处理

服务器处理各种错误场景：

环境错误

• 缺少WEBFLOW_API_TOKEN
• 无效的API令牌

故障排除

常见问题

工具未出现在Claude中

• 检查Claude桌面日志
• 验证WEBFLOW_API_TOKEN是否正确设置
• 确保index.js路径是绝对且正确的

认证错误

• 验证您的API令牌是否有效
• 检查令牌是否有必要的权限
• 确保令牌没有过期

查看日志

要查看服务器日志：

对于MacOS/Linux：

tail -n 20 -f ~/Library/Logs/Claude/mcp*.log

对于Windows：

Get-Content -Path "$env:AppData\Claude\Logs\mcp*.log" -Wait -Tail 20

环境变量

如果您遇到环境变量错误，请验证：

• WEBFLOW_API_TOKEN：应为有效的API令牌

安全注意事项

• 保护好您的API令牌
• 不要将凭证提交到版本控制中
• 使用环境变量存储敏感数据
• 定期轮换API令牌
• 监控Webflow中的API使用情况
• 为API令牌使用最低必需的权限

支持

如果您遇到任何问题：

• 查看上面的故障排除部分
• 审查Claude桌面日志
• 检查服务器的错误输出
• 查看Webflow的API文档

许可证

MIT许可证 - 详情请参阅LICENSE文件。