Почему это важно именно вам
Обычный артефакт — снимок. Вы собрали сводку в понедельник, отправили ссылку, а в среду цифры устарели, и коллега смотрит на прошлое, думая, что видит настоящее. Устаревший отчёт хуже отсутствующего: на его основании принимают решения.
Живой артефакт снимает эту проблему. Страница обращается к вашим подключённым инструментам в момент, когда её открывают, и показывает актуальные данные. Один раз собрали — дальше она сама.
Для директора это ближе всего к «доске статуса»: отправил ссылку команде и не отвечаешь на вопрос «а какие сейчас цифры».
Что это такое
Опубликованная страница может вызывать MCP-коннекторы — те самые внешние подключения из блока 6, но привязанные к аккаунту claude.ai, а не к локальной настройке. Живые вызовы требуют Claude Code 2.1.209 или новее: на более старой версии Claude без предупреждения опубликует обычный снимок данных — страница будет выглядеть так же, но обновляться не будет.
Работает это так:
- При публикации Claude объявляет, к каким коннекторам страница имеет право обращаться. Выйти за пределы объявленного она не может.
- Когда кто-то открывает страницу, вызовы идут через аккаунт того, кто смотрит, а не через ваш.
- Перед первым вызовом claude.ai спрашивает у зрителя разрешение.
- Ответы кэшируются в браузере зрителя: при повторном открытии страница сразу рисуется из кэша, потом обновляется свежими данными.
Из пункта 2 следует важное свойство: два человека, открывшие одну и ту же страницу, могут увидеть разные данные — каждый видит то, к чему у его аккаунта есть доступ. Это не баг, а модель безопасности: страница никогда не получает ничьи учётные данные.
И симметрично: страница умеет не только читать. На ней могут быть кнопки, которые через коннектор что-то делают — отправляют сообщение, меняют задачу. Такое действие тоже уходит от имени того, кто нажал, а не от вашего. Если вы такие кнопки не заказывали — их там быть не должно; проверьте страницу перед тем, как делиться.
Локальные MCP-серверы так не работают
Серверы, настроенные у вас в Claude Code (.mcp.json), могут дать данные в момент сборки страницы, но опубликованная страница обращаться к ним не может. Живые вызовы — только через коннекторы аккаунта claude.ai.
Как работает на практике
Попросить живую страницу
Назовите коннектор и данные прямо в запросе:
Сделай артефакт-доску: открытые задачи по нашему проекту, которые страница
подтягивает через мой коннектор при загрузке. Обновление — раз в пять минут
и кнопкой «обновить».
Claude объявит нужные коннекторы при публикации — и вас об этом спросят отдельно, даже если обычные публикации вы уже разрешили.
Предусмотреть тех, у кого коннектора нет
Обязательный пункт брифа:
В каждом живом блоке добавь запасное сообщение: если у зрителя нет нужного
подключения — покажи, какой коннектор надо подключить, а не пустой блок.
Иначе человек откроет страницу, увидит пустоту и решит, что «ничего не работает».
Помнить про ограничение шеринга
Страница, которая обращается к коннекторам, не может быть опубликована по публичной ссылке. На Team и Enterprise её можно оставить приватной или расшарить внутри организации. На Pro и Max, где публичная ссылка — единственный способ поделиться, живая страница остаётся приватной, то есть только для вас.
Это ограничение стоит знать до того, как вы построите доску для команды на личном тарифе.
Что делать, если у зрителя пусто
Три причины, по убыванию частоты:
- У зрителя нет этого коннектора. Подключения — на уровне аккаунта. Каждому нужно своё, в настройках claude.ai.
- Зритель отказал в разрешении. Отказ действует до перезагрузки страницы.
- Администратор организации выключил вызовы коннекторов из артефактов. Тогда никакие живые блоки не работают ни у кого.
Границы формата
Стоит держать в голове, чего страница не умеет — это экономит часы попыток:
| Ограничение | Что это значит |
|---|---|
| Нет бэкенда | Форма не сохранит ввод, авторизации своей нет |
| Одна страница | Ссылки на «другие разделы» не работают, только якоря внутри |
| Внешние запросы урезаны | Разрешены шрифты Google Fonts и библиотеки с четырёх CDN (cdnjs, jsDelivr, Tailwind, jQuery). Внешние картинки и прочие внешние файлы блокируются — их встраивают внутрь страницы. Обращаться к чужим API страница не может |
| Размер | Не больше 16 МиБ в отрендеренном виде |
| Типы файлов | Публикуется .html, .htm или .md |
Отдельно про деньги: страница с интерактивом и встроенными картинками тратит заметно больше выходных токенов, чем тот же результат текстом. Диаграммы просите рисовать как SVG, а большие наборы данных — сворачивать в сводку.
Частые ошибки
Строить на живой странице «внутренний портал». Это по-прежнему одна страница без сервера. Если нужна авторизация, хранение и разделы — нужен обычный веб-сервис.
Забывать про разные права зрителей. Вы видите полную картину, потому что у вас доступ ко всему. Коллега открывает — и половина пустая. Проверяйте страницу глазами человека с меньшими правами.
Делать живую доску на Pro и ждать, что ею можно поделиться. Нельзя: живые страницы не публикуются по публичной ссылке, а другого способа поделиться на Pro нет.
Не ставить период обновления. Страница, которая тянет данные при каждом действии, раздражает и тратит лимиты зрителя. Разумный интервал плюс кнопка обновления — рабочий компромисс.
Показывать живые данные без отметки времени. Всегда просите вывести «данные на такое-то время» — иначе непонятно, свежие цифры или из кэша браузера.
Когда нужно / когда нет
Живая страница уместна:
- статус-доска для команды, куда все смотрят вместо вопросов в чате;
- сводка, которую вы показываете на регулярной встрече;
- мониторинг, где важна не история, а «что сейчас».
Не уместна:
- когда данные конфиденциальны, а состав зрителей может измениться;
- когда нужна история и сравнение периодов — это дашборд на своём сервере;
- когда доступ к данным есть только у вас: остальные увидят пустую страницу.
Связь с другими уроками
День 51–58 — MCP. Живые артефакты — продолжение той же темы: те же коннекторы, но вызываемые со стороны зрителя.
День 67 — первый артефакт. Сначала научитесь делать статичную страницу с проверенными цифрами, потом добавляйте живость.
День 78 — routines. Если нужна не «живая», а «регулярно пересобираемая» страница — это работа для облачных задач по расписанию.
Задание на сегодня
- Проверьте, какие коннекторы подключены к вашему аккаунту claude.ai.
- Постройте живую страницу по одному источнику: задачи, письма, календарь — что подключено.
- Обязательно добавьте в бриф запасное сообщение для зрителей без коннектора и отметку времени данных.
- Откройте страницу, отзовите разрешение и перезагрузите — посмотрите, что видит человек, который отказал.
- Проверьте на своём тарифе, можете ли вы вообще поделиться живой страницей.
Критерий «выполнено»: у вас есть страница, которая при открытии показывает свежие данные, и вы знаете, что увидит коллега без нужного подключения.
Резюме
- Опубликованная страница может вызывать MCP-коннекторы claude.ai и показывать актуальные данные при каждом открытии.
- Вызовы идут через аккаунт зрителя: разные люди могут видеть разные данные, а разрешение спрашивается у каждого.
- Локальные MCP-серверы из
.mcp.jsonдают данные только при сборке страницы, но не при просмотре. - Живая страница не публикуется по публичной ссылке: на Pro и Max она остаётся приватной.
- В брифе обязательны запасное сообщение для зрителей без коннектора и отметка времени данных.
- Формат остаётся ограниченным: одна страница, без бэкенда, до 16 МиБ, внешние запросы урезаны.