Claude Code в веб-интерфейсе

​

Что такое Claude Code в веб-интерфейсе?

• Ответов на вопросы: Спросите об архитектуре кода и о том, как реализованы функции
• Исправления ошибок и рутинных задач: Хорошо определённые задачи, которые не требуют частого управления
• Параллельной работы: Одновременно исправляйте несколько ошибок
• Репозиториев, которых нет на вашей локальной машине: Работайте с кодом, который у вас не проверен локально
• Изменений на бэкенде: Где Claude Code может писать тесты, а затем писать код для прохождения этих тестов

​

Кто может использовать Claude Code в веб-интерфейсе?

• Пользователей Pro
• Пользователей Max
• Пользователей Team
• Пользователей Enterprise с премиум-местами или местами Chat + Claude Code

​

Начало работы

​

Из браузера

1. Посетите claude.ai/code
2. Подключите свой аккаунт GitHub
3. Установите приложение Claude GitHub в ваших репозиториях
4. Выберите окружение по умолчанию
5. Отправьте вашу задачу кодирования
6. Просмотрите изменения в представлении diff, повторяйте с комментариями, затем создайте pull request

​

Из терминала

​

Как это работает

1. Клонирование репозитория: Ваш репозиторий клонируется на виртуальную машину, управляемую Anthropic
2. Настройка окружения: Claude подготавливает защищённое облачное окружение с вашим кодом, затем запускает ваш скрипт настройки, если он настроен
3. Конфигурация сети: Доступ в Интернет настраивается на основе ваших параметров
4. Выполнение задачи: Claude анализирует код, вносит изменения, запускает тесты и проверяет свою работу
5. Завершение: Вы получаете уведомление об окончании и можете создать PR с изменениями
6. Результаты: Изменения отправляются в ветку, готовую для создания pull request

​

Просмотр изменений с представлением diff

• Просмотреть изменения файл за файлом
• Оставить комментарии к конкретным изменениям, чтобы запросить изменения
• Продолжить повторение с Claude на основе того, что вы видите

​

Auto-fix pull requests

• PR, созданные в Claude Code в веб-интерфейсе: откройте строку статуса CI и выберите Auto-fix
• Из мобильного приложения: скажите Claude автоматически исправить PR, например “watch this PR and fix any CI failures or review comments”
• Любой существующий PR: вставьте URL PR в сессию и скажите Claude автоматически исправить его

​

Как Claude реагирует на активность PR

• Очевидные исправления: если Claude уверен в исправлении и оно не конфликтует с более ранними инструкциями, Claude вносит изменение, отправляет его и объясняет, что было сделано в сессии
• Неоднозначные запросы: если комментарий рецензента может быть интерпретирован несколькими способами или касается чего-то архитектурно значимого, Claude спрашивает вас перед действием
• Дублирующиеся или события без действия: если событие является дубликатом или не требует изменений, Claude отмечает это в сессии и продолжает

​

Перемещение задач между веб-интерфейсом и терминалом

​

От терминала к веб-интерфейсу

claude --remote "Fix the authentication bug in src/auth/login.ts"

​

Советы для удалённых задач

claude --permission-mode plan

claude --remote "Execute the migration plan in docs/migration-plan.md"

claude --remote "Fix the flaky test in auth.spec.ts"
claude --remote "Update the API documentation"
claude --remote "Refactor the logger to use structured output"

​

От веб-интерфейса к терминалу

• Используя /teleport: Из Claude Code запустите /teleport (или /tp) для просмотра интерактивного выбора ваших веб-сессий. Если у вас есть незафиксированные изменения, вам будет предложено сначала их спрятать.
• Используя --teleport: Из командной строки запустите claude --teleport для интерактивного выбора сессии, или claude --teleport <session-id> для прямого возобновления конкретной сессии.
• Из /tasks: Запустите /tasks для просмотра ваших фоновых сессий, затем нажмите t для телепортирования в одну из них
• Из веб-интерфейса: Нажмите “Open in CLI” для копирования команды, которую вы можете вставить в ваш терминал

​

Требования для телепортирования

​

Совместное использование сессий

​

Совместное использование из аккаунта Enterprise или Teams

​

