Как я прокачал VK Teams: от кастомных реакций до AI-ассистента с записью звонков. vkteams.. vkteams. Веб-разработка.. vkteams. Веб-разработка. интерфейсы.. vkteams. Веб-разработка. интерфейсы. Мессенджеры.. vkteams. Веб-разработка. интерфейсы. Мессенджеры. Программирование.. vkteams. Веб-разработка. интерфейсы. Мессенджеры. Программирование. разработка.. vkteams. Веб-разработка. интерфейсы. Мессенджеры. Программирование. разработка. расширения chrome.. vkteams. Веб-разработка. интерфейсы. Мессенджеры. Программирование. разработка. расширения chrome. Расширения для браузеров.

История о том, как простое желание поставить эмодзи-клоуна переросло в полноценное расширение с искусственным интеллектом

Пролог: Когда эмодзи становится проблемой

Знаете это чувство, когда коллега пишет что-то настолько абсурдное в рабочем чате, что хочется поставить реакцию 🤡, но в списке реакций её нет? А есть только стандартные 👍❤️😂😮😢🔥?

Именно с этого всё и началось.

Мы в компании используем VK Teams (да, тот самый корпоративный мессенджер от VK), и в какой-то момент я понял, что мне катастрофически не хватает кастомных реакций. Захотел поставить 💩 на очередной упавший деплой – нельзя. Захотел 🤦 на “забыл закоммитить” – тоже нельзя. Захотел ✨ на красивое решение – опять мимо.

И тут я подумал: “А что если… сделать это самому?”

Так началось моё путешествие в мир браузерных расширений, которое переросло в нечто гораздо большее. Спойлер: в итоге я получил не только кастомные эмодзи, но и AI-помощника, который пишет ответы за меня, и автоматическую запись звонков с расшифровкой. Но обо всём по порядку.

Глава 1: Userscript, который не взлетел

Первая мысль была очевидной: “Напишу простенький скрипт через Tampermonkey, и дело с концом!”

Идея простая как пять копеек:

  1. Скрипт находит все сообщения на странице

  2. Добавляет к каждому красивую кнопку 🎨

  3. При клике показывает выбор из 6 кастомных эмодзи

  4. Отправляет выбранную реакцию на сервер

Час работы, и готово! Запускаю, жму на кнопку и… ничего. Открываю консоль браузера, а там:

Refused to execute inline script because it violates
the following Content Security Policy directive...

О нет. CSP. Content Security Policy.

Для тех, кто не в курсе: это такая штука в браузере, которая запрещает сторонним скриптам делать что попало на странице. Придумана для безопасности, чтобы злоумышленники не могли внедрить свой код. И VK Teams, как и любой современный сервис, использует очень строгий CSP.

Проблема в том, что Tampermonkey работает именно через внедрение кода в страницу. А VK Teams говорит: “Нет, мой друг, здесь чужой код не запускается.”

Даже если я открою консоль браузера и попытаюсь вручную выполнить любой код – CSP блокирует и это. Полная изоляция.

Попытка №1**: Неудача ❌

Но я не сдался. Стал гуглить, читать StackOverflow, спрашивать у ChatGPT. И выяснил интересную вещь: браузерные расширения обходят CSP! Они работают в специальном изолированном контексте, у них есть привилегии, которых нет у обычных скриптов.

Значит, нужно делать расширение.

Глава 2: Chrome Extension – правильный путь

Почему расширение работает, а скрипт нет?

Представьте, что сайт – это закрытая вечеринка. CSP – это охрана на входе, которая проверяет приглашения. Userscript – это чувак, который пытается проникнуть без приглашения, через окно. Охрана его ловит и выкидывает.

А расширение для браузера – это VIP-гость, у которого есть золотая карта. Охрана его пропускает, потому что он пришёл не снаружи (со страницы), а изнутри (из браузера).

Технически, расширение работает в “isolated world” – отдельном мире, который может видеть и изменять страницу, но при этом не подчиняется её правилам безопасности.

Как работает расширение

