Кейс: Мини-приложение для регистрации на мероприятие по номеру телефона
В этой статье мы разберём и создадим кейс: мини-приложение для регистрации на мероприятие с подтверждением номера телефона через новый инструмент Telegram – The Gateway и добавлением в лист ожидания.
Автор: @RDGlessons
Опробовать функционал мини-приложения можно по ссылке: https://t.me/InfoAzizBot/gateway. Поскольку это демо-версия, вы можете указать любой номер телефона, а код для регистрации будет отображён до его ввода. Демо-версия не отправляет коды и не выполняет рассылок.
Разработка:
Разработка происходит непосредственно в рамках сервиса PuzzleBot.
Получить бесплатный бонус +7 дней к Креативному тарифу можно по ссылке https://puzzlebot.top/?r=Fmo8Tuss
Создаём переменные:
- phone - текстовая переменная
- code - числовая переменная
- entered_code - числовая переменная
- random_code - формула:
- text1 - формула: (Можно заменить тексты в кавычках)
- text2 - формула: (Можно заменить тексты в кавычках)
Переходим в Конструктор:
1. Создаём блок "Мини-Приложение". Задаём произвольное название, у меня оно будет "Ввод номера"
Добавляем туда блоки "Форма ввода" и "Клавиатура" (блок клавиатуры будет добавлен автоматически):
Форма ввода:
Добавляем заголовок с текстом "Введите номер телефона"
Выбираем тип "Ввод текста" и масску ввода "Телефон". По желанию можем добавить Плейсхолдер с примером номера телефона.
Открываем дополнительные настройки и включаем "Дублировать ответ в переменную", указываем переменную phone
Пример данного блока будет на фото ниже
Клавиатура:
Блок "Клавиатура" будет добавлен автоматически.
Выбираем тип клавиатуры "Фиксированная"
Добавляем кнопку "Получить код" с действием "Переход к мини-приложению". В поле указываем название нового Мини-приложения - "Ввод кода"
Открываем Действия данного мини приложения:
Действия:
Создаём действия "Изменить переменную" и "Отправить запрос"
Изменить переменную:
В первое поле (Переменную которую изменяем) вводим переменную code.
Во второе поле (Выражение) вводим переменную {{random_code}}
Отправить запрос:
Адрес (ссылка): https://gatewayapi.telegram.org/sendVerificationMessage
Тип: GET
Добавляем параметры:
- phone_number - со значением {{phone}}
- code - со значением {{code}}
Задаём заголовки:
- Authorization - со значением Bearer TOKEN, где TOKEN нужно заменить на действительный токен полученный в https://gateway.telegram.org/account/api. Подробнее в документации https://vc.ru/1547346
2. Создаём мини-приложение "Ввод кода"
Добавляем блоки "Форма ввода" и "Клавиатура"
Форма ввода:
Добавляем заголовок "Введите код"
Выбираем тип ввода "Ввод текста"
Выбираем маску ввода "Регулярное выражение"
В поле "Регулярное выражение" вводим выражение:
В дополнительных настройках включаем галочку "Дублировать в переменную" и указать перменную entered_code.
3. Создаём блок Условия, которое будет записывать пользователя в лист ожидания изменив категорию.
Добавляем в правило условие с проверкой значения переменной.
В первое поле вводим entered_code. В поле с выражением {{code}}
В действия можем указать отправку команды (текста с уведомлением) и изменение категории пользователя.
Необходимо поставить вызов данного условия в действиях мини-приложения "Ввод кода"
4. Создаём Мини-Приложение с названием "Проверка кода"
Добавляем блок Заголовка с переменной {{text1}}
Добавляем блок Описания с переменной {{text2}}
По желанию можно добавить клавиатуру
Последний шаг: Публикуем изменения и тестируем)
Получить ссылку на мини-приложение можно открыв блок команду "Ввод номера". В поле "Прямая ссылка" будет указана ссылка на ваше мини-приложение.