Webflow MCP服务器
这是一个用于控制Webflow Designer的模型上下文协议(MCP)服务器,由Cloudflare的代理SDK提供支持。
特性
- 29个Webflow设计器工具:创建元素、管理文本内容、应用CSS类、使用组件等
- 前端桥:将MCP客户端(如Cursor)连接到Webflow Designer扩展
- 有状态的连接:使用Cloudflare持久对象进行持久状态管理
- 命令队列系统:处理MCP服务器和前端之间的异步通信
- CORS已启用:已完全配置浏览器兼容性
可用工具
该服务器为Webflow Designer提供了29个工具,包括:
网元管理
create_element-创建新元素(剖面、分区块、标题等)get_selected_element-获取当前所选元素的详细信息set_selected_element-按ID选择元素remove_element-移除一个元素get_all_elements-列出页面上的所有元素
文本内容
set_text_content-设置元素的文本内容get_text_content-获取元素的文本内容
CSS类
create_semantic_class-使用样式创建新的CSS类apply_semantic_class-将类应用于元素update_semantic_class-更新现有类list_semantic_classes-列出可用课程
组件和资产
create_component_instance-创建组件实例list_components-列出可用组件upload_asset-上传图像和其他资产set_image_asset-设置图像源
还有更多。..
端点
/sse-MCP客户端的SSE连接/mcp/bridge/events-前端网桥轮询端点/mcp/command-result-命令结果提交/status-服务器状态/health-健康检查
发展
npm install
npm run dev部署
npm run deploy与Webflow设计器扩展一起使用
- 在浏览器中安装Webflow Designer扩展
- 开放式Webflow设计器
- 扩展将自动连接到此MCP服务器
- 使用MCP客户端(例如Cursor)控制Webflow Designer
建筑
此服务器使用Cloudflare的代理SDK和持久对象进行有状态连接和持久命令队列。桥接架构允许MCP客户端和Webflow Designer扩展之间的异步通信。