Браузерное расширение – это набор файлов:

  • manifest.json – главный файл, в котором описано, что умеет расширение

  • content.js – скрипт, который запускается прямо на странице VK Teams

  • background.js – фоновый скрипт, работающий в браузере (для особо сложных задач)

  • popup.html – всплывающее окно с настройками

Я начал с манифеста – описал, что расширение будет работать только на страницах VK Teams, и ему нужен доступ к активной вкладке и cookies (чтобы читать токен авторизации).

Находим сообщения и добавляем кнопки

Первая задача: найти все сообщения на странице и добавить к каждому кнопку.

Казалось бы, просто: при загрузке страницы ищем все сообщения и добавляем кнопки. Но VK Teams – это современное одностраничное приложение (SPA). Когда вы переключаетесь между чатами, страница не перезагружается полностью, а содержимое меняется динамически. Сообщения появляются и исчезают на лету.

Решение – использовать MutationObserver. Это встроенная в браузер штука, которая следит за изменениями в структуре страницы и сообщает, когда что-то добавилось или удалилось. Как видеонаблюдение за DOM-деревом.

Настроил наблюдатель, и теперь он автоматически отлавливает все новые сообщения и сразу добавляет к ним кнопки. Красота!

Отправляем реакцию

Самое интересное – как отправить реакцию на сервер?

Я открыл DevTools, вкладку Network, и стал кликать на стандартные реакции в VK Teams, наблюдая, какие запросы уходят. И увидел красоту: VK Teams использует внутренний API (они называют его RAPI – REST API).

Каждый раз, когда вы ставите реакцию, уходит POST-запрос на специальный адрес. В запросе передаётся:

  • ID сообщения (какому сообщению ставим реакцию)

  • ID чата (в каком чате находимся)

  • Сам эмодзи (👍 или 🔥)

  • Токен авторизации (AIMSID) – читается из cookies

Я просто повторил этот запрос из своего расширения. Отправил – сработало! Реакция появилась в чате.

Результат: Работает! 🎉

Теперь я могу ставить любые эмодзи – 🤡, 💩, 🤦, ✨ – что душе угодно. Коллеги увидели и начали спрашивать: “Как ты это делаешь?!” Эффект достигнут.

Казалось бы, можно остановиться. Задача решена. Но… разработчику всегда мало. У меня уже есть кнопка на каждом сообщении. А что если добавить туда ещё что-нибудь полезное?

Глава 3: “А что если добавить AI?”

Через неделю использования расширения меня осенило.

Смотрю я на эту кнопку 🎨 рядом с каждым сообщением и думаю: “У меня уже есть инфраструктура – кнопка, popup, обработчик кликов. А что если сделать не просто реакции, а умные действия с помощью AI?”

Представьте:

  • Коллега написал длинное сообщение на три абзаца? Кнопка “Сжать” – AI делает короткое резюме в 2 предложениях.

  • Пришло сообщение, нужно ответить, но лень думать? Кнопка “Smart Reply” – AI генерирует уместный ответ.

  • Технарь написал что-то с кучей терминов, а нужно переслать менеджеру? Кнопка “Объяснить простым языком” – AI переводит технический жаргон на человеческий.

  • Сообщение на английском? Кнопка “Перевести” – мгновенный перевод.

  • Хочется изменить тон с “Исправь этот баг!” на вежливое “Не мог бы ты посмотреть эту проблему?”? Кнопка “Изменить тон” – AI переписывает в нужном стиле.

Идея показалась настолько крутой, что я решил: делаю!

Выбираем AI провайдера

Первый вопрос: какой AI использовать?

Вариантов куча:

  • OpenAI (GPT-4, GPT-3.5) – самый популярный, отличное качество

  • Anthropic Claude – очень умный, хорошо понимает контекст

  • Google Gemini – быстрый и бесплатный в разумных лимитах

  • Ollama – локальные модели, работают прямо на компьютере

  • Любой кастомный API – может, у вас в компании свой AI?

Я не хотел привязываться к одному провайдеру. Поэтому сделал универсальный интерфейс, который поддерживает все пять вариантов. Выбираешь в настройках что хочешь, вводишь API ключ – и готово.

