我为我的机器人创建了一个web应用程序,还集成了电报"web应用脚本“。
https://telegram.org/js/telegram-web-app.js
我的网络应用程序的代码如下所示。
我从window.Telegram.WebApp收到的唯一数据是:
使用应答标记键盘:
{
"initData": "",
"initDataUnsafe": {
},
"version": "1.0",
"colorScheme": "dark",
"themeParams": {
"bg_color": "#17212b",
"button_color": "#5288c1",
"button_text_color": "#ffffff",
"hint_color": "#708499",
"link_color": "#6ab3f3",
"text_color": "#f5f5f5"
},
"isExpanded": true,
"viewportHeight": 621,
"viewportStableHeight": 621,
"MainButton": {
"text": "CONTINUE",
"color": "#5288c1",
"textColor": "#ffffff",
"isVisible": false,
"isProgressVisible": false,
"isActive": true
}
}使用内联按钮:
{
"initData": "query_id=AAFdL6MsAAAAA122voywCSO1y&user=%7B%22id%22%3A748891997%2C%22first_name%22%3A%22%F0%9D%97%A6%F0%9D%97%94%F0%9D%97%A0%F0%9D%97%9C%22%2C%22last_name%22%3A%22%22%2C%22username%22%3A%22samyar%22%2C%22language_code%22%3A%22en%22%7D&auth_date=1651749255&hash=34f3a0de3e0dc7b8d5735d0a85b265763c5c490917180fef40e4df61c819949e",
"initDataUnsafe": {
"query_id": "AAFdL6MsAAAAAFbvoywCSO1y",
"user": {
"id": 748291957,
"first_name": "",
"last_name": "",
"username": "samyar",
"language_code": "en"
},
"auth_date": "1651749255",
"hash": "34f3a0de3e0dc7b8d5735d0a85b265265cdc490917280fef40e4df61c819949e"
},
"version": "1.0",
"colorScheme": "dark",
"themeParams": {
"bg_color": "#17212b",
"button_color": "#5288c1",
"button_text_color": "#ffffff",
"hint_color": "#708499",
"link_color": "#6ab3f3",
"text_color": "#f5f5f5"
},
"isExpanded": true,
"viewportHeight": 621,
"viewportStableHeight": 621,
"MainButton": {
"text": "CONTINUE",
"color": "#5288c1",
"textColor": "#ffffff",
"isVisible": false,
"isProgressVisible": false,
"isActive": true
}
}我需要访问许多其他选项,但我没有,我只需要用户的个人资料。
WebApp:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<script src="https://telegram.org/js/telegram-web-app.js"></script>
<title>Web app</title>
</head>
<body>
<div class="user-info">
<!-- Data -->
<img id="profile" />
<h1 id="name"></h1>
<h3 id="username"></h3>
<!-- -->
<p id="test">
This page is a simple webapp integrated with telegram bot
</p>
</div>
<script>
const profileEl = document.getElementById("profile");
const nameEl = document.getElementById("name");
const usernameEl = document.getElementById("username");
const test = document.getElementById("test");
window.Telegram.WebApp.ready();
test.innerText = `${JSON.stringify(window.Telegram.WebApp)}`;
const { first_name, last_name, username, photo_url } =
window.Telegram.WebAppUser;
// set the profile
profileEl.src = photo_url;
nameEl.innerText = `${first_name} ${last_name}`;
usernameEl.innerText = username;
</script>
</body>
</html>机器人代码:基本上,它只是发送一个replyMarkupKeyboard
@app.on_message(filters.private)
async def hello(client, message):
# await message.reply("Just a web app integrated withen telegram! ",
# reply_markup=InlineKeyboardMarkup(
# [
# [
# InlineKeyboardButton(
# "Open Web app ",web_app=WebAppInfo(url="https://telegramwebapp.netlify.app"))
# ]
# ]
# ))
await message.reply("Just a web app integrated withen telegram! ",
reply_markup=ReplyKeyboardMarkup(
[
[
KeyboardButton(
"Open Web app ",
web_app=WebAppInfo(url="https://telegramwebapp.netlify.app"))
]
]
))发布于 2022-06-02 08:44:34
const { first_name, last_name, username } = window.Telegram.WebApp.initDataUnsafe.user;
对我来说很好。
发布于 2022-05-08 09:18:10
我也偶然发现了这个问题。就我的情况而言,按菜单按钮实现web应用是一个很好的决定。
https://core.telegram.org/bots/webapps#launching-web-apps-from-the-menu-button
通过这种方法,我获得了完整的用户信息。
https://stackoverflow.com/questions/72126188
复制相似问题