by moonboy
Telegram Mini App Example
from flask import Flask, render_template, url_for, redirect
import os
import logging
import threading
from telegram import Update, WebAppInfo
import telegram
from telegram.ext import Updater, CommandHandler, MessageHandler, CallbackContext, Filters
from web_app_routes import app
from utils import get_bot_username
TELEGRAM_API_TOKEN = os.getenv('TELEGRAM_API_TOKEN')
logger = logging.getLogger(__name__)
logging.basicConfig(level=logging.INFO, format='%(asctime)s - %(name)s - %(levelname)s - %(message)s')
#DO NOT CHANGE THIS
webapp_url = f"{app.config['BASE_URL']}"
def start(update: Update, context: CallbackContext) -> None:
update.message.reply_text(
"Hi! I'm a Telegram Web App. Click the link below to open my simple web app!",
reply_markup=telegram.InlineKeyboardMarkup([[
telegram.InlineKeyboardButton("Open Web App", web_app=WebAppInfo(url=webapp_url))
]])
Frequently Asked Questions
What is the Basic Telegram Mini App template, and how can businesses benefit from it?
The Basic Telegram Mini App template is a starter kit for creating custom mini applications within the Telegram messaging platform. Businesses can benefit from this template by quickly developing and deploying interactive experiences for their Telegram users. For example, a restaurant could create a mini app for menu browsing and ordering, or a retail store could build a product catalog and shopping cart system, all accessible directly within Telegram.
How can the Basic Telegram Mini App template improve customer engagement?
The Basic Telegram Mini App template allows businesses to create seamless, in-app experiences for their customers. By integrating mini apps into their Telegram presence, companies can offer enhanced functionality without requiring users to leave the platform. This can lead to increased engagement, as customers can interact with the business's services or products more conveniently, potentially boosting conversion rates and customer satisfaction.
What types of businesses or industries would find the Basic Telegram Mini App template most useful?
The Basic Telegram Mini App template is versatile and can be adapted for various industries. It's particularly useful for: - E-commerce businesses looking to create in-app storefronts - Service providers offering appointment booking or customer support - Media companies wanting to distribute content or collect user-generated content - Financial services for providing account information or simple transactions - Educational institutions for delivering course materials or quizzes
How can I customize the appearance of the Basic Telegram Mini App template?
The Basic Telegram Mini App template can be easily customized by modifying the HTML, CSS, and JavaScript files. For example, to change the app name and add a custom message to the index page, you would edit the header.html
and index.html
files:
In header.html
, change the app name:
html
<span style="color: #ffffff;">Your Custom App Name</span>
In index.html
, add your custom message:
```html
Welcome to Your Custom App!
This is a personalized message for your users.
```
How does the Basic Telegram Mini App template handle user authentication?
The Basic Telegram Mini App template includes built-in user authentication using Telegram's Web App API. This is handled in the header.js
file, which checks if the app is running within the Telegram environment and sends the user's data to the server for verification. Here's a snippet of the relevant code:
javascript
if (window.Telegram && window.Telegram.WebApp) {
Telegram.WebApp.ready();
var initData = Telegram.WebApp.initData;
if (initData) {
fetch('/telegram_identity', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({ tgWebAppData: initData })
})
// ... handle the response
}
}
This authentication process ensures that only valid Telegram users can access the mini app, providing a secure foundation for building user-specific features.
Created: | Last Updated:
Here's a step-by-step guide for using the Basic Telegram Mini App template:
Introduction
The Basic Telegram Mini App template provides a simple starting point for creating a Telegram mini app. This template includes a basic structure for a Telegram bot and a web application that can be accessed through Telegram.
Getting Started
To begin using this template:
- Click "Start with this Template" in the Lazy Builder interface.
Initial Setup
Before running the app, you need to set up a Telegram bot and obtain an API token:
- Open Telegram and search for the BotFather (@BotFather).
- Start a chat with BotFather and send the command
/newbot
. - Follow the prompts to create a new bot. Choose a name and username for your bot.
- Once created, BotFather will provide you with an API token. Copy this token.
- In the Lazy Builder, go to the "Env Secrets" tab.
- Find the
TELEGRAM_API_TOKEN
secret and paste your API token as its value.
Test the App
After setting up the API token:
- Click the "Test" button in the Lazy Builder interface to deploy and run your app.
- Wait for the deployment to complete. The Lazy CLI will provide you with information about the app's status.
Using the App
Once the app is running:
- The CLI will display a message with your bot's username and a link to start chatting with it.
- Click the link or search for your bot's username in Telegram to start a conversation.
- Send the
/start
command to your bot. It will respond with a message and a button to open the web app. - Click the "Open Web App" button to access the Telegram Mini App interface.
Customizing the App
To customize the app for your specific needs:
- Modify the
index.html
file to add your desired functionality to the main page of the web app. - Update the app name in the
header.html
file to reflect your app's name. - Add any additional routes or functionality in the
web_app_routes.py
file. - Customize the bot's responses and commands in the
main.py
file.
Remember to test your changes by clicking the "Test" button after making modifications.
Integrating the App
This Telegram Mini App is self-contained within the Telegram environment. Users can interact with it directly through your Telegram bot. There's no need for additional external integration steps.
By following these steps, you'll have a basic Telegram Mini App up and running, which you can then customize to suit your specific requirements.
Template Benefits
-
Rapid Development: This template provides a ready-to-use structure for creating Telegram mini apps, significantly reducing development time and allowing businesses to quickly launch new features or services within the Telegram ecosystem.
-
Enhanced User Engagement: By leveraging Telegram's native interface and features, businesses can create interactive and user-friendly mini apps that keep users engaged within the Telegram platform, potentially increasing user retention and interaction rates.
-
Seamless Integration: The template offers built-in integration with Telegram's API, making it easy for businesses to access user data (with permission) and provide personalized experiences, leading to improved customer satisfaction and loyalty.
-
Cross-Platform Compatibility: Telegram mini apps work across various devices and operating systems, allowing businesses to reach a wider audience without the need for separate development for different platforms, thus reducing costs and maintenance efforts.
-
Scalable Marketing Channel: By creating mini apps within Telegram, businesses can tap into Telegram's vast user base and utilize it as a powerful marketing and distribution channel for their products or services, potentially increasing their reach and customer acquisition rates.