Загрузка...
Смарт-конспекты YouTube-видео — ключевые идеи и инсайты без необходимости смотреть часовые ролики
Пошаговый гайд по настройке удаленного доступа к AI-агентам через Tailscale и Web UI. Управляй Cursor и Claude Code прямо со смартфона.
🎯 О чём этот конспект: Пошаговое руководство по развертыванию единого веб-интерфейса для всех популярных AI-агентов (Cursor CLI, Claude Code, Codex) с возможностью удаленного доступа через смартфон. Разбирается связка инструментов для проброса локального сервера в защищенную сеть.
👤 Кому будет полезно: Вайбкодерам и разработчикам, которые хотят сохранять мобильность и управлять процессом генерации кода или мониторить работу агентов, находясь вдали от рабочего места.
✨ Что получите: Настроенную панель управления AI-агентами, доступную по защищенному URL с любого устройства (iPhone/Android/Laptop), без необходимости сидеть за монитором.
Контекст: Для того чтобы ваш телефон «увидел» локальный сервер на ноутбуке, находясь в другой сети (например, через 4G), необходимо создать виртуальную частную сеть (Mesh VPN). Tailscale позволяет соединить устройства напрямую без сложной настройки проброса портов и риска выставить сервер в открытый интернет. Это критически важно для безопасности, так как AI-агенты имеют доступ к вашей файловой системе.
Выгода: Безопасный доступ к локальным инструментам из любой точки мира без конфликтов с обычными VPN-сервисами.
Как применить:
Cursortailscale statusРезультат: Ваши устройства находятся в одной защищенной виртуальной сети.
Контекст: Работа в терминале с несколькими агентами неудобна на мобильных устройствах. Проект cloud-code-ui (или аналогичные веб-оболочки для CLI) предоставляет графический интерфейс для управления сессиями, выбора моделей (Claude, Gemini, Cursor) и визуализации контекста. Мы запускаем его в режиме прослушивания локального хоста для последующего проксирования.
Выгода: Единое окно для всех чатов, поддержка MCP-серверов, визуальный контроль загрузки контекста и удобный файловый менеджер.
Как применить:
sudo npx @claudecode/ui --host 127.0.0.1 --port 3001http://localhost:3001. Создайте локального пользователя (Username/Password). Эти данные понадобятся для входа с телефона.Результат: Работающий локальный веб-интерфейс, объединяющий ваших AI-агентов.
Контекст: Теперь нужно сделать так, чтобы локальный порт 3001 стал доступен по URL внутри сети Tailscale. Функция serve позволяет мгновенно создать прокси-адрес для внутреннего использования.
Выгода: Возможность полноценно кодить, отправлять промпты и просматривать файлы проекта прямо с экрана смартфона.
Как применить:
tailscale serve --bg 3001https://your-device-name.tailscale.net.Результат: Полноценный мобильный пульт управления вайбкодингом.
В: Будет ли это работать, если на компьютере включен другой VPN для доступа к Claude/OpenAI?
О: Да, Tailscale работает на другом уровне сетевого протокола и обычно не конфликтует с прокси-сервисами или стандартными VPN. Автор видео подтверждает стабильную работу связки Tailscale + VPN-провайдер.
В: Можно ли через этот интерфейс добавлять MCP-сервера?
О: Да, в настройках Web UI есть раздел MCP. Если у вас уже настроены конфигурации в Cursor или Claude Desktop, интерфейс автоматически подтянет доступные инструменты.
В: Насколько это безопасно? Могут ли посторонние зайти в мой UI?
О: Доступ осуществляется через Tailscale, который требует авторизации. Кроме того, сам Web UI защищен вашим локальным логином и паролем. Ссылка не видна в обычном интернете.
В: Какие модели доступны в мобильном интерфейсе?
О: Доступны все модели, которые поддерживают подключенные агенты: Claude 3.5 Sonnet, модели Gemini, а также специфические настройки Cursor (например, режим Reasoning).
В: Как остановить трансляцию интерфейса, когда я закончил?
О: Чтобы прекратить проксирование порта, выполните команду tailscale serve off. Чтобы полностью остановить сервер интерфейса, нажмите Ctrl+C в терминале, где запущен npx.
Конспект создан на основе видео «Как подключить Claude Code / Cursor к ТЕЛЕФОНУ? Вайб-кодинг ВЕЗДЕ!» канала VibeCoder. Все права на оригинальный материал принадлежат авторам. Источник: https://youtu.be/Apqu5g4d_0U