SvelteKit
Загружайте и снимайте встраиваемого агента в браузерном жизненном цикле макета SvelteKit.
Загружайте и снимайте встраиваемого агента в браузерном жизненном цикле макета SvelteKit.
Подготовьте origin#
Включите встраивание для агента и разрешите каждый точный origin разработки, предпросмотра и продакшена SvelteKit. Используйте корневой макет для загрузчика на весь сайт или вложенный макет/компонент страницы для выбранных маршрутов.
Создайте компонент#
onMount выполняется только в браузере. Возвращайте функцию очистки, когда владеющий макет/компонент может размонтироваться.
<script lang="ts">
import { onMount } from "svelte";
const slug = "YOUR_SITE_SLUG";
onMount(() => {
if (document.getElementById(`maf-embed-root-${slug}`)) return;
const script = document.createElement("script");
script.id = "maf-agent";
script.src = "https://makeagent.fast/embed.js?v=20260728-widget-v2";
script.dataset.agent = slug;
script.dataset.position = "right";
script.async = true;
document.body.appendChild(script);
return () => {
script.remove();
document.getElementById(`maf-embed-root-${slug}`)?.remove();
};
});
</script>Смонтируйте компонент один раз из src/routes/+layout.svelte для всего приложения. Для группы маршрутов разместите его в +layout.svelte этой группы; очистка удалит загрузчик, когда посетитель уходит из группы.
Используйте конфигурацию безопасно#
Публичный slug сайта может быть публичным значением окружения SvelteKit, потому что он не учётные данные. Не используйте $env/static/public или браузерный код для ключей MAF API, ключей AI-провайдеров или секретов коннекторов. Держите их в серверных модулях/маршрутах.
Сохранение или сброс состояния диалога#
Удержание компонента в корневом макете сохраняет один и тот же iframe между клиентскими переходами. Очистка по маршруту намеренно сбрасывает этот iframe и его текущее состояние на странице. Выберите одно поведение вместо перемонтирования на каждой странице.
Проверьте продакшен-сборку#
- Запустите продакшен-адаптер/сборку SvelteKit.
- Загрузите публичный маршрут напрямую и убедитесь, что загрузчик/корень один.
- Перейдите внутрь владеющего макета и из него.
- Проверьте Network/CSP и точный родительский origin.
- Проверьте реальное сообщение, узкое окно и микрофон, если он включён.
Решение проблем#
| Симптом | Решение |
|---|---|
Ошибка document во время SSR | Держите весь код загрузчика внутри onMount |
| Загрузчик остаётся после ухода из макета | Верните очистку и удалите созданный корень |
| Диалог сбрасывается на каждой странице | Монтируйте в постоянный родительский +layout.svelte |
| Защита от дублей мешает новому монтажу | Убедитесь, что предыдущая очистка удалила старый корень перед добавлением нового скрипта |
| Падает только в продакшене | Разрешите финальный HTTPS origin и проверьте CSP-заголовки адаптера |
Npm-адаптер для SvelteKit пока не опубликован; размещённый скрипт — поддерживаемая поверхность интеграции.