Совместное использование из аккаунта Max или Pro

​

Планирование повторяющихся задач

​

Управление сессиями

​

Архивирование сессий

​

Удаление сессий

• Из боковой панели: Отфильтруйте архивированные сессии, затем наведите курсор на сессию, которую вы хотите удалить, и нажмите значок удаления
• Из меню сессии: Откройте сессию, нажмите раскрывающееся меню рядом с названием сессии и выберите Delete

​

Облачное окружение

​

Образ по умолчанию

• Популярные языки программирования и среды выполнения
• Распространённые инструменты сборки и менеджеры пакетов
• Фреймворки тестирования и линтеры

​

Проверка доступных инструментов

check-tools

• Языки программирования и их версии
• Доступные менеджеры пакетов
• Установленные инструменты разработки

​

Настройки для конкретных языков

• Python: Python 3.x с pip, poetry и распространёнными научными библиотеками
• Node.js: Последние версии LTS с npm, yarn, pnpm и bun
• Ruby: Версии 3.1.6, 3.2.6, 3.3.6 (по умолчанию: 3.3.6) с gem, bundler и rbenv для управления версиями
• PHP: Версия 8.4.14
• Java: OpenJDK с Maven и Gradle
• Go: Последняя стабильная версия с поддержкой модулей
• Rust: Цепочка инструментов Rust с cargo
• C++: Компиляторы GCC и Clang

​

Базы данных

• PostgreSQL: Версия 16
• Redis: Версия 7.0

​

Конфигурация окружения

1. Подготовка окружения: Мы клонируем ваш репозиторий и запускаем любой настроенный скрипт настройки. Репозиторий будет клонирован с ветвью по умолчанию вашего репозитория GitHub. Если вы хотите проверить конкретную ветку, вы можете указать это в подсказке.
2. Конфигурация сети: Мы настраиваем доступ в Интернет для агента. Доступ в Интернет ограничен по умолчанию, но вы можете настроить окружение на отсутствие доступа в Интернет или полный доступ в Интернет на основе ваших потребностей.
3. Выполнение Claude Code: Claude Code запускается для выполнения вашей задачи, написания кода, запуска тестов и проверки своей работы. Вы можете направлять и управлять Claude на протяжении всей сессии через веб-интерфейс. Claude уважает контекст, который вы определили в вашем CLAUDE.md.
4. Результат: Когда Claude завершит свою работу, он отправит ветку на удалённый сервер. Вы сможете создать PR для ветки.

API_KEY=your_api_key
DEBUG=true

​

Setup scripts

#!/bin/bash
apt update && apt install -y gh

​

Setup scripts в сравнении с SessionStart hooks

​

Управление зависимостями

#!/bin/bash
npm install
pip install -r requirements.txt

{
  "hooks": {
    "SessionStart": [
      {
        "matcher": "startup",
        "hooks": [
          {
            "type": "command",
            "command": "\"$CLAUDE_PROJECT_DIR\"/scripts/install_pkgs.sh"
          }
        ]
      }
    ]
  }
}

#!/bin/bash

# Only run in remote environments
if [ "$CLAUDE_CODE_REMOTE" != "true" ]; then
  exit 0
fi

npm install
pip install -r requirements.txt
exit 0

​

Сохранение переменных окружения

​

Ограничения управления зависимостями

• Hooks срабатывают для всех сессий: SessionStart hooks запускаются как в локальных, так и в удалённых окружениях. Нет конфигурации hook для ограничения hook только удалёнными сессиями. Чтобы пропустить локальное выполнение, проверьте переменную окружения CLAUDE_CODE_REMOTE в вашем скрипте, как показано выше.
• Требует доступ в сеть: Команды установки нуждаются в доступе в сеть для доступа к реестрам пакетов. Если ваше окружение настроено с доступом “No internet”, эти hooks не будут работать. Используйте доступ “Limited” (по умолчанию) или “Full”. Список разрешений по умолчанию включает распространённые реестры, такие как npm, PyPI, RubyGems и crates.io.
• Совместимость с прокси: Весь исходящий трафик в удалённых окружениях проходит через security proxy. Некоторые менеджеры пакетов не работают правильно с этим прокси. Bun — известный пример.
• Запускается при каждом запуске сессии: Hooks запускаются каждый раз при запуске или возобновлении сессии, добавляя задержку при запуске. Держите скрипты установки быстрыми, проверяя, присутствуют ли зависимости, перед переустановкой.

