Аудит в подарокАудит сайта в подарокдо 31 декабряПодробнее
Тема
Телеграм-боты
Дата
Спрос на вопрос
150 показов в месяц

Telegram Mini Apps: приложение внутри мессенджера

Telegram Mini Apps: как устроены, как валидируется initData, что доступно и чего нет, цена от 60 000 до 250 000 ₽ и когда это лучше мобильного приложения.

Telegram Mini Apps - это ваш веб-интерфейс, который открывается прямо в мессенджере: без установки, без магазина приложений и без ревью. По деньгам он ближе к боту, чем к приложению: от 60 000 до 250 000 ₽, срок 1-3 недели, для сложного интерфейса с каталогом и кабинетом выше.

Технически ничего экзотического тут нет, и это главное, что стоит понять до заказа. Ниже - как оно устроено, где ломается безопасность, что платформа даёт и чего у неё нет, и в каких случаях это правильнее мобильного приложения за 350 000 ₽ и больше.

Разработка Telegram-ботовот 60 000 до 250 000 ₽сроки: 1-3 недели

Как это устроено

Мини-приложение это обычный сайт. HTML, CSS, JavaScript, любой фреймворк, свой хостинг, свой домен с HTTPS. Telegram открывает его во встроенном WebView и подключает свой скрипт, который даёт мост к мессенджеру.

Через этот мост приходит:

  • тема оформления - цвета фона, текста, кнопок и подсказок, чтобы приложение выглядело как часть клиента, а не как чужая страница;
  • системные кнопки - MainButton внизу экрана (у неё есть состояния загрузки и блокировки) и BackButton в шапке;
  • данные пользователя - id, имя, username, язык, наличие Premium;
  • haptics - тактильный отклик на нажатия и события;
  • методы окна - развернуть на весь экран, закрыть, запросить подтверждение выхода, включить свайп-закрытие или отключить его.

Запускается всё из бота: кнопкой под сообщением, кнопкой меню рядом с полем ввода, из инлайн-режима или прямой ссылкой. Бот и мини-приложение это одна сущность: токен один, пользователь один, уведомления шлёт бот.

Валидация initData: место, где ломаются все

При запуске мессенджер передаёт в приложение строку initData - там id пользователя, имя, время запуска и подпись. Подпись считается по HMAC от секрета, полученного из токена вашего бота.

Дальше принципиальный момент. Данные пользователя из initData нельзя использовать на клиенте как доказательство личности. Открыть мини-приложение в обычном браузере, подставить в initData любой user id и отправить запрос на ваш API - это делается за час любым человеком с базовыми знаниями. Если сервер верит клиенту на слово, чужой заказ, чужой баланс и чужой кабинет открываются тривиально.

Правильный порядок такой: клиент отправляет initData на сервер целиком, сервер пересобирает строку проверки, считает HMAC вашим токеном, сравнивает с подписью, проверяет auth_date на свежесть (обычно окно в несколько часов) и только после этого выдаёт собственную сессию или JWT. Дальше приложение работает по своему токену, а не по данным Telegram.

Отдельно про сроки: если у вас есть отдельный вход через сайт, привязывать учётные записи надо по подтверждённому идентификатору, а не по имени пользователя. Username в Telegram меняется в любой момент, id - нет.

Разрез приложения: Telegram Mini App

Слои мини-приложения

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

Telegram на телефоне

iOS и Android

Telegram Desktop и Web

тот же код

Одна сборка расходится на две площадки
02

Мост платформы Telegram Web App SDK

  • initData и авторизация
  • MainButton и тема
  • платежи
  • haptic

Что берём у Telegram

  • профиль без регистрации
  • оплата в один шаг
  • шаринг в чаты
  • бот как канал связи
01

Один код Vue 3 + TypeScript

  • экраны и навигация
  • бизнес-логика
  • состояние
  • запросы к API

Магазинов приложений в цепочке нет: версия уезжает к пользователю сразу после деплоя, ревью ждать не нужно.

Что доступно и чего нет

ДоступноНедоступно
Тема оформления и системные кнопкиРабота в фоне: закрыли окно - код остановился
Скан QR-кода встроенной камеройPush-уведомления мимо бота
Запись и чтение буфера обменаПостоянный доступ к камере и датчикам
Геолокация с разрешения пользователяИконка на домашнем экране в привычном виде
Платежи и Telegram StarsФоновая геолокация и Bluetooth
Облачное хранилище для мелких данныхРабота офлайн без сети
Запрос номера телефона по кнопкеДоступ к контактам и файловой системе

Отсутствие фона это ключевое ограничение, из которого следует всё остальное. Мини-приложение живёт ровно столько, сколько открыто окно. Всё, что должно происходить без пользователя (напоминания, статусы заказов, продление подписки), делает бот на вашем сервере, а мини-приложение остаётся только интерфейсом.

