api2app: Использование совместно с ComfyUI

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

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

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

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

Локальное тестирование 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

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

Для локального применения можно использовать стандартное 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":

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

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

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

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

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

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

Если генерация изображения завершена, то в ответе будет 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/".

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

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

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

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

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

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

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

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

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

Действие вывода для этого поля: "comfyui - api - jobs post" -> "id".

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

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

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

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

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

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

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

Действие вывода для нового скрытого поля: "comfyui - api - job" -> "outputs.0.id".

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

Действие вывода для элемента "Изображение": "comfyui - api - image" -> "Value".

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

Результат

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

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

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

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

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

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

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

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

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

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

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

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

Если эта публикация вас вдохновила и вы хотите поддержать автора — не стесняйтесь нажать на кнопку