​

Доступ в сеть и безопасность

​

Политика сети

​

GitHub proxy

• Безопасно управляет аутентификацией GitHub — клиент git использует ограниченное учётное данное внутри песочницы, которое прокси проверяет и переводит в ваш фактический токен аутентификации GitHub
• Ограничивает операции git push к текущей рабочей ветке для безопасности
• Обеспечивает беспрепятственное клонирование, получение и операции PR при сохранении границ безопасности

​

Security proxy

• Защиту от вредоносных запросов
• Ограничение скорости и предотвращение злоупотреблений
• Фильтрацию контента для повышенной безопасности

​

Уровни доступа

​

Разрешённые домены по умолчанию

​

Сервисы Anthropic

• api.anthropic.com
• statsig.anthropic.com
• platform.claude.com
• code.claude.com
• claude.ai

​

Контроль версий

• github.com
• www.github.com
• api.github.com
• npm.pkg.github.com
• raw.githubusercontent.com
• pkg-npm.githubusercontent.com
• objects.githubusercontent.com
• codeload.github.com
• avatars.githubusercontent.com
• camo.githubusercontent.com
• gist.github.com
• gitlab.com
• www.gitlab.com
• registry.gitlab.com
• bitbucket.org
• www.bitbucket.org
• api.bitbucket.org

​

Реестры контейнеров

• registry-1.docker.io
• auth.docker.io
• index.docker.io
• hub.docker.com
• www.docker.com
• production.cloudflare.docker.com
• download.docker.com
• gcr.io
• *.gcr.io
• ghcr.io
• mcr.microsoft.com
• *.data.mcr.microsoft.com
• public.ecr.aws

​

Облачные платформы

• cloud.google.com
• accounts.google.com
• gcloud.google.com
• *.googleapis.com
• storage.googleapis.com
• compute.googleapis.com
• container.googleapis.com
• azure.com
• portal.azure.com
• microsoft.com
• www.microsoft.com
• *.microsoftonline.com
• packages.microsoft.com
• dotnet.microsoft.com
• dot.net
• visualstudio.com
• dev.azure.com
• *.amazonaws.com
• *.api.aws
• oracle.com
• www.oracle.com
• java.com
• www.java.com
• java.net
• www.java.net
• download.oracle.com
• yum.oracle.com

​

Менеджеры пакетов — JavaScript/Node

• registry.npmjs.org
• www.npmjs.com
• www.npmjs.org
• npmjs.com
• npmjs.org
• yarnpkg.com
• registry.yarnpkg.com

​

Менеджеры пакетов — Python

• pypi.org
• www.pypi.org
• files.pythonhosted.org
• pythonhosted.org
• test.pypi.org
• pypi.python.org
• pypa.io
• www.pypa.io

​

Менеджеры пакетов — Ruby

• rubygems.org
• www.rubygems.org
• api.rubygems.org
• index.rubygems.org
• ruby-lang.org
• www.ruby-lang.org
• rubyforge.org
• www.rubyforge.org
• rubyonrails.org
• www.rubyonrails.org
• rvm.io
• get.rvm.io

​

Менеджеры пакетов — Rust

• crates.io
• www.crates.io
• index.crates.io
• static.crates.io
• rustup.rs
• static.rust-lang.org
• www.rust-lang.org

​

Менеджеры пакетов — Go

• proxy.golang.org
• sum.golang.org
• index.golang.org
• golang.org
• www.golang.org
• goproxy.io
• pkg.go.dev

​

Менеджеры пакетов — JVM

• maven.org
• repo.maven.org
• central.maven.org
• repo1.maven.org
• jcenter.bintray.com
• gradle.org
• www.gradle.org
• services.gradle.org
• plugins.gradle.org
• kotlin.org
• www.kotlin.org
• spring.io
• repo.spring.io

​

Менеджеры пакетов — Другие языки