Все провайдеры работают примерно одинаково: отправляешь текстовый запрос (промпт) – получаешь текстовый ответ. Детали немного отличаются (разные ф��рматы запросов, разные адреса), но суть одна.

Проблема: браузер блокирует запросы

Написал код, который отправляет запрос к OpenAI… и снова получил ошибку! На этот раз CORS (Cross-Origin Resource Sharing).

Браузер не разрешает странице отправлять запросы на другие домены. Это защита от злоумышленников. Страница VK Teams не может просто так отправить запрос к OpenAI – браузер блокирует.

Но у расширений есть преимущество: background script (фоновый скрипт расширения) работает не на странице, а в браузере, и у него полные права. Он может отправлять запросы куда угодно.

Решение простое:

  1. Кнопка на странице отправляет сообщение фоновому скрипту: “Эй, отправь это к OpenAI!”

  2. Фоновый скрипт делает запрос к OpenAI

  3. Получает ответ и передаёт обратно на страницу

  4. Страница показывает ответ пользователю

Это как посредник: страница не может сама сходить в магазин (CORS не пускает), но может попросить курьера (background script), у которого есть пропуск.

Пишем умные промпты

Самое интересное в работе с AI – это написание правильных промптов (запросов).

Нельзя просто написать “Ответь на это сообщение”. AI не знает контекста – где вы работаете, какой тон нужен, насколько формально отвечать.

Нужно детально объяснить задачу. Например, для функции “Smart Reply” я написал:

“Ты помощник для корпоративного мессенджера. Твоя задача – сгенерировать уместный ответ на сообщение коллеги. Это рабочая переписка, нужен краткий естественный ответ. Если это вопрос – дай конкретный ответ. Если просьба – подтверди понимание. Длина: 1-3 предложения. Тон профессиональный но дружелюбный. Избегай шаблонных фраз.”

Чем детальнее промпт, тем лучше результат.

Мой любимый промпт – для функции “Explain for Manager” (объяснить менеджеру). Он берёт техническое сообщение и переводит на простой язык:

Было: “Деплой упал из-за race condition в микросервисе, нужно рефакторить”
Стало: “Обновление системы не прошло из-за конфликта данных. Старый код мешает, нужна неделя на исправление”

Менеджер доволен, все всё поняли, никто не спрашивает “А что такое race condition?”

Результат: AI прямо в чате

Теперь у меня на каждом сообщении не просто кнопка с эмодзи, а целое меню:

  • 🎨 Реакции – стандартные + кастомные эмодзи

  • Smart Reply – AI пишет ответ

  • 📝 Summarize – сжимает длинный текст

  • 🌐 Translate – переводит

  • 🎭 Change Tone – меняет стиль (формальный/неформальный/дружелюбный)

  • 💼 Explain for Manager – упрощает технический жаргон

Коллеги смотрят как на волшебника. “Как ты так быстро отвечаешь?” А я просто жму кнопку, AI думает 2 секунды, и готово.

Иногда даже забавно: получаю длинное техническое сообщение, жму “Summarize”, получаю две строки с сутью, жму “Smart Reply”, и ответ готов. Потратил 5 секунд вместо 5 минут.

Глава 4: “Раз уж есть AI, почему бы не записывать звонки?”

Сидим мы как-то с коллегой на созвоне в VK Teams, обсуждаем архитектуру нового микросервиса. Он объясняет важную штуку про балансировку нагрузки, я киваю, понимаю… и через 10 минут уже не помню половину деталей.

“Подожди, повтори про ту часть с кешированием?”
“Эм… я уже не помню точно, что говорил…”

Классика.

И тут я вспоминаю: в VK Teams же есть встроенная запись звонков! Сейчас включу, и проблема решена.

Но не всё так просто. Начинаю разбираться, и вот что обнаруживаю:

Проблема №1: Запись нужно включать вручную каждый раз
Нельзя сделать “записывай все звонки автоматически”. Перед каждым звонком нужно не забыть нажать кнопку “Начать запись”. А если ты это вспомнил через 5 минут разговора – начало уже потеряно.

Проблема №2: Ждать обработки
После звонка файл не доступен сразу. VK Teams отправляет запись боту, который её обрабатывает. Это может занять от 1 до 10 минут, в зависимости от длины звонка и нагрузки на серверы.

