Боты
Где разместить Telegram Mini App: хостинг для приложения в Telegram
Коротко
Telegram Mini App можно разместить на любом хостинге, который отдаёт страницу по адресу с HTTPS: Telegram просто открывает эту ссылку внутри чата. Сам интерфейс — обычный сайт на React, Vue или чистом HTML, а рядом с ним обычно работают сервер для данных и бот, который показывает кнопку запуска. В Netrun все три части можно опубликовать одним проектом или по отдельности и получить готовую ссылку с HTTPS для BotFather. Данные пользователя, которые приходят из Telegram, нужно проверять на сервере, а не доверять им в браузере.
- Telegram Mini App — это веб-страница, которую Telegram открывает внутри чата по ссылке с HTTPS.
- Mini App регистрируется у BotFather командой /newapp или подключается к кнопке меню бота командой /setmenubutton.
- Данные о пользователе приходят в Mini App строкой initData, и её подпись проверяется на сервере через HMAC-SHA-256 с ключом, полученным из токена бота.
- Поле initDataUnsafe в браузере можно подделать, поэтому принимать решения по нему на сервере нельзя.
- Токен бота нельзя класть в код интерфейса: всё, что работает в браузере, может прочитать любой пользователь.
Mini App выглядит как часть Telegram, но устроена проще, чем кажется: это обычная веб-страница, которую Telegram открывает в своём окне поверх чата. Значит, и размещать её нужно как сайт — на хостинге, который выдаёт адрес с HTTPS. Отдельного «магазина приложений» или особого сервера для Mini App у Telegram нет: вы даёте ссылку, Telegram её открывает.
Сложность в том, что Mini App редко бывает одной страницей. Почти всегда рядом нужен сервер, который хранит данные и проверяет, что запрос пришёл от настоящего пользователя Telegram, и бот, через которого человек вообще находит приложение. Ниже — как разложить эти части, где их держать и что сделать в BotFather, чтобы кнопка открывала ваше приложение. Если интерфейс и сервер живут на разных адресах, заранее загляните в разбор ошибки CORS.
| Часть | Что это | Где живёт |
|---|---|---|
| Интерфейс | Страница на React, Vue, Svelte или чистом HTML, которую Telegram открывает внутри чата | Любой хостинг сайтов с HTTPS: собранная папка с файлами или веб-приложение |
| Сервер | Принимает запросы интерфейса, проверяет initData, хранит заказы, очки, настройки | Постоянно работающее веб-приложение: FastAPI, Flask, Express, Go и т.п. |
| Бот | Отвечает в чате, присылает кнопку запуска, отправляет уведомления | Отдельная работающая программа или часть того же сервера, если бот на вебхуке |
| Адрес с HTTPS | Ссылка, которую вы указываете в BotFather | Выдаётся хостингом; без HTTPS Telegram ссылку не примет |
| Данные | Пользователи, покупки, прогресс в игре | База: SQLite в постоянной папке или PostgreSQL отдельным сервисом |
| Ключи | Токен бота, ключи платёжки и внешних сервисов | Только на сервере, в переменных окружения, а не в коде интерфейса |
Соберите интерфейс и проверьте его в обычном браузере#
Mini App — это сайт, поэтому сначала убедитесь, что он открывается как сайт. Соберите проект на React или Vue обычной командой сборки и подключите на странице скрипт telegram-web-app.js — через него приложение получает данные пользователя, тему оформления и кнопки Telegram. Откройте собранную версию в браузере: белый экран здесь почти всегда означает неверные пути к файлам или ошибку в коде, и внутри Telegram он никуда не денется.
Решите, сколько частей у вашего приложения#
Если Mini App только показывает информацию, хватит одного интерфейса. Если есть заказы, очки, оплата или личные данные, нужен сервер. Удобный вариант — сервер сам отдаёт собранный интерфейс и отвечает на запросы по тому же адресу: так не возникает ошибок CORS. Интерфейс, сервер и бота можно описать в docker-compose и опубликовать одним проектом, а можно разнести по отдельным проектам.
Проверяйте initData на сервере#
Когда пользователь открывает Mini App, Telegram передаёт в неё строку initData с данными о нём и подписью. Интерфейс должен отправлять эту строку на сервер, а сервер — проверять подпись по алгоритму из документации Telegram: ключ получается из токена бота, сравнение идёт через HMAC-SHA-256, а поле auth_date показывает, насколько данные свежие. Готовые проверки есть во многих библиотеках для ботов. Поле initDataUnsafe годится только для показа имени в интерфейсе: подделать его может кто угодно.
Уберите токен бота из кода интерфейса#
Код, который выполняется в браузере, может открыть и прочитать любой пользователь, поэтому токен бота и ключи платёжки должны жить только на сервере. Читайте их из переменных окружения, а значения указывайте в настройках хостинга. В Netrun для этого есть вкладка «Секреты»: значения хранятся зашифрованными и попадают в переменные окружения проекта.
Опубликуйте проект и получите адрес с HTTPS#
Сервер должен слушать адрес 0.0.0.0 и порт из переменной окружения PORT, иначе снаружи его не будет видно. Собранный интерфейс без сервера публикуется как статический сайт. В Netrun вы загружаете код архивом, папкой или из GitHub, язык и способ запуска определяются сами, а на выходе получаете ссылку с HTTPS, которую можно сразу отдавать Telegram.
Подключите адрес в BotFather#
Есть два основных пути. Команда /newapp создаёт Mini App с собственной ссылкой вида t.me/имя_бота/имя_приложения — её удобно публиковать в каналах и рекламе. Команда /setmenubutton ставит кнопку слева от поля ввода в чате с ботом, по которой открывается ваш адрес. Кроме того, бот может присылать кнопку открытия прямо в сообщении — это делается в коде.
Для Mini App нужен не особый хостинг, а обычный, но с HTTPS и с местом для сервера и бота. В Netrun интерфейс, сервер и бот публикуются из кода без настройки сервера, ссылка с HTTPS выдаётся сразу, а токены лежат в секретах. Честно о бесплатном тарифе: сайт на нём засыпает без посетителей и просыпается при открытии, поэтому первый запуск после паузы занимает несколько секунд, а бот работает ограниченное время. Если Mini App открывают люди каждый день и бот должен отвечать круглосуточно, берите Pro. Попробовать Netrun.
Частые вопросы
Можно ли разместить Telegram Mini App на GitHub Pages?
Интерфейс — можно: GitHub Pages отдаёт статические страницы по HTTPS, и Telegram такую ссылку откроет. Но сервер и бот там работать не смогут, потому что GitHub Pages не запускает программы. Если приложению нужно хранить данные, проверять пользователя или принимать оплату, сервер всё равно придётся держать где-то ещё.
Почему Mini App открывается белым экраном?
Чаще всего виноваты пути к файлам: после сборки страница ищет скрипты не там, где они лежат. Вторая частая причина — ошибка в коде, которая роняет приложение при запуске, или запрос к серверу по адресу с http вместо https. Откройте ту же ссылку в обычном браузере и посмотрите ошибки в консоли разработчика.
Нужен ли для Mini App свой домен?
Нет. Telegram требует адрес с HTTPS, а не собственный домен, поэтому подойдёт ссылка, которую выдаёт хостинг. Свой домен нужен, если хочется красивого адреса или он уже используется для сайта. В Netrun свои домены подключаются на тарифе Pro.
Можно ли держать интерфейс, сервер и бота в одном проекте?
Да. Самый простой вариант — сервер, который отдаёт собранный интерфейс и отвечает на запросы приложения, а бот работает на вебхуке внутри того же сервера. Если частей больше, их можно описать в docker-compose: память и процессор тарифа тогда делятся между сервисами.
Почему нельзя доверять initDataUnsafe?
Потому что это просто данные в браузере, и человек с минимальными навыками может подставить туда любое имя и любой идентификатор. Доверять можно только строке initData, подпись которой проверил ваш сервер с помощью токена бота. Всё, что связано с деньгами, бонусами и доступом, решайте только по проверенным данным.
Можно ли разместить Telegram-бота?
Да. Загрузите код бота и укажите токен от BotFather (его выдаёт сам Telegram при создании бота) — Netrun запустит бота, VPS и ручная настройка не нужны. На бесплатном тарифе бот работает 3 часа, чтобы вы всё проверили; чтобы он работал круглосуточно, подключите тариф Pro.
Можно ли запустить несколько сервисов сразу?
Да. Через docker-compose в одном проекте поднимается связка сервисов — например, приложение вместе с базой данных, кэшем и фоновым обработчиком. Числом сервисов мы не ограничиваем: считайте, что потолок задают память и процессор вашего тарифа, они делятся между сервисами проекта.
Как выложить сайт в интернет?
Загрузите код сайта ZIP-архивом или из GitHub — Netrun соберёт его и выдаст рабочую ссылку с HTTPS. Подойдёт статический сайт (HTML, CSS, JS), приложение на React или сайт на Python. Покупать домен, настраивать сервер и сертификаты не нужно.