Официальный MCP-сервер Webflow

Сервер Node.js, реализующий Model Context Protocol (MCP) для Webflow с использованием Webflow JavaScript SDK . Позволяет агентам ИИ взаимодействовать с API Webflow. Узнайте больше о Data API Webflow в документации для разработчиков .

ℹ Предварительные условия

• Node.js

• НПМ

• Учетная запись Webflow

Related MCP server: Webflow MCP Server

▶️ Быстрый старт (размещено на рабочих серверах Cloudflare)

Для курсора:

1. Перейдите в Settings → Cursor Settings → MCP

2. Нажмите + Add New Global MCP Server

3. Вставьте следующую конфигурацию (или добавьте часть webflow в существующую конфигурацию)

{
  "mcpServers": {
    "webflow": {
      "command": "npx mcp-remote https://mcp.webflow.com/sse"
    }
  }
}

4. Сохраните, и курсор автоматически откроет новое окно браузера со страницей входа OAuth для авторизации сайтов Webflow, к которым вы хотите предоставить доступ серверу MCP.

Для Клода Десктопа:

1. Откройте Settings → Developer

2. Нажмите Edit Config

3. Откройте claude_desktop_config.json в редакторе кода и вставьте следующую конфигурацию (или добавьте часть webflow в существующую конфигурацию)

{
  "mcpServers": {
    "webflow": {
      "command": "npx",
      "args": ["mcp-remote", "https://mcp.webflow.com/sse"]
    }
  }
}

4. Сохраните файл и перезапустите Claude Desktop (command/ctrl + R). Когда Claude перезапустится, он автоматически откроет новое окно браузера со страницей входа OAuth для авторизации сайтов Webflow, к которым вы хотите предоставить доступ серверу MCP.

Для виндсерфинга:

1. Перейдите в раздел Windsurf - Settings → Advanced Settings

2. Прокрутите вниз до раздела Cascade → Add Server → Add custom server +

3. Вставьте следующую конфигурацию (или добавьте часть webflow в существующую конфигурацию)

{
  "mcpServers": {
    "webflow": {
      "command": "npx",
      "args": ["mcp-remote", "https://mcp.webflow.com/sse"]
    }
  }
}

4. Нажмите Save , и Windsurf автоматически откроет новое окно браузера со страницей входа OAuth для авторизации сайтов Webflow, к которым вы хотите предоставить доступ серверу MCP.

Важное примечание

Все эти методы основаны на пакете mcp-remote npm , который по состоянию на 30.04.2025 все еще считается экспериментальным. Если в какой-то момент у вас возникнут проблемы и вы захотите сбросить токены OAuth, вы можете выполнить следующую команду перед перезапуском клиента MCP:

rm -rf ~/.mcp-auth

▶️ Быстрый старт (локальная установка)

1. Получите свой токен API Webflow

• Перейти на API Playground Webflow

• Войдите в систему и сгенерируйте токен

• Скопируйте токен из генератора запросов

2. Добавьте в свой редактор ИИ

{
  "mcpServers": {
    "webflow": {
      "command": "npx",
      "args": ["-y", "webflow-mcp-server@0.5.1"],
      "env": {
        "WEBFLOW_TOKEN": "<YOUR_WEBFLOW_TOKEN>"
      }
    }
  }
}

Для курсора:

1. Перейдите в Настройки → Настройки курсора → MCP

2. Нажмите + Add New Global MCP Server

3. Вставить конфигурацию

4. Замените YOUR_WEBFLOW_TOKEN на токен, который вы скопировали ранее.

5. Сохранить и перезапустить курсор

Для Клода Десктопа:

1. Откройте Настройки → Разработчик

2. Нажмите Edit Config

3. Откройте claude_desktop_config.json в редакторе кода и вставьте конфигурацию.

4. Замените YOUR_WEBFLOW_TOKEN на токен, который вы скопировали ранее. 5. Сохраните и перезапустите Клода.

❓ Устранение неполадок

Если у вас возникли проблемы с запуском сервера в вашем клиенте MCP, например, Cursor или Claude Desktop, попробуйте выполнить следующие действия.

Убедитесь, что у вас есть действительный токен API Webflow

1. Перейдите на API Playground Webflow , войдите в систему и сгенерируйте токен, затем скопируйте токен из генератора запросов.

2. Замените YOUR_WEBFLOW_TOKEN в конфигурации клиента MCP на скопированный вами токен.

3. Сохраните и перезапустите клиент MCP.

Убедитесь, что у вас установлены Node и NPM.

• Node.js

• НПМ

Выполните следующие команды, чтобы убедиться, что у вас установлены Node и NPM:

node -v
npm -v

Очистите кэш NPM

Иногда очистка кэша NPM может решить проблемы с npx .

npm cache clean --force

Исправление глобальных разрешений пакетов NPM

Если npm -v у вас не работает, а sudo npm -v работает, возможно, вам нужно исправить глобальные разрешения пакетов NPM. Для получения дополнительной информации см. официальную документацию NPM .

Примечание: если вы вносите изменения в конфигурацию оболочки, вам может потребоваться перезапустить оболочку, чтобы изменения вступили в силу.

🛠️ Доступные инструменты

Сайты

sites - list; // List all sites
sites - get; // Get site details
sites - publish; // Publish site changes

Страницы

pages - list; // List all pages
pages - get - metadata; // Get page metadata
pages - update - page - settings; // Update page settings
pages - get - content; // Get page content
pages - update - static - content; // Update page content

Компоненты

components - list // List all components in a site
components - get - content // Get component content (text, images, nested components)
components - update - content // Update component content for localization
components - get - properties // Get component properties (default values)
components - update - properties // Update component properties for localization

CMS

collections - list; // List collections
collections - get; // Get collection details
collections - create; // Create a collection
collection - fields - create - static; // Create a static field
collection - fields - create - option; // Create an option field
collection - fields - create - reference; // Create a reference field
collection - fields - update; // Update a custom field
collections - items - create - item - live; // Create items
collections - items - update - items - live; // Update items
collections - items - list - items; // List collection items
collections - items - create - item; // Create collection items (staged)
collections - items - update - items; // Update collection items (staged)
collections - items - publish - items; // Publish collection items

Пользовательский код

custom code - add - inline - site - script // Register an inline script for a site
custom code - get - registered - site - script - list // List all scripts registered to a site
custom code - get - applied - site - script - list //Get all scripts applied to a site
custom code - delete site custom code // Remove scripts from a site 

🗣️ Подсказки и ресурсы

Эта реализация не включает prompts или resources из спецификации MCP. Однако это может измениться в будущем, когда будет более широкая поддержка в популярных клиентах MCP.

🚧 Режим разработки

Если вы хотите запустить сервер в режиме разработки, вы можете установить зависимости и запустить сервер с помощью следующей команды:

1. Клонировать и установить:

git clone git@github.com:webflow/mcp-server.git
cd mcp-server
npm install

2. Добавьте свой токен в файл .env в корне проекта:

# .env
WEBFLOW_TOKEN=<YOUR_WEBFLOW_TOKEN>

3. Запустить сервер разработки:

npm start

📄 Ресурсы для разработчиков Webflow

• Документация API Webflow

• Webflow JavaScript SDK

⚠️ Известные ограничения

Обновления содержимого статической страницы

Конечная точка pages_update_static_content в настоящее время поддерживает только обновления локализованных статических страниц во вторичных локалях. Обновления статического контента в локали по умолчанию не поддерживаются и приведут к ошибкам.