Сидишь, ждёшь… а тебе нужно ПРЯМО СЕЙЧАС вспомнить, что там сказали про дедлайн.

Проблема №3: Файл приходит в личку
После обработки бот присылает аудио-файл тебе в личные сообщения. Не в чат, где был звонок. Не в удобный плеер с тайм-кодами. А просто файл в личку.

Хочешь найти запись недельной давности? Скроль, скроль, скроль… где-то здесь была…

Проблема №4: Расшифровка – отдельный квест
Транскрибации нет вообще. Хочешь текст разговора? Извольте:

  1. Скачать аудио-файл

  2. Зайти на какой-то сторонний сервис (или поднять свой Whisper)

  3. Загрузить файл туда

  4. Подождать обработки

  5. Скопировать текст

  6. Сохранить где-то

15 минут на то, что должно быть одной кнопкой.

Проблема №5: Разделения спикеров нет
Даже если ты получил расшифровку, там просто сплошной текст. Непонятно, кто что говорил. Приходится вспоминать по контексту.


Я посмотрел на всю эту боль и подумал: “Ну его. У меня уже есть AI в расширении… и background script, который может делать что угодно… и я уже умею работать с браузером…”

Моя идеальная запись звонков:

  • ✅ Включается автоматически (не нужно помнить про кнопку)

  • ✅ Доступна сразу после звонка (не ждать обработки)

  • ✅ Хранится локально в браузере (быстрый доступ, не искать в личке)

  • ✅ Автоматическая расшифровка через Whisper

  • ✅ Разделение спикеров через AI

  • ✅ Удобный поиск по тексту

Думаю: “А что если сделать это самому?”

Задача нетривиальная, но интересная. Погнали!

Проблема №1: Как перехватить аудио напрямую?

Стандартная запись VK Teams работает так: звук идёт на их серверы, там обрабатывается, конвертируется, и только потом приходит вам файлом в личку. Это занимает время.

Мне нужно было перехватить аудио-поток напрямую в браузере, ДО того как VK Teams отправит его на обработку. Тогда я смогу сохранить запись мгновенно, без ожидания.

В браузере звук работает через WebRTC (технология для видео/аудио звонков). VK Teams запрашивает у браузера доступ к микрофону и настраивает соединение для получения звука от собеседника.

Решение – я “подменил” эти функции браузера. Представьте, что вы сделали копию ключа от квартиры до того, как отдали оригинал. Технически это называется “monkey patching” – переопределение встроенных функций.

Теперь, когда VK Teams говорит: “Браузер, дай доступ к микрофону”, браузер сначала спрашивает у меня. Я отвечаю: “Держи”, но попутно сохраняю копию аудио-потока себе. Для VK Teams всё выглядит нормально, а у меня есть пря��ой доступ к звуку!

То же самое с входящим звуком от собеседника – перехватываю и сохраняю копию.

Проблема №2: Как определить начало и конец звонка?

Не могу же я записывать непрерывно весь день. Нужно понять, когда звонок начался и когда закончился.

VK Teams показывает окно звонка – специальный интерфейс с кнопками “Завершить”, таймером и т.д. Я сделал детектор, который каждую секунду проверяет: есть ли на странице окно звонка?

Появилось окно – начинаю запись. Исчезло – останавливаю и сохраняю файл.

Просто, но работает надёжно.

Проблема №3: Куда сохранять записи?

Записи могут быть большими – часовой звонок это 20-30 МБ аудио. Нельзя использовать обычное хранилище браузера (localStorage) – там лимит 10 МБ.

Решение – IndexedDB. Это встроенная в браузер база данных, где можно хранить сколько угодно данных (ну, в разумных пределах – пока не кончится место на диске).

Создал базу данных, в ней таблицу “recordings” (записи). Каждая запись содержит:

  • Аудио-файл (Blob)

  • Дату и время звонка

  • Длительность

  • Имя собеседника (если удалось определить)

  • Текст расшифровки (добавляется позже)

Добавляем Whisper для расшифровки

