В этом уроке я расскажу как можно использовать ComfyUI в роли API и быстро создать веб‑приложение с доступом из мира. В приложении я смогу оперативно настраивать интерфейс под меняющиеся задачи без программирования.

Подготовка рабочего процесса API

Для примера я взял шаблон рабочего процесса (Workflow) «Flux.2 [Klein] 4B: текст в изображение».

Список готовых шаблонов ComfyUI
Список готовых шаблонов ComfyUI

Протестирую работу и делаю экспорт для API. Открываю json‑файл и копирую содержимое в буфер обмена.

ComfyUI - Экспорт для API
ComfyUI — Экспорт для API

Локальное тестирование API в api2app

Сначала протестирую API локально. Для этого запущу ComfyUI в режиме CORS:

python main.py --enable-cors-header https://api2app.org

Перехожу на сайте api2app в раздел «API» и нажимаю кнопку «Добавить новый API». Открываю вкладку «Сырые данные», создаю в поле объект с ключём «prompt» и вставляю скопированный JSON. Затем меняю метод запроса на POST и URL на такой:

http://127.0.0.1:8188/prompt
api2app - Создание конфигурации API
api2app — Создание конфигурации API

Нажимаю кнопку «Тест» в режиме «Браузер», получаю ответ с идентификатором задачи в очереди:

api2app - Тестирование API
api2app — Тестирование API

Для локального применения можно использовать стандартное API ComfyUI, но если захочется включить доступ из мира, то лучше использовать дополнительный пакет: https://github.com/Comfy‑Org/comfy‑api‑proxy

Устанавливаю пакет:

pip install comfy-api-proxy

Запускаю прокси с ключём авторизации и CORS:

comfy-api-proxy --enable-cors-header https://api2app.org --token=ea3092cf-7856-4ef8-988b-8f413f299c50

Теперь адрес для запроса такой:

http://127.0.0.1:8189/api/v2/jobs

Ключ в теле запроса тоже изменился, вместо «prompt» теперь нужно использовать ключ «workflow»:

api2app - Конфигурация API для создания задачи генерации изображения
api2app — Конфигурация API для создания задачи генерации изображения

Также нужно добавить заголовок «Authorization» с ключём, который я указал при запуске прокси:

api2app - Заголовок с ключём авторизации
api2app — Заголовок с ключём авторизации

Обратите внимание, что в режиме «Браузер» поле авторизации не должно быть приватным (кнопка с иконкой замка).

Нажимаю кнопку «Сохранить» и перехожу снова в раздел «API». Теперь нужно создать конфигурацию API для отслеживания статуса задачи.

Создаю новую конфигурацию API с методом GET и таким URL:

http://127.0.0.1:8189/api/v2/jobs/8fd2d6cb-0150-4d10-9b91-283eeef9ad5c

Нажимаю кнопку «Тест» в режиме «Браузер».

api2app - Тестирование конфигурации результата задачи
api2app — Тестирование конфигурации результата задачи

Если генерация изображения завершена, то в ответе будет URL для получения результата и идентификатор контента (asset_id → id):

  "outputs": [
    {
      "node_id": "9",
      "name": "0e2294e1-3666-466f-b579-8a8eb9318e81_00001_.png",
      "type": "image",
      "content_type": "image/png",
      "size_bytes": 0,
      "id": "eyJqIjogIjhmZDJkNm...",
      "hash": null,
      "url": "http://127.0.0.1:8189/api/v2/assets/eyJqIjogIjhmZDJkNm.../content",
      "url_expires_at": "2026-10-18T14:12:40.658748+00:00",
      "job_id": "8fd2d6cb-0150-4d10-9b91-283eeef9ad5c"
    }
  ],

3-я конфигурация API — просмотр изображения. Метод запроса: GET, URL такой:

http://127.0.0.1:8189/api/v2/assets/{asset_id}/content

asset_id — идентификатор контента в ответе запроса «/api/v2/jobs/».

api2app - Конфигурация API для получения изображения
api2app — Конфигурация API для получения изображения

Созданные конфигурации API, нужно сделать публичными (можно скрытыми).

api2app - Публикация API
api2app — Публикация API

Создание графического интерфейса

Пришло время создать веб‑приложение с графическим интерфейсом. Для этого перехожу в раздел «Приложения» → «Мои приложения» и нажимаю кнопку «Создать новое приложение».

Добавляю элемент «Текстовая область» и кнопку.

api2app - Создание графического интерфейса
api2app — Создание графического интерфейса

Также добавлю элементы «Прогресс операции» и «Изображение».

api2app - Элементы приложения
api2app — Элементы приложения

Теперь осталось настроить действия ввода и вывода для элементов. Нажимаю кнопку «Действие ввода» элемента «Текстовая область» (описание изображения).

api2app - Действие ввода
api2app — Действие ввода

В окне настроек действия ввода нужно найти конфигурацию API и выбрать поле, в котором находится текстовый промпт для генерации изображения. В моём случае это поле «Prompt.76.Inputs.Value».

api2app - Поле промпта
api2app — Поле промпта

Для элемента «Кнопка» действие ввода — это же API и действие «Отправить».

api2app - Действие ввода для кнопки
api2app — Действие ввода для кнопки

Также нужно добавить скрытое поле с названием «Идентификатор задачи». В него будет поступать значение идентификатора задачи и далее будет отправляться запрос на получение результата операции.

Действие вывода для этого поля: «comfyui — api — jobs post» → «id».

api2app - Действие вывода для скрытого поля "Идентификатор задачи"
api2app — Действие вывода для скрытого поля «Идентификатор задачи»

Действие ввода для этого же скрытого поля:
«comfyui — api — job» → последняя часть URL (id задачи).