• packagist.org (PHP Composer)
• www.packagist.org
• repo.packagist.org
• nuget.org (.NET NuGet)
• www.nuget.org
• api.nuget.org
• pub.dev (Dart/Flutter)
• api.pub.dev
• hex.pm (Elixir/Erlang)
• www.hex.pm
• cpan.org (Perl CPAN)
• www.cpan.org
• metacpan.org
• www.metacpan.org
• api.metacpan.org
• cocoapods.org (iOS/macOS)
• www.cocoapods.org
• cdn.cocoapods.org
• haskell.org
• www.haskell.org
• hackage.haskell.org
• swift.org
• www.swift.org

​

Дистрибутивы Linux

• archive.ubuntu.com
• security.ubuntu.com
• ubuntu.com
• www.ubuntu.com
• *.ubuntu.com
• ppa.launchpad.net
• launchpad.net
• www.launchpad.net

​

Инструменты разработки и платформы

• dl.k8s.io (Kubernetes)
• pkgs.k8s.io
• k8s.io
• www.k8s.io
• releases.hashicorp.com (HashiCorp)
• apt.releases.hashicorp.com
• rpm.releases.hashicorp.com
• archive.releases.hashicorp.com
• hashicorp.com
• www.hashicorp.com
• repo.anaconda.com (Anaconda/Conda)
• conda.anaconda.org
• anaconda.org
• www.anaconda.com
• anaconda.com
• continuum.io
• apache.org (Apache)
• www.apache.org
• archive.apache.org
• downloads.apache.org
• eclipse.org (Eclipse)
• www.eclipse.org
• download.eclipse.org
• nodejs.org (Node.js)
• www.nodejs.org

​

Облачные сервисы и мониторинг

• statsig.com
• www.statsig.com
• api.statsig.com
• sentry.io
• *.sentry.io
• http-intake.logs.datadoghq.com
• *.datadoghq.com
• *.datadoghq.eu

​

Доставка контента и зеркала

• sourceforge.net
• *.sourceforge.net
• packagecloud.io
• *.packagecloud.io

​

Схема и конфигурация

• json-schema.org
• www.json-schema.org
• json.schemastore.org
• www.schemastore.org

​

Model Context Protocol

• *.modelcontextprotocol.io

​

Лучшие практики безопасности для пользовательского доступа в сеть

1. Принцип наименьших привилегий: Включайте только минимальный доступ в сеть, необходимый
2. Регулярный аудит: Периодически проверяйте разрешённые домены
3. Используйте HTTPS: Всегда предпочитайте конечные точки HTTPS вместо HTTP

​

Безопасность и изоляция

• Изолированные виртуальные машины: Каждая сессия запускается в изолированной виртуальной машине, управляемой Anthropic
• Элементы управления доступом в сеть: Доступ в сеть ограничен по умолчанию и может быть отключен

• Защита учётных данных: Чувствительные учётные данные (такие как учётные данные git или ключи подписи) никогда не находятся в песочнице с Claude Code. Аутентификация обрабатывается через защищённый прокси с использованием ограниченных учётных данных
• Безопасный анализ: Код анализируется и изменяется в изолированных виртуальных машинах перед созданием PR

​

Цены и ограничения скорости

​

Ограничения

• Аутентификация репозитория: Вы можете перемещать сессии из веб-интерфейса в локальный только когда вы аутентифицированы на одном и том же аккаунте
• Ограничения платформы: Claude Code в веб-интерфейсе работает только с кодом, размещённым в GitHub. Самостоятельно размещённые экземпляры GitHub Enterprise Server поддерживаются для планов Teams и Enterprise. Репозитории GitLab и другие не-GitHub репозитории не могут использоваться с облачными сессиями

​

Лучшие практики

1. Автоматизируйте настройку окружения: Используйте setup scripts для установки зависимостей и настройки инструментов перед запуском Claude Code. Для более продвинутых сценариев настройте SessionStart hooks.
2. Документируйте требования: Чётко укажите зависимости и команды в вашем файле CLAUDE.md. Если у вас есть файл AGENTS.md, вы можете получить его в вашем CLAUDE.md с помощью @AGENTS.md для сохранения единого источника истины.

​

Связанные ресурсы

• Конфигурация Hooks
• Справочник параметров
• Безопасность
• Использование данных