Запись есть, но слушать часовой звонок заново – не вариант. Нужна расшифровка.

OpenAI Whisper – это AI модель, которая переводит речь в текст. Причём очень точно, даже с акцентами и шумом справляется.

У Whisper есть API: отправляешь аудио-файл – получаешь текст. Идеально!

Единственная сложность: нельзя отправить файл прямо со страницы (опять CORS). Но у меня уже есть background script-посредник, который решает эту проблему.

После з��писи звонка автоматически отправляю аудио в Whisper API, получаю расшифровку, сохраняю в базу данных.

Проблема №5: Как разделить спикеров?

Whisper возвращает просто текст разговора одним полотном:

“Привет как дела отлично слушай по поводу проекта нужно обсудить архитектуру да согласен давай начнём с базы данных…”

Непонятно, кто что сказал. Где моя реплика, где коллеги?

Whisper не умеет разделять спикеров (это называется speaker diarization). Но… у меня же уже есть AI! Который понимает контекст!

Отправляю расшифровку в Claude/GPT с промптом:

“Это транскрипция разговора двух людей. Определи, кто что говорит, основываясь на контексте, вопросах-ответах, паузах. Раздели на реплики: Участник 1: …, Участник 2: …”

И AI прекрасно справляется! Он видит структуру диалога (один спрашивает – другой отвечает), понимает смену темы, видит обращения (“как ты думаешь…”) и разбивает текст на спикеров.

Результат получается вот такой:

Участник 1: Привет! Как дела?
Участник 2: Отлично, спасибо! Слушай, по поводу проекта – нужно обсудить архитектуру.
Участник 1: Да, согласен. Давай начнём с базы данных…

Гораздо удобнее читать!

Итоговый флоу записи звонка

Весь процесс выглядит так:

  1. Начало звонка – детектор замечает окно звонка, автоматически начинает запись

  2. Перехват аудио – ловлю аудио-поток напрямую через monkey patching WebRTC

  3. Запись в реальном времени – сохраняю звук по мере разговора

  4. Конец звонка – детектор замечает, что окно закрылось

  5. Сохранение – мгновенно записываю файл в IndexedDB (без ожидания обработки)

  6. Расшифровка – автоматически отправляю в Whisper API

  7. Разделение спикеров – отправляю транскрипцию в AI

  8. Готово – запись с текстом доступна сразу в расширении

Всё автоматически! Просто разговариваешь, и после звонка у тебя полная расшифровка. Без кнопок, без ожидания, без поисков файла в личке.

Зачем это нужно?

После внедрения этой функции я:

  • Перестал забывать детали важных разговоров

  • Могу быстро найти нужный момент по тексту (Ctrl+F)

  • Делюсь расшифровками с коллегами, которые пропустили встречу

  • Использую как базу знаний (“А как мы тогда решили про кеширование?”)

Особенно полезно на технических обсуждениях, где много деталей, и на встречах с менеджментом, где важно не упустить договорённости.

Финальная картина: Что получилось

К этому моменту моё “простое расширение для эмодзи” превратилось в полноценный комбайн:

1. Кастомные реакции

  • 6 эмодзи на выбор (можно настроить свои)

  • Кнопка на каждом сообщении

  • Работает быстро и надёжно

2. AI-ассистент

  • 5 типов AI на выбор (OpenAI, Claude, Gemini, Ollama, Custom)

  • Smart Reply – автоответы

  • Summarize – сжатие длинных сообщений

  • Translate – перевод

  • Change Tone – изменение стиля

  • Explain for Manager – перевод технического на человеческий

3. Запись звонков

  • Автоматическая запись (без кнопок)

  • Мгновенный доступ после звонка

  • Автоматическая расшифровка через Whisper

  • Разделение спикеров через AI

  • Хранение локально в браузере

  • Удобный просмотр и поиск по тексту

Всё это живёт в одном расширении, работает бесшовно, не требует сложной настройки.

Технические вызовы и как я их решил

Оглядываясь назад, вот самые интересные проблемы, с которыми пришлось столкнуться:

1. CSP (Content Security Policy)

