Cline MCP сервер: генерація зображень прямо з редактора

Віддалений MCP-сервер у Cline — це розміщений набір інструментів, які агент викликає через HTTP: ви додаєте один блок у JSON-налаштування MCP, і Cline отримує можливості, яких жодна мовна модель не має сама по собі. Генерація файлів зображень — найяскравіший приклад. Cline рефакторить компоненти, запускає тести та пише міграції бази даних, але повністю зупиняється на фразі «а сюди вставте фотографію продукту».

Повне налаштування для тих, хто поспішає. Створіть ключ у профілі BananaBanana, відкрийте налаштування MCP у Cline і додайте:

{
  "mcpServers": {
    "bananabanana": {
      "type": "streamableHttp",
      "url": "https://bananabanana.pro/api/mcp",
      "headers": {
        "Authorization": "Bearer bb_live_YOUR_KEY"
      },
      "disabled": false,
      "autoApprove": ["list_models", "get_account", "get_result"]
    }
  }
}

У панелі з'явиться десять інструментів. Списання за зображення починаються від $0.03 за одиницю з передплаченого балансу, за відео — від $0.10. Рядок type обов'язковий, і нижче я поясню, до якої неприємної помилки призводить його відсутність.

Навіщо додавати генератор зображень у Cline?

Уся логіка Cline будується на принципі «опиши очікуваний результат, нехай агент зробить ітерації». Це чудово працює, доки результатом не стає візуальний файл. У цей момент цикл переривається і починається ручна робота: відкрити браузер, написати промпт, завантажити, перейменувати, перемістити в public/, повернутися в редактор і згадати, на чому зупинився. П'ять хвилин на кожен асет, і втрата концентрації коштує значно дорожче за цей час.

З MCP-інструментом агент бере весь цикл на себе. Він формулює промпт, викликає generate_image, зберігає готовий файл у вказану папку та оновлює код. Вам залишається лише перевірити diff.

Економічна модель також ідеально підходить аудиторії Cline. Cline працює за моделлю «власна модель», тому його користувачі звикли платити за фактичне використання, а не щомісячну підписку. Ціни на генерацію влаштовані аналогічно. Жодних тарифних планів, ліцензій на робоче місце чи щомісячних мінімумів. Зображення від $0.03, відео від $0.10, які списуються з балансу, що поповнюється за потреби.

Альтернатива — локальний MCP-сервер, що означає окремий процес Node або Python на вашому комп'ютері, власний API-ключ провайдера, ліміти та білінг в іншому кабінеті. Віддалений ендпоінт усуває обидві проблеми. Генерація відбувається на нашій стороні через той самий пайплайн, що й веб-генератор, а єдиний ваш реквізит — один ключ, який можна відкликати будь-якої миті.

Як додати віддалений MCP-сервер у Cline?

Є три шляхи з однаковим результатом. Нижченаведені деталі перевірено за офіційною документацією Cline MCP станом на 20 серпня 2026 року.

Через графічний інтерфейс. Натисніть іконку MCP Servers на панелі інструментів Cline, відкрийте вкладку Remote Servers, заповніть назву сервера, URL https://bananabanana.pro/api/mcp і виберіть транспорт Streamable HTTP. Натисніть Add Server. Потім додайте заголовок Authorization: форма допомагає швидко створити запис, але ключ зберігається в JSON.