api2app - Действие ввода для скрытого поля "Идентификатор задачи"
api2app — Действие ввода для скрытого поля «Идентификатор задачи»

API «comfyui — api — job» (получение результата операции) не имеет кнопки, поэтому запрос будет отправлен сразу, как только скрытое поле получит значение идентификатора задачи.

Теперь нужно настроить элемент «Прогресс операции». Сначала настрою действие вывода. Выбираю конфигурацию «comfyui — api — job» и поле «Value», то есть полное значение — объект.

api2app - Действие вывода для элемента "Прогресс операции"
api2app — Действие вывода для элемента «Прогресс операции»

Важно правильно настроить параметры для этого элемента. Нажимаю кнопку «Параметры». Нужно задать имена полей и возможные значения для статуса:

api2app - Параметры элемента "Прогресс операции"
api2app — Параметры элемента «Прогресс операции»

Значение статуса приходит в поле «status», это поле может иметь значения: queued, running, succeeded, failed. Также указываю название поля с идентификатором операции (id). Ещё нужно ввести значение для параметра «Время выполнения операции (в секундах)», это используется для показа прогрессбара. В моём случае операция занимает примерно 35 секунд. Сохраняю настройки.

Благодаря элементу «Прогресс операции», будет происходить периодический опрос сервера (раз 10 секунд) и отслеживание получения результата.

Для показа сгенерированного изображения, нужно отправить отдельный запрос, для этого добавляю ещё одно скрытое поле с название «Идентификатор файла изображения».

Действие вывода для нового скрытого поля: «comfyui — api — job» → «outputs.0.id».

api2app - Действие вывода для скрытого поля "Идентификатор файла изображения"
api2app — Действие вывода для скрытого поля «Идентификатор файла изображения»

Действие ввода для скрытого поля «Идентификатор файла изображения»:
«comfyui — api — image» → предпоследняя часть URL (идентификатор контента).

api2app - Действие ввода для скрытого поля "Идентификатор файла изображения"
api2app — Действие ввода для скрытого поля «Идентификатор файла изображения»

Действие вывода для элемента «Изображение»: «comfyui — api — image» → «Value».

api2app - Действие вывода для изображения
api2app — Действие вывода для изображения

Готово. Теперь можно протестировать результат.

Результат

Для просмотра полученного приложения, необходимо его сделать публичным:

api2app - Публикация приложения
api2app — Публикация приложения

Для перехода на страницу приложения нажимаю кнопку «Просмотр».

api2app - Нажимаем кнопку "Просмотр"
api2app — Нажимаем кнопку «Просмотр»

Такое небольшое приложение у меня получилось:

api2app - Готовое приложение
api2app — Готовое приложение

Если нажать кнопку «Создать изображение», то сначала появится прогрессбар, а затем готовое изображение:

api2app - Результат работы приложения
api2app — Результат работы приложения

Настройка доступа из мира

Данное приложение пока работает только на моём локальном компьютере, но если я хочу поделиться приложением с кем‑то ещё, то нужно настроить обратный туннель. Существует несколько сервисов, которые предоставляют такую услугу, в том числе у которых есть бесплатные тарифы. Не буду их рекламировать, расскажу только про принцип.

Сначала нужно установить специальный софт на свой компьютер. Запускаю команду в терминале с номером порта 8189 и получаю адрес:

./something publish http 8189
Сервис опубликован: http://localhost:8189 -> https://jauntily-sanctified-emperor.example.ru:443

Теперь во всех конфигурациях API, которые недавно создал, я могу использовать этот базовый URL. Также для безопасности включаю режим «Сервер», теперь никто не увидит куда на самом деле уходит запрос (можно также сделать приватным тело запроса). Также делаю приватными поля заголовков авторизации.

api2app - Использование API в режиме "Сервер"
api2app — Использование API в режиме «Сервер»
api2app - Приватное значение поля заголовка авторизации
api2app — Приватное значение поля заголовка авторизации

Можно также ограничить число дневных запросов с одного IP‑адреса:

api2app - Настройки API
api2app — Настройки API

Готово. Теперь приложение доступно из мира. При желании, приложение можно скачать и использовать на своём сервере.

Здесь я рассказал про создание самого простого приложения, но можно создавать более сложные. API ComfyUI также поддерживает загрузку файлов, которые можно использовать в приложении.

Комментарии (3)


  1. riky
    18.10.2026 09:35

    Тоже использую конфи по апи. Ещё и распараллеливаю на десяток инстансов на несколько хостов по локальной сети.

    Вот сейчас большой вопрос: что удобнее для пользователя: lowcode или vibecode?


    1. Andchir Автор
      18.10.2026 09:35

      Я думаю у обоих вариантов есть свои плюсы и минусы. Например, в случае api2app - готовый бесплатный хостинг :)


    1. vialine
      18.10.2026 09:35

      можно вайбкодить лоукод, не благодарите ;) а если без шуток - то это не сравнивается.

      вайбкодинг, это использование ии вкачестве инструмента-помошника, но это всёравно программирование где вся ответсвенность исключительно на тебе, просто ии тебе местами ощутимо экономит время,

      но! код ты должен всёравно видеть и понимать, в противном случает то что там тебе ии понакодит может обернуться для компании и для тебя очень неприятными последствиями,

      лоукодинг - тут буквально часть работы уже сделана до тебя, и область твоей личной ответсвенности и компетенции сокращается,

      так что наиболее близким по смыслу был бы ответ что лоукод для пользователя удобней, если рассматривать оба подхода как концепцию, потому что в сущности вайбкодинг это больше про инструменты разработки, а лоукод это больше про пользовательский интерфейс

      с другой стороны, есть довольно распространённое понимание вайбкодинга как что-то, что не требует ни опыта не компетенции, такое правильнее называть слопкодингом и является очень плохой практикой