Музыкальный плеер в Telegram-боте

📎 В уже существующем Telegram-боте, который работает на основе платной подписки (доступ к контенту с медитациями, а также полезным сервисам), нужно было разработать удобное решение для прослушивания медитаций как для пользователей, так и для команды бота. Таким решением стал собственный аудиоплеер. Начнем!

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

— В разделе с медитациями появилось несколько «страниц», на каждой из которых размещалось максимум 6 медитаций (названия указывались в кнопках). Перемещение между страницами занимало время и требовало дополнительных действий от пользователей.

— В кнопку Telegram умещается ограниченное количество символов, а некоторые названия медитаций были слишком длинными. Приходилось сокращать их или придумывать новые формулировки, что влияло на удобство.

— При нажатии на кнопку бот отправлял аудиофайл медитации, что в среднем занимало более 2 секунд, так как файл мог весить до 20 МБ.

— Добавление новой медитации требовало переработки интерфейса: приходилось сдвигать кнопки и корректировать меню, что приводило к регулярным затратам ресурсов команды на обновления.

— В некоторых случаях отправленный аудиофайл оставался в истории переписки пользователя даже после окончания подписки, что было нежелательно, ведь контент является платным.

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

1. Для создания аудиоплеера мы использовали один из доступных «конструкторов» плееров: загрузили в него медитации, сгенерировали изображения с помощью MidJourney. В итоге получился простой, минималистичный и удобный плеер, в котором сразу доступны все медитации.

Видно, что у плеера есть возможность останавливать и снова включать медитацию, перематывать её, переключать на следующую или предыдущую, а также «перемешивать» аудио, если хочется послушать случайную медитацию. Каждая медитация перед названием имеет свой номер — это упрощает навигацию и помогает пользователям вспомнить, какую медитацию они слушали в прошлый раз.

2. Бот создан в SaleBot, поэтому мы создаём отдельную страницу в сервисе, добавляем туда код плеера, немного дорабатываем страницу, чтобы она корректно отображалась на всех устройствах — и готово.

3. Теперь меняем интерфейс самого Telegram-бота: вместо множества страниц с кнопками оставляем один блок с одной кнопкой, которая открывает плеер через Telegram Web Application (приложение внутри Telegram). Почему именно такой вариант? Потому что в этом случае Telegram не «перебрасывает» пользователя на сторонние ресурсы, а открывает плеер прямо внутри мессенджера, что делает процесс быстрым и плавным.

Дополнительный плюс использования Telegram Web Application — безопасность: пользователь не может получить доступ к плееру по одной ссылке, а только через кнопки бота. Скопировать ссылку из кнопки тоже невозможно. Б — безопасность.

4. Теперь важный шаг: делаем в боте так, чтобы у каждого активного пользователя, который платит за подписку, была своя уникальная прокси-ссылка на плеер в Telegram Web Application. Это позволит нам, если подписка пользователя закончится (т.е. он не захочет её продлевать), сделать все ранее отправленные блоки с кнопкой «Слушать» неактивными. Проще говоря, плеер просто не откроется, даже если пользователь перешлёт себе этот блок в избранное или... В общем, опять же — Б — безопасно.

В результате был создан удобный и функциональный аудиоплеер для Telegram-бота, который решает все проблемы, связанные с прежним интерфейсом. Мы заменили громоздкие страницы с кнопками на один блок с кнопкой «Слушать», что значительно упростило навигацию для пользователей. Плеер теперь открывается прямо в Telegram Web Application, без перенаправлений на сторонние ресурсы, что повышает скорость и безопасность.

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

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

В итоге, интерфейс стал более простым, интуитивно понятным и безопасным, а опыт использования для пользователей значительно улучшился.

По любым вопросам, в том числе по созданию ботов, можно писать мне в Telegram