Проблема: Userscript блокируется политикой безопасности VK Teams
Решение: Chrome Extension работает в изолированном контексте и обходит CSP

2. CORS (Cross-Origin Resource Sharing)

Проблема: Браузер не даёт отправлять запросы к AI API с чужого домена
Решение: Background script как посредник с полными правами

3. Динамический DOM

Проблема: VK Teams – одностраничное приложение, сообщения появляются/исчезают динамически
Решение: MutationObserver следит за изменениями и добавляет кнопки на лету

4. Перехват аудио в реальном времени

Проблема: Нужно получить доступ к аудио-потоку напрямую, не дожидаясь обработки на серверах VK Teams
Решение: Monkey patching WebRTC API для перехвата потоков до их отправки на сервер

5. Автоматическое определение звонка

Проблема: Нужно автоматически начинать/останавливать запись без ручного нажатия кнопки
Решение: Детектор отслеживает появление/исчезновение UI элементов звонка

6. Передача больших файлов

Проблема: Аудио-файлы нельзя напрямую передать между частями расширения
Решение: Конвертация в Base64 перед передачей

7. Разделение спикеров

Проблема: Whisper не умеет speaker diarization
Решение: AI анализирует транскрипцию по контексту и разбивает на реплики

8. Хранение больших данных

Проблема: localStorage слишком мал для аудио-записей
Решение: IndexedDB для хранения больших объёмов данных локально

Уроки, которые я вынес

1. Расширения мощнее скриптов

Если нужно обойти ограничения браузера (CSP, CORS) – однозначно идите в расширения. Они работают на более глубоком уровне и имеют привилегии, которых нет у обычных скриптов.

2. Один раз построишь инфраструктуру – потом добавляй фичи легко

После того, как я сделал кнопку с popup’ом для эмодзи, добавить туда AI было делом пары часов. А потом добавить запись звонков – ещё столько же. Хорошая архитектура окупается.

3. AI – это просто инструмент

Не нужно быть ML-инженером, чтобы использовать AI. Достаточно понять, как работает API (отправляешь текст – получаешь текст), и научиться писать хорошие промпты.

4. Monkey patching – мощная техника

Подмена встроенных функций браузера даёт невероятные возможности. Но нужно делать это аккуратно – важно перехватить функцию ДО того, как страница начнёт её использовать.

5. Браузерные API очень мощные

Web Audio API, MediaRecorder, IndexedDB, WebRTC – в браузере есть всё, чтобы сделать сложные вещи. Не нужны внешние библиотеки на гигабайт – всё встроено.

6. Хорошие промпты = хорошие результаты

Качество работы AI на 80% зависит от промпта. Чем детальнее описываешь задачу, контекст, примеры – тем лучше результат. Первый промпт почти никогда не идеален – нужно итерировать.

7. Пользователи любят магию

Коллеги не хотят знать про WebRTC, monkey patching, Whisper API. Им нравится магия: “Я говорю – появляется текст”. Простой UX важнее технической сложности под капотом.

Что дальше?

Текущая версия работает стабильно, но идей ещё куча:

1. Real-time транскрипция
Расшифровывать разговор прямо во время звонка, показывать субтитры в реальном времени. Технически возможно через streaming к Whisper API.

2. Голосовые команды
“Окей, VK Teams, поставь 🔥 на последнее сообщение от Саши”. Распознавание речи + выполнение команд.

3. Умные саммари встреч
После звонка автоматически генерировать:

  • Краткое резюме

  • Список action items (кто что должен сделать)

  • Важные решения

  • Вопросы, которые остались открытыми

4. Интеграция с Notion/Confluence
Автоматически сохранять расшифровки и саммари в корпоративную wiki.

5. Детекция эмоций
Анализ тона голоса – энтузиазм, фрустрация, сарказм. Полезно для понимания, как на самом деле собеседник относится к обсуждаемой теме.

6. Многоязычность
Автоматическое определение языка и перевод в реальном времени. Говоришь на русском – собеседник видит английские субтитры (или наоборот).

7. Умный поиск по звонкам
“Найди все звонки, где мы обсуждали архитектуру базы данных”. Semantic search по векторным эмбеддингам.

