Веб-приложение · безопасность AI · нативный JS
Тренажёр защиты от prompt-инъекций
Бот с доступом к данным и инструментам — новая дверь в бизнес. Его можно уговорить «забыть инструкции», а можно и не уговаривать: хватит письма или отзыва, где написано, что ему делать. Здесь видно, какие приёмы работают и какие слои защиты их останавливают — от фильтра запросов до прав инструментов, которые проверяет код, а не модель.
Сценарий: Бот поддержки обжарочной «Зерно» — вымышленной — знает промокод для сотрудников и умеет возвращать деньги за заказы.
Открыть демо
Удобнее с компьютера: переписка и журнал проверок видны рядом. На телефоне журнал — под перепиской.
Приложение работает в браузере: на сервер ничего не отправляется.
Что показывает демо
Как попробовать
Взломайте уровень 1
Нажмите «Игнорируй инструкции» и отправьте — бот выдаст промокод.
Поднимайте уровни
На каждом уровне включается новый слой. Подсказка говорит, что пробует атакующий дальше.
Атакуйте через документ
«Письмо с указанием»: бот разбирает письмо клиента, а в письме — «служебное указание» оформить возврат и промолчать.
Смотрите журнал
Какой слой что проверил, что увидела модель и почему послушалась. Вкладка «Регрессия атак» — вся картина сразу.
Без платных нейросетей
Бот — не нейросеть, а детерминированная имитация доверчивой модели: так каждая атака воспроизводится одинаково, а тесты проверяют защиту без платных запросов. Слои защиты — обычный код, который в рабочем проекте стоит перед настоящей моделью. Главный вывод совпадает с OWASP: секретов в промпте быть не должно, а права инструментов проверяет код.
Демо работает без API-ключей OpenAI, YandexGPT или GigaChat. Там, где рабочая система обращается к модели, стоит локальная заглушка с тем же интерфейсом — поэтому демо бесплатно, всегда доступно и ничего не выдумывает.
Что будет в рабочем проекте
- Аудит бота или агента: какие данные и инструменты ему доступны и что будет, если его обманут
- Слои защиты перед моделью: фильтры ввода и вывода, разделение данных, лимиты
- Инструменты с минимумом прав и подтверждением человеком — для денег и персональных данных
- Набор атак в CI: каждая правка промпта или смена модели проверяется на старых обходах
Стек
- Все демо по стеку:
- Нативный JS
- JavaScript без фреймворков
- Unicode NFKC
- Base64
- OWASP Top 10 для LLM
- Vitest
- Playwright
- Vite
Основано на
Книги и дисциплины, идеи из которых работают в этом демо.
Книга · Фань Вэньцзе, Ли Цзяньчао, Янь Сяофань, Чжан Бинь
Вайб-программирование. Разработка кода в эпоху искусственного интеллекта
Все атаки прогоняются против всех уровней защиты автотестами Vitest и Playwright: что бы ни сгенерировала модель, регрессию ловят тесты.
Книга · Брюс Шнайер
Взломать всё
Тренажёр атак на бота поддержки: 15 атак, непрямые инъекции через письма и отзывы, шесть уровней защиты по OWASP Top 10 для LLM.
Книга · Чарльз Петцольд
Код. Тайный язык информатики
Атаки через base64, невидимые символы и латинские буквы-двойники: защита сначала приводит текст к одному виду (Unicode NFKC).
Комментарий от разработчика
Антон Гончаров
Разработчик ИИ-систем · Python
Для бизнеса
- Бот с доступом к деньгам и данным — новая точка атаки. Тренажёр показывает на понятных примерах, что может случиться.
- Главное правило: деньги и персональные данные — только с подтверждением человека или проверкой в коде.
- Проверить бота до запуска дешевле, чем разбираться с утёкшим промокодом после.
Для разработчиков
- Модель здесь — детерминированная имитация доверчивой модели, поэтому каждая атака воспроизводится одинаково и попадает в регрессионный тест.
- Слои защиты: нормализация Unicode и невидимых символов, шаблоны атак, разделение инструкций и данных, права инструментов, фильтр вывода, canary-токен и лимит попыток.
- Таблицу «атаки × уровни» проверяют Vitest и Playwright при каждой сборке.
Советы
Совет 01
Не храните секреты в системном промпте — рано или поздно его вытащат.
Совет 02
Права инструмента проверяйте в коде по пользователю, а не по тексту, который прислала модель.
Нужен такой же для вашего бизнеса?
Расскажите о задаче — отвечу, что из демо подойдёт вам, сколько это займёт и что понадобится с вашей стороны.
Другие демо в этом разделе
Все демо- работает
Веб-приложение · схема агента
Конструктор AI-агента
Агент поддержки собирается из блоков: намерения, база знаний, вызовы API, проверки и передача оператору. Отправьте сообщение клиента — путь подсветится на схеме шаг за шагом.
- React
- TypeScript
- работает
Веб-приложение · вопрос → SQL → график · PostgreSQL в браузере
ИИ-аналитик данных
Руководитель спрашивает своими словами — «выручка по каналам за 3 квартал», «какие клиенты перестали заказывать» — и получает SQL, график, таблицу и вывод. База продаж — настоящий PostgreSQL, который работает прямо в браузере.
- React
- TypeScript
- работает
Веб-приложение · риски по эталону · Word с правками
Проверка договоров
Контрагент прислал свой договор — проверка сверяет его с эталоном компании, подсвечивает рискованные пункты, объясняет, чем они опасны, и предлагает редакцию. На выходе — Word с режимом исправлений и протокол разногласий.
- React
- TypeScript
- работает
Веб-приложение · задачи из чата · канбан · вечерняя сводка
ИИ-агент в рабочем чате
В рабочем чате пишут как обычно — «Петя, до пятницы поправь прайс». Агент сам заводит задачу на канбане, двигает её по «Беру» и «Готово», переносит сроки и передаёт задачи, утром напоминает о просрочке, а вечером присылает сводку.
- React
- TypeScript
- работает
Веб-приложение · общий ящик · CRM · защита от подмены реквизитов
ИИ-разбор входящей почты
Агент читает общий ящик отдела продаж: понимает, что за письмо, достаёт поля, заводит сделку, обращение или задачу в CRM и готовит ответ. Счёт с новыми реквизитами и фишинг он ловит до того, как кто-то заплатит или перейдёт по ссылке.
- React
- TypeScript
- работает
Веб-приложение · маркетплейсы · проверка модерации · юнит-экономика
Карточки товаров для WB и Ozon
Агент превращает текст поставщика в две карточки — для Wildberries и для Ozon: название в лимите площадки, описание с ключевыми запросами, характеристики по справочнику. Потом проверяет то, на чём карточки срезаются на модерации, и считает, сколько останется с продажи.
- React
- TypeScript
- работает
Веб-приложение · расшифровка встречи · протокол · канбан
Протокол совещания → задачи в канбан
Агент читает расшифровку планёрки и собирает протокол: решения, задачи с исполнителем и сроком из живой речи, риски и открытые вопросы. Задачи уходят на канбан, а на следующей встрече агент сам двигает их по статусам.
- React
- TypeScript
- работает
Веб-приложение · персональные данные · медицина · аналитика
Обезличивание данных перед нейросетью (152-ФЗ)
Агент находит в письмах и расшифровках ФИО в любом падеже, телефоны, паспорта, СНИЛС, карты, адреса и диагнозы, заменяет их до отправки во внешнюю нейросеть, а её ответ возвращает к настоящим данным уже у вас. Таблицу пациентов обезличивает для аналитики так, чтобы никого нельзя было узнать.
- React
- TypeScript
- работает
Веб-приложение · автоматизация · amoCRM, 1С, Telegram
Конвейер автоматизации в духе n8n
Три рабочих сценария мебельной фабрики на холсте, как в n8n: заявки с сайта уходят в amoCRM и к менеджерам по горячести, оплата ЮKassa — в 1С с повторами и веткой ошибок, по утрам — сводка руководителю. Запустите событие и смотрите, как записи идут от узла к узлу; схему можно править и выгрузить в настоящий n8n.
- React
- TypeScript
- работает
Веб-приложение · мультиагентная система · контент
Команда ИИ-агентов для контента
Шесть агентов готовят публикацию по брифу: главред планирует, исследователь ищет факты в базе знаний, автор пишет, фактчекер и редактор возвращают черновик на доработку, SMM раскладывает текст по Telegram, ВКонтакте, рассылке, блогу и карусели. Видно всю переписку агентов, каждую правку и что ушло бы в публикацию без проверки.
- React
- TypeScript
- работает
Веб-приложение · HR · скоринг и чат-бот
Отбор резюме и бот-интервьюер
Двадцать резюме на три вакансии разбираются за секунды: периоды работы, стаж, зарплата и город, совпадение с требованиями и цитата из резюме на каждое «да» или «нет». Чего в резюме не хватает, уточняет бот: задаёт только недостающие вопросы, переспрашивает размытые ответы и записывает на собеседование. Пол, возраст и семья в оценку не попадают.
- React
- TypeScript
- работает
Веб-приложение · RAG · нейросеть в браузере
Песочница поиска
Как бот поддержки находит ответ в базе знаний: документы режутся на фрагменты, поиск идёт по словам, по смыслу или гибридом, и у каждого найденного фрагмента видно, почему он выше других.
- React
- TypeScript
- Нейросеть в браузере
- работает
Веб-приложение · метрики · пороги CI
Оценка качества бота
Прежде чем выкатить новую настройку бота, её прогоняют на контрольных вопросах. Здесь видно, как это устроено: hit@1, hit@3, доля верных отказов, сравнение с продом и красная плашка, если CI не пропустил бы выкладку.
- React
- TypeScript
- Нейросеть в браузере
- работает
Веб-приложение · экономика AI · нативный JS
Калькулятор стоимости AI-бота
Сколько будет стоить бот в месяц на GPT, Claude, YandexGPT, GigaChat или своей модели на арендованной видеокарте. Расчёт по токенам, сравнение всех моделей на графике, советы, как платить меньше, и настоящий токенизатор o200k прямо в браузере.
- Нативный JS