LangGraph-агенты получили интерфейс как у ChatGPT: три способа защитить данные

Разработчик Алексей Яковенко опубликовал на GitHub финальную часть цикла статей, в которой LangGraph-агенты (агентные сценарии, построенные на фреймворке LangGraph от LangChain) получают полноценный веб-интерфейс. В предыдущих частях автор поднял локальную языковую модель на облачном сервере с GPU на 16 ГБ видеопамяти, настроил vLLM и вызов инструментов, собрал агентный бэкенд с MCP-серверами и обернул всё в REST API через FastAPI. Теперь к этому бэкенду подключается agent-chat-ui, готовый Next.js-интерфейс от LangChain.

Что даёт готовый интерфейс?

• Стриминг токенов (посимвольный вывод ответа) в реальном времени. Пользователь видит, как модель «думает», точно как в ChatGPT.
• Визуализация шагов агента. Интерфейс показывает, какие инструменты вызвал LangGraph-агент и в каком порядке.
• История тредов (диалогов). Каждый разговор сохраняется, можно вернуться к нему позже. Работает только при включённом сохранении истории сообщений на бэкенде.
• Переключение между несколькими агентами. После кастомизации пользователь выбирает, с каким графом работать, прямо в интерфейсе.
• Перевод на русский язык. Автор цикла показывает конкретные места в коде, которые нужно изменить для локализации.

Три подхода к подключению: какой выбрать?

Источник описывает три варианта, и разница между ними не только в объёме работы, но и в безопасности. Это критично для тех, кто работает с данными клиентов в России.

Первый: собственный бэкенд. Вы пишете обёртку через LangGraph SDK поверх REST API и строите фронтенд с нуля. Полный контроль над авторизацией, очередями, ограничениями доступа. Самый трудоёмкий путь.

Второй: готовый UI напрямую. Клонируете agent-chat-ui, прописываете адрес LangGraph Server в файле .env и запускаете. Три строки конфигурации. Но есть жёсткое условие: API не должен быть доступен из внешней сети. Только изнутри контура. Автор подчёркивает: это не рекомендация, это обязательное требование.

Третий: гибрид с API Passthrough (проксирование запросов через сервер). Все запросы к LangGraph Server идут не напрямую с браузера пользователя, а через серверные маршруты Next.js. Фронтенд смотрит наружу, LangGraph API остаётся внутри контура, ключ LangSmith (сервис мониторинга от LangChain) инжектируется на сервере и никогда не попадает к клиенту. По словам автора, этот путь «закрывает дыру без необходимости писать собственный бэкенд».

Именно гибридный вариант автор разбирает в блоке про деплой и рекомендует как оптимальный баланс между скоростью запуска и защитой.

Как попробовать?

1. Клонируйте проект с GitHub: git clone https://github.com/Yakvenalex/HabrGraphCLI. Проект открытый, доступ свободный.
2. Создайте файл .env в корне проекта, пропишите адрес вашего LangGraph Server и имя агента.
3. Запустите agent-chat-ui командой pnpm dev. На этом этапе вы увидите стриминг, визуализацию вызовов инструментов и историю тредов без единой строчки собственного кода.
4. Для боевого деплоя: соберите Next.js, поднимите рядом с LangGraph Server через docker-compose, закройте Nginx с SSL-сертификатом. LangGraph API останется внутри контура, наружу будет смотреть только фронтенд.

Что с российскими аналогами?

Если вам критична полная автономность и контроль над данными клиентов, связка с локальной моделью выигрывает. Если нужен быстрый старт без настройки серверов, облачные API YandexGPT и GigaChat проще в запуске.

Что делать с этим прямо сейчас, по ролям

Автору Дзена: если вы используете ИИ для генерации черновиков или исследования тем, эта связка позволяет поднять собственного ассистента, который не отправляет ваши тексты на чужие серверы. Интерфейс привычный, как ChatGPT.

Маркетологу: LangGraph-агенты с подключёнными MCP-инструментами могут автоматизировать цепочки задач: собрать данные, обработать, сформировать отчёт. Готовый UI позволяет дать доступ команде без обучения работе с терминалом.

Предпринимателю в РФ: данные остаются на вашем сервере. Для компаний, работающих с персональными данными, это аргумент при прохождении проверок. Гибридный подход с API Passthrough закрывает базовые требования к безопасности без отдельной команды разработки.

Частые вопросы

Нужен ли мощный компьютер для запуска?

Для фронтенда (agent-chat-ui) мощный компьютер не нужен, это обычное веб-приложение. Но для бэкенда с локальной моделью нужен сервер с GPU минимум на 16 ГБ видеопамяти. Автор цикла использовал облачный сервер, арендовать такой можно у российских провайдеров.

Можно ли подключить не локальную модель, а API OpenAI или другого провайдера?

LangGraph как фреймворк поддерживает разные модели, включая API внешних провайдеров. Но весь цикл Яковенко построен вокруг локальной модели Qwen именно ради автономности. Если вам не критичен контроль над данными, можно подключить внешний API, но тогда теряется главное преимущество схемы.

Чем этот подход отличается от простой установки Open WebUI или аналогов?

Agent-chat-ui заточен под LangGraph-агенты: он показывает не просто ответ модели, а шаги рассуждения, вызовы инструментов, работу с несколькими графами. Open WebUI и подобные проекты дают интерфейс для чата с моделью, но не визуализируют агентную логику. Если вам нужен просто чат, Open WebUI проще. Если нужны LangGraph-агенты с инструментами, agent-chat-ui решает именно эту задачу.