Иконка на домашнем экране формально есть в новых версиях клиента, но это не то же самое, что установленное приложение: запуск всё равно идёт через Telegram, и вне мессенджера это не работает.

Оплата: Stars и обычный эквайринг

С 2024 года цифровые товары и услуги внутри мини-приложений на iOS оплачиваются через Telegram Stars - внутреннюю валюту. Это требование платформы, а не выбор разработчика: так Telegram закрывает правила Apple про внутренние покупки. Пользователь покупает звёзды, тратит их у вас, вы выводите выручку. Комиссия на этом пути есть, и считать экономику надо заранее.

Физические товары и офлайн-услуги оплачиваются обычным эквайрингом через платёжного провайдера, подключённого к боту: доставка, запись к мастеру, билет на мероприятие. Тут действуют привычные правила с онлайн-кассой и чеком по 54-ФЗ.

Разница по деньгам ощутимая, поэтому формулировка «что именно вы продаёте» появляется в первом же разговоре. Курс, доступ к закрытому каналу и подписка на сервис это цифра. Кофе, футболка и стрижка это физика.

Сравнение с мобильным приложением

Мобильное приложение у меня стоит от 350 000 до 1 200 000 ₽ и доезжает до сторов за 8-16 недель. Мини-приложение делается за 1-3 недели и стоит от 60 000 до 250 000 ₽. Разница набирается из вещей, которых в мини-приложении просто нет.

Нет барьера установки. Человек нажимает кнопку в чате и уже внутри. Классическая воронка приложения (увидел рекламу, пошёл в стор, скачал 80 мегабайт, зарегистрировался) теряет людей на каждом шаге, и потери там не проценты, а разы.

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

Нет комиссии магазина. Ни 30%, ни 15% для малого бизнеса до 1 млн $ в год. Ни 99 $ в год Apple, ни 25 $ Google. Комиссия остаётся только у платёжного провайдера или у Stars.

Но нет и пользователей вне Telegram. Это симметричная плата. Тот, кто не сидит в мессенджере, к вам не попадёт никак. Нет присутствия в поиске по сторам, нет иконки, которая напоминает о себе на экране телефона, нет полноценных push мимо бота.

Когда Mini App правильный выбор

  • Аудитория уже в Telegram: канал, чат сообщества, клиентская база, которая привыкла писать в мессенджер.
  • Сессии короткие: посмотреть, выбрать, оплатить, закрыть. Запись, заказ, бронь, оплата подписки, проверка баланса.
  • Нужен интерфейс сложнее кнопок: каталог с картинками, фильтры, корзина, календарь со слотами. В чате это неудобно, а в мини-приложении нормально.
  • Нужен личный кабинет клиента: заказы, документы, статусы, бонусы.
  • Нужно быстро проверить гипотезу: три недели против четырёх месяцев, и вы уже знаете, пользуются продуктом или нет.

Когда выбирать не стоит: нужна работа офлайн, нужен доступ к камере или геолокации в фоне, нужен вход не из мессенджера (клиенты с сайта, партнёры, десктоп-сценарии), интерфейс предполагает часы работы с большими таблицами и документами.

Одна кодовая база на Mini App и приложение

Мини-приложение это веб-интерфейс. Гибридный стек тоже веб-интерфейс, упакованный в нативную оболочку через Capacitor. Отсюда следует практичная вещь: один и тот же код может выходить и как мини-приложение в Telegram, и как приложение в App Store и Google Play. Различается слой доступа к платформе: там, где в Telegram вызывается мост мессенджера, в мобильной сборке вызывается нативный плагин.

Так я делал на платформе событий: приложение событий и билетов на Capacitor и Vue, с QR-контролем, ролями и приёмом оплаты по вебхукам. Экономия против нативной разработки под две платформы там вышла больше 10 000 $, и главный выигрыш был не в первом релизе, а в том, что каждая последующая фича писалась один раз.

Разумный порядок для большинства проектов такой: сначала мини-приложение за 1-3 недели, потом, если продукт взлетел и упёрся в аудиторию вне мессенджера, - мобильная сборка на том же коде. Обратный порядок дороже в разы и часто заканчивается тем, что приложение выкатили, а пользоваться им никто не стал.

Состав работ, вилки и примеры сценариев я собрал на странице про разработку телеграм-ботов и мини-приложений. Если интерфейс на старте нужен сложный (каталог, кабинет, оплата), честнее закладывать верхнюю часть вилки: по объёму это уже небольшой веб-сервис, у которого Telegram работает витриной.

Посчитаем вашу задачу

Расскажите, что нужно. Отвечу в течение рабочего дня: сроки, вилка бюджета и что можно не делать, чтобы сэкономить.

Обсудить задачу
Обсудить задачу

Перезвоню сам

Оставьте имя и номер. Позвоню в рабочее время, обычно в течение пары часов.