Перейти к содержимому страницы
Документация
Документация Make Agent Fast

Astro

Добавьте встраиваемого агента в общий макет Astro или на выбранные статические и островные страницы.

Кратко

Добавьте встраиваемого агента в общий макет Astro или на выбранные статические и островные страницы.

Путь установки встраиванияЗагрузчик на вашем сайте общается с размещённой средой агента
Ваш сайтHTML / appСкрипт-загрузчикembed.jsИнтерфейс виджетаЧат / голосАгент

Подготовьте origin развёртывания#

Включите встраивание для агента Make Agent Fast и разрешите точные origin разработки, предпросмотра и продакшена Astro. Важна финальная scheme/hostname/port в браузере, а не хост сборки или URL репозитория.

Добавьте в общий макет#

Разместите стандартный внешний загрузчик непосредственно перед </body> в макете Astro, который должен владеть загрузчиком.

---
// src/layouts/BaseLayout.astro
---

<html lang="en">
  <body>
    <slot />

    <script
      is:inline
      src="https://makeagent.fast/embed.js?v=20260728-widget-v2"
      data-agent="YOUR_SITE_SLUG"
      data-position="right"
      data-label="Ask us"
      async
    ></script>
  </body>
</html>

is:inline говорит Astro сохранить внешний тег скрипта и его data-* атрибуты вместо сборки/трансформации. Загрузчик остаётся публичным и независимым от фреймворка; не импортируйте его в серверный модуль.

Ограничьте выбранными страницами#

Используйте вложенный макет или включайте тег только на выбранных страницах .astro. Не размещайте один и тот же тег и в базовом макете, и на странице. Загрузчик игнорирует дублирующий корень того же slug, но дублированный HTML усложняет анализ навигации и снятия.

Если включены клиентские view transitions Astro, проверяйте и прямые загрузки страниц, и навигацию внутри приложения. Для агента на весь сайт предпочтителен постоянный общий макет. Для поведения по маршруту удаляйте и скрипт, и maf-embed-root-YOUR_SITE_SLUG при уходе с маршрута, а позже вставляйте свежий скрипт.

Настройте CSP и согласие#

Заголовки статичного хостинга всё равно управляют браузером. Разрешите https://makeagent.fast в script-src, frame-src и соответствующей политике соединений. Если менеджер согласия блокирует скрипт, загружайте тег только после нужного согласия, а не ослабляйте CSP и не обходите согласие.

Проверьте собранный результат#

  1. Запустите продакшен-сборку Astro и проверьте в итоговом HTML сохранённый тег data-agent.
  2. Откройте развёрнутую страницу в приватном окне.
  3. Убедитесь, что есть один корень встраивания и успешные запросы загрузчика/iframe.
  4. Переходите по маршрутам Astro и подтвердите нужное сохранение.
  5. Отправьте реальное сообщение и проверьте поведение на мобильном и с микрофоном.

Решение проблем#

СимптомРешение
Собранный HTML теряет/меняет атрибутыДобавьте is:inline к внешнему скрипту
Выводятся два тега скриптаДержите установку в одном владеющем макете/странице
Клиентская навигация отличается от прямой загрузкиПроверьте view transitions и выберите постоянный общий макет
Работает в dev, но не на статичном хостеДобавьте точный продакшен-origin и CSP-заголовки хостинга
Голос не работаетНастройте HTTPS, разрешение браузера и Permissions Policy

Npm-адаптер для Astro пока не опубликован; используйте размещённый загрузчик, показанный здесь.