8. Анализ продуктивности
Статистика: сколько времени в созвонах, какие темы обсуждаются чаще, с кем общаешься больше всего.

Но это всё в будущем. Пока наслаждаюсь тем, что есть.

Как попробовать?

Проект полностью open-source и доступен на GitHub:

🔗 https://github.com/nordby/vk-teams-custom

Установка за 2 минуты:

  1. Скачайте проект с GitHub (зелёная кнопка Code → Download ZIP)

  2. Откройте в Chrome страницу chrome://extensions/

  3. Включите “Режим разработчика” (Developer mode) в правом верхнем углу

  4. Нажмите “Загрузить распакованное расширение” (Load unpacked)

  5. Выберите папку с расширением

  6. Готово! Откройте VK Teams и увидите кнопку 🎨 на каждом сообщении

Настройка AI (опционально):

Если хотите использовать AI-функции:

  1. Кликните на иконку расширения в браузере

  2. Выберите AI провайдера (OpenAI, Claude, Gemini, Ollama, Custom)

  3. Введите API ключ

  4. Сохраните

Готово! Теперь доступны Smart Reply, Summarize, Translate и остальные AI-функции.

Настройка записи звонков (опционально):

  1. Откройте настройки расширения

  2. Включите “Запись звонков”

  3. Выберите, хотите ли автоматическую расшифровку

  4. При желании настройте модель Whisper (работает с любым OpenAI-compatible API)

Звонки будут записываться автоматически и сохраняться локально в браузере.

Безопасность и приватность

Что хранится локально (в вашем браузере):

  • Настройки расширения

  • API ключи (в chrome.storage)

  • Записи звонков (в IndexedDB)

  • Транскрипции

Что отправляется наружу:

  • Текст сообщений → в выбранный вами AI API (только при клике на AI-функции)

  • Аудио-записи → в Whisper API (только если включена транскрибация)

  • Реакции → на сервера VK Teams (через официальный API)

Что НЕ отправляется:

  • Личные сообщения (без вашего явного действия)

  • История переписки

  • API ключи (хранятся только локально)

  • Любые данные третьим лицам

Подробнее о безопасности читайте в файле SECURITY.md в репозитории.

Можно ли использовать с другими мессенджерами?

Технически – да! Архитектура достаточно универсальная.

Основное, что нужно адаптировать:

  • Селекторы сообщений (как найти сообщения на странице)

  • API endpoint (куда отправлять реакции)

  • Метод авторизации (вместо AIMSID может быть другой токен)

Если в вашей компании используется Slack, Microsoft Teams, Mattermost или что-то ещё – можете форкнуть проект и адаптировать. Основная логика (AI, запись звонков, UI) остаётся той же.

Заключение

Вот так простое желание поставить эмодзи-клоуна превратилось в полноценное расширение с искусственным интеллектом и автоматической записью звонков.

Это отличный пример того, как одна маленькая идея может снежным комом вырасти во что-то большое и полезное.

Три главных урока:

  1. Решайте свои реальные проблемы – лучшие проекты рождаются не из абстрактных идей, а из личного неудобства. Мне не хватало эмодзи – я сделал расширение.

  2. Не бойтесь расширять scope – после эмодзи я подумал “раз уж я здесь, почему бы не добавить AI?”, потом “раз есть AI, почему бы не записывать звонки?”. Каждая следующая фича становится проще предыдущей.

  3. Open source это круто – я делился кодом с коллегами, получал feedback, добавлял фичи по их запросам. Проект становится лучше, когда над ним работает не один человек.

Если вы используете VK Teams – попробуйте расширение! Если используете другой мессенджер – форкните и адаптируйте.

А если у вас есть идеи по улучшению или нашли баг – welcome в issues и pull requests на GitHub! 🚀


P.S. Коллега, которому я впервые поставил 🤡 на сообщение про упавший деплой, сказал: “Наконец-то адекватная реакция!” Миссия выполнена. ✅

P.P.S. Да, и я всё-таки записал тот звонок про архитектуру. Расшифровка помогла – вспомнил все детали про кеширование! 📝

Автор: nordby

Источник

Rambler's Top100