Через редагування JSON. Та сама іконка, вкладка Configure, потім кнопка Configure MCP Servers для відкриття конфігураційного файлу розширення. Він розташований у глобальному сховищі VS Code, у папці з назвою saoudrizwan.claude-dev (ідентифікатор розширення досі містить ім'я початкового автора, що часто заплутує тих, хто шукає слово «cline»). У CLI шлях значно простіший: ~/.cline/mcp.json, а команда cline mcp запускає покроковий майстер.

З термінала. Команда cline config mcp --json виводить поточну завантажену конфігурацію — найшвидший спосіб перевірити, чи збереглися зміни.

Який би спосіб ви не обрали, адреса робочого ендпоінта — https://bananabanana.pro/api/mcp. Не використовуйте /mcp, оскільки це сторінка документації для людей, яка на запити POST повертає HTML. Наша сторінка сервера MCP містить універсальний шаблон і таблицю сумісності:

Зробіть безкоштовний тестовий виклик перед списанням коштів. Функція get_account повертає баланс, ім'я ключа та денний ліміт; list_models виводить перелік доступних моделей з актуальними цінами. Обидва виклики безкоштовні та підтверджують авторизацію за одну секунду.

Практичний сценарій: генерація заглушок для каталогу в режимі Act

Саме тут Cline розкриває свій потенціал, і це зовсім не схоже на разове створення одного головного банера. Спочатку режим Plan: описуємо каталог на дванадцять товарів, кожному з яких потрібна заглушка в єдиному стилі, і даємо Cline спланувати цикл до внесення змін у файли. Потім режим Act виконує задачу.

Фірмовий стиль задається базовою фразою, яка повторюється в кожному виклику, де змінюється лише сам предмет. Цілісність серії забезпечується незмінною частиною промпту, а не тим, що модель пам'ятає свої дії хвилину тому:

→ generate_image {"prompt": "A photorealistic overhead product shot of a
   small monstera in a matte terracotta pot on a pale linen backdrop, soft
   diffused window light from the left, 50mm lens, subtle natural shadow,
   generous empty space around the subject, no text",
   "model": "nano-banana-pro", "aspect_ratio": "4:5"}
← {"job_id": "…", "status": "processing", "cost_charged_usd": 0.11,
   "balance_remaining_usd": 1110.65}

Другий товар за тим самим стилістичним шаблоном, але з іншою рослиною та ракурсом:

Дванадцять таких зображень на Nano Banana Pro коштують $1.32. На стандартній моделі nano-banana-2-lite сума складе $0.36, і для тимчасових плейсхолдерів, які дизайнер згодом замінить, це був би мій вибір; наш посібник з Lite описує межі застосування доступної моделі. У цій статті обрано Pro, оскільки обидва приклади показані на сторінці в повному розмірі.

Пакетне створення — це саме той випадок, коли потрібні запобіжники. Їх передбачено два. Для кожного MCP-ключа можна встановити денний ліміт у доларах у розділі Профіль → MCP API Keys: якщо цикл вийде з-під контролю, витрати зупиняться на вказаній сумі. Крім того, запити на кілька зображень (number_of_images більше 1) працюють як відео: перший виклик повертає розрахунок вартості й нічого не списує, доки агент не надішле повторний запит із confirm_cost.

Генерація відео доступна з того самого чату з тим самим правилом підтвердження. Чотирисекундний ролик без звуку в 720p на Veo 3.1 Lite коштує від $0.10, а Omni Flash тарифікується по $0.10 за секунду й завжди містить звук, тобто трисекундний ролик обійдеться в $0.30. Рендеринг триває від однієї до десяти хвилин; оскільки generate_video миттєво повертає ідентифікатор завдання, Cline продовжує редагувати код і фоново опитує get_result.

Підводні камені Cline, про які варто знати заздалегідь

П'ять практичних моментів у порядку того, скільки часу вони допоможуть заощадити.

1. "type": "streamableHttp" пишеться саме так, а пропуск параметра призводить до тихої помилки. Документація однозначна: якщо поле пропущено, клієнт за замовчуванням перемикається на застарілий транспорт sse для зворотної сумісності. Старий SSE передбачає відкриття клієнтом з'єднання GET в очікуванні потоку подій. Наш ендпоінт працює через stateless Streamable HTTP, тому на запит GET відповідає 405 Method Not Allowed (перевірено під час написання статті: curl -i https://bananabanana.pro/api/mcp повертає 405). У Cline це виглядає як неможливість підключення з помилкою, де немає згадки про відсутнє поле. Написання через дефіс streamable-http дає той самий збій.

2. Ключ зберігається у файлі у відкритому вигляді. Документація Cline рекомендує використовувати змінні оточення, проте підстановка змінних всередині об'єкта headers для віддалених серверів не документована (на відміну від синтаксису ${env:…} у Cursor або ${file:…} у Windsurf). Перевагою є розташування: файл конфігурації знаходиться у глобальному сховищі VS Code, а не в репозиторії проєкту, тому випадково закомітити ключ у git неможливо. Проте ставтеся до нього як до локального секрету: налаштуйте денний ліміт і відкликайте ключ з профілю, якщо передаєте робочий ноутбук.

3. Налаштування Auto Approve є ширшим, ніж здається. У панелі Auto Approve у Cline пункт «Use MCP servers» — це єдиний перемикач для всієї категорії MCP-інструментів, тому його ввімкнення схвалює як безкоштовні, так і платні виклики. Детальне керування здійснюється в конфігурації через масив autoApprove. Я рекомендую вказати там три безкоштовні виклики (list_models, get_account, get_result); це позбавить від зайвих запитів під час роботи, тоді як кожен платний рендер все одно запитуватиме підтвердження.

4. Режим YOLO у поєднанні з платними інструментами потребує обачності. Режим YOLO автоматично схвалює всі дії: зміни у файлах, команди термінала, дії у браузері та виклики MCP. Документація не дарма позначає його як небезпечний. Наш крок підтвердження вартості тут не допоможе, оскільки автономний агент підтвердить обидві частини діалогу. Єдиний захист — денний ліміт витрат на ключ. Встановіть його до активації режиму YOLO.

5. Немає встановлення з маркетплейсу, а корпоративні середовища мають власні правила. Розширення VS Code на базі офіційного SDK більше не містить інтерфейсу MCP Marketplace, тому редагування JSON залишається стандартним шляхом. Адміністратори команд мають власний інструмент: параметр remoteMCPServers у віддаленій конфігурації організації централізовано розгортає сервер для всіх користувачів, а blockPersonalRemoteMCPServers забороняє додавати власні сервери. Якщо ви налаштовуєте робоче середовище для команди, підключіть сервер централізовано та надайте кожному розробнику персональний ключ.

Чесно зазначимо обмеження з нашого боку: метод generate_speech повертає підписане посилання на WAV-файл, а не вбудований плеєр у панелі Cline, тому для прослуховування аудіо потрібно відкрити файл. Зображення ж повертаються з невеликим попереднім переглядом поруч із посиланням. Оскільки Cline підтримує відображення зображень у результатах інструментів з 2025 року, у всіх актуальних версіях попередній перегляд працює коректно.

Чи підтримує Cline авторизацію через OAuth для MCP?

В офіційній документації такої можливості немає, і про це варто сказати прямо, оскільки в різних клієнтах ситуація відрізняється. Документація Cline охоплює stdio, SSE та Streamable HTTP, описуючи авторизацію через власні заголовки. Підтримки OAuth там немає. Відповідний запит на додавання OAuth відкритий у репозиторії Cline із серпня 2025 року та залишається відкритим станом на 20 серпня 2026 року.

На практиці це не викликає жодних проблем. Наш сервер приймає як токени OAuth 2.1, так і стандартні API-ключі Bearer, і саме під ключі побудований Cline. Це варіант, який я особисто рекомендую: створення ключів безкоштовне, ви можете мати кілька активних ключів, і кожен веде окремий журнал використання (інструмент, модель, вартість, фрагмент промпту) разом із денним лімітом. Коли підрядник завершує роботу, ви відкликаєте один конкретний ключ без впливу на решту команди.

Для ізоляції витрат створюйте окремий ключ під кожен проєкт. Журнал використання чітко покаже, скільки коштувала розробка внутрішньої панелі керування, а скільки — промо-сайту, що дуже зручно під час виставлення рахунків.

Скільки коштували медіафайли для цієї статті?

Стандартні ціни за генерацію — ті самі цифри, які list_models передає агенту:

Корисна деталь при поповненні балансу: депозити від $50 додають +5% бонусних коштів, від $100 — +10%, а активний промокод нараховує ще +10% зверху. Обидва бонуси розраховуються від базової суми, тому поповнення на $100 з промокодом зарахує $120.

Той самий ключ працює в інших клієнтах: якщо ви використовуєте Cursor або VS Code, нічого заново налаштовувати не потрібно — єдиний баланс, спільна історія та один ендпоінт. Посібник з Cursor та налаштування для VS Code розглядають роботу з ними. Створіть ключ і доручіть Cline створити вашу першу партію зображень.

FAQ

Чи підтримує Cline віддалені MCP-сервери через Streamable HTTP?

Так, і це рекомендований транспорт в офіційній документації Cline. Віддалений сервер задається через url, type зі значенням streamableHttp та об'єкт headers для авторизації; застарілий SSE збережено для сумісності. Завжди вказуйте type явно: без нього клієнт повертається до SSE, що не спрацює із сучасним stateless-ендпоінтом. Перевірено за офіційною документацією станом на 20 серпня 2026 року.

Де знаходиться файл налаштувань MCP у Cline?

У двох місцях залежно від способу запуску. Розширення для VS Code зберігає його у глобальному сховищі редактора, у папці з ID розширення saoudrizwan.claude-dev; найпростіше відкрити його через кнопку Configure MCP Servers на вкладці Configure панелі MCP. Утиліта командного рядка використовує ~/.cline/mcp.json. Обидва варіанти використовують однакову структуру об'єкта mcpServers.

Чи потрібен власний хмарний акаунт для генерації зображень у Cline?

Ні. Локальний сервер генерації потребує власного ключа провайдера з лімітами та оплатою в його системі. Віддалений сервер виконує генерацію на нашій інфраструктурі, тому єдиний потрібний реквізит — ключ bb_live_ з вашого профілю. Новим акаунтам нараховується $0.20 стартового балансу, чого вистачає на шість зображень на базовій моделі до здійснення будь-яких платежів.

Як запобігти надмірним витратам агента?

Використовуйте всі три рівні захисту. Залиште в autoApprove лише безкоштовні інструменти, щоб кожен платний рендер вимагав підтвердження. Встановіть денний ліміт у доларах у розділі Профіль → MCP API Keys — це єдиний механізм, який продовжує діяти навіть у режимі YOLO. І використовуйте двоетапне підтвердження вартості: виклики відео та пакетних зображень спочатку повертають розрахунок і не списують кошти, доки агент не повторить запит із параметром confirm_cost.

Чому Cline не підключається до MCP-сервера?

Перевірте наступні пункти по черзі. Переконайтеся, що параметр "type": "streamableHttp" вказано саме у camelCase — інакше Cline спробує підключитися через SSE, і наш ендпоінт поверне 405 на запит GET. Перевірте, щоб адреса закінчувалася на /api/mcp, а не на /mcp. Переконайтеся, що заголовок авторизації має вигляд Bearer bb_live_... без зайвих пробілів (недійсний або відкликаний ключ повертає 401). Якщо підключення є, але інструменти не з'явилися, перезавантажте сервер у панелі MCP. У корпоративних мережах перевірте, чи не заблоковані персональні віддалені сервери політиками безпеки компанії.