{"id":470176,"date":"2025-08-10T15:00:11","date_gmt":"2025-08-10T15:00:11","guid":{"rendered":"http:\/\/savepearlharbor.com\/?p=470176"},"modified":"-0001-11-30T00:00:00","modified_gmt":"-0001-11-29T21:00:00","slug":"","status":"publish","type":"post","link":"https:\/\/savepearlharbor.com\/?p=470176","title":{"rendered":"<span>Telegram Web App. \u0412\u0441\u0451 \u043e Mini Apps<\/span>"},"content":{"rendered":"<div><!--[--><!--]--><\/div>\n<div id=\"post-content-body\">\n<div>\n<div class=\"article-formatted-body article-formatted-body article-formatted-body_version-2\">\n<div xmlns=\"http:\/\/www.w3.org\/1999\/xhtml\">\n<h2>\u0427\u0442\u043e \u0442\u0430\u043a\u043e\u0435 Mini App (Web App) \u0432 TG<\/h2>\n<p><a href=\"https:\/\/core.telegram.org\/bots\/webapps\" rel=\"noopener noreferrer nofollow\"><strong>Mini App<\/strong><\/a> (\u043e\u043d \u0436\u0435 <strong>Web App<\/strong>) \u2014 \u044d\u0442\u043e \u0432\u0435\u0431-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 (\u043f\u0440\u043e\u0449\u0435 \u0433\u043e\u0432\u043e\u0440\u044f \u0441\u0430\u0439\u0442), \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u043e\u0435 \u0432 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441 Telegram. \u041e\u043d\u043e \u043e\u0442\u043a\u0440\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u043f\u0440\u044f\u043c\u043e \u0432\u043d\u0443\u0442\u0440\u0438 \u0447\u0430\u0442\u0430: \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u043d\u0430\u0436\u0438\u043c\u0430\u0435\u0442 \u043a\u043d\u043e\u043f\u043a\u0443 \u00ab\u041e\u0442\u043a\u0440\u044b\u0442\u044c\u00bb \u0438 \u0432\u0438\u0434\u0438\u0442 \u043f\u043e\u043b\u043d\u043e\u0446\u0435\u043d\u043d\u0443\u044e \u0432\u0435\u0431-\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443 \u0441 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c\u044e \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f, \u0441\u0442\u0438\u043b\u0438\u0437\u0430\u0446\u0438\u0435\u0439 \u043f\u043e\u0434 \u0442\u0435\u043c\u0443 Telegram \u0438 \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0435\u0439 \u0434\u0430\u043d\u043d\u044b\u0445 \u043e\u0431\u0440\u0430\u0442\u043d\u043e \u0432 \u0431\u043e\u0442\u0430.<\/p>\n<p>\u042d\u0442\u043e \u0434\u0430\u0451\u0442 \u043d\u0430\u043c \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u043e \u043f\u0440\u0435\u0438\u043c\u0443\u0449\u0435\u0441\u0442\u0432, \u0442\u0430\u043a\u0438\u0445 \u043a\u0430\u043a:<\/p>\n<ul>\n<li>\n<p>\u0440\u0430\u0431\u043e\u0442\u0430 \u0441 \u0430\u0432\u0442\u043e\u0440\u0438\u0437\u043e\u0432\u0430\u043d\u043d\u044b\u043c\u0438 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f\u043c\u0438 (<code>tg.initDataUnsafe.user<\/code>);<\/p>\n<\/li>\n<li>\n<p>\u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u043e\u0435 \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0438\u0435 Telegram (\u0442\u0451\u043c\u043d\u0430\u044f\/\u0441\u0432\u0435\u0442\u043b\u0430\u044f \u0442\u0435\u043c\u0430);<\/p>\n<\/li>\n<li>\n<p>\u0434\u043e\u0441\u0442\u0443\u043f \u043a \u0434\u0430\u043d\u043d\u044b\u043c \u044e\u0437\u0435\u0440\u0430 (first_name, id \u0438 \u0434\u0440.) \u0431\u0435\u0437 \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0445 \u0430\u043d\u043a\u0435\u0442;<\/p>\n<\/li>\n<li>\n<p>\u043a\u043d\u043e\u043f\u043a\u0438 \u0438 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u0441 \u0431\u043e\u0442\u043e\u043c \u0431\u0435\u0437 \u043b\u0438\u0448\u043d\u0438\u0445 \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0439.<\/p>\n<\/li>\n<\/ul>\n<p>\u0412 <a href=\"https:\/\/habr.com\/ru\/companies\/amvera\/articles\/838180\/\" rel=\"noopener noreferrer nofollow\">\u043f\u0440\u043e\u0448\u043b\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435<\/a> \u044f \u0443\u0436\u0435 \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0435\u043b \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0438 Web App, \u0430 \u0441\u0435\u0433\u043e\u0434\u043d\u044f \u0436\u0435 \u043f\u043e\u0434\u0432\u0435\u0434\u0451\u043c \u0438\u0442\u043e\u0433\u0438, \u0440\u0430\u0441\u0441\u043a\u0430\u0436\u0435\u043c \u0432\u0441\u0435 \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u0438 \u0438 \u043d\u044e\u0430\u043d\u0441\u044b \u0440\u0430\u0431\u043e\u0442\u044b \u0441 Web App \u0432 TG \u0438 \u0441\u043e\u0431\u0435\u0440\u0451\u043c \u043f\u0440\u043e\u0441\u0442\u0435\u043d\u044c\u043a\u043e\u0435 \u0432\u0435\u0431-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435.<\/p>\n<h3>\u041e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u0438 \u0438 \u043d\u044e\u0430\u043d\u0441\u044b \u0440\u0430\u0431\u043e\u0442\u044b \u0441 Web App<\/h3>\n<h4>\u041f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u0438 \u0437\u0430\u043f\u0443\u0441\u043a<\/h4>\n<p>\u0417\u0434\u0435\u0441\u044c \u0432\u0430\u0436\u043d\u043e \u0437\u043d\u0430\u0442\u044c \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0432\u0435\u0449\u0435\u0439:<\/p>\n<ol>\n<li>\n<p><code>tg.initDataUnsafe<\/code> \u2014 \u043c\u0435\u0442\u043e\u0434 \u0434\u043b\u044f \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u0438\u044f \u0432\u0441\u0435\u0445 \u0434\u0430\u043d\u043d\u044b\u0445 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f. \u0420\u0430\u0431\u043e\u0442\u0430\u0435\u0442 <strong>\u0442\u043e\u043b\u044c\u043a\u043e<\/strong> \u0442\u043e\u0433\u0434\u0430, \u043a\u043e\u0433\u0434\u0430 Mini App \u043e\u0442\u043a\u0440\u044b\u0442 \u0438\u0437 Telegram, \u0430 \u043d\u0430\u043f\u0440\u044f\u043c\u0443\u044e \u0438\u0437 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430. \u0422\u0435\u043c \u0441\u0430\u043c\u044b\u043c \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0442\u044c, \u043d\u0435 \u043e\u0442\u043a\u0440\u044b\u043b \u043b\u0438 \u0435\u0433\u043e \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u0441 \u0432\u043d\u0435\u0448\u043d\u0435\u0433\u043e \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430, \u0447\u0442\u043e\u0431\u044b \u043d\u0435 \u0441\u043b\u043e\u0432\u0438\u0442\u044c \u043a\u0443\u0447\u0443 \u0431\u0430\u0433\u043e\u0432;<\/p>\n<\/li>\n<li>\n<p><code>tg.sendData()<\/code> \u2014 \u043c\u0435\u0442\u043e\u0434 \u0434\u043b\u044f \u043e\u0442\u043f\u0440\u0430\u0432\u043a\u0438 \u0434\u0430\u043d\u043d\u044b\u0445 \u043e\u0431\u0440\u0430\u0442\u043d\u043e \u0432 \u0431\u043e\u0442\u0430. \u0420\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u0442\u043e\u043b\u044c\u043a\u043e, \u0435\u0441\u043b\u0438 MiniApp \u043e\u0442\u043a\u0440\u044b\u0442 \u0447\u0435\u0440\u0435\u0437 reply-\u043a\u043d\u043e\u043f\u043a\u0443 \u0441 <code>web_app<\/code>. \u0422\u043e \u0435\u0441\u0442\u044c \u043f\u0440\u0438 \u043e\u0442\u043a\u0440\u044b\u0442\u0438\u0438 \u0447\u0435\u0440\u0435\u0437 inline-\u043a\u043d\u043e\u043f\u043a\u0443 <code>sendData()<\/code> \u043d\u0435 \u0441\u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442.<\/p>\n<\/li>\n<\/ol>\n<h4>\u0421\u0442\u0438\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u0442\u0435\u043c\u044b \u043f\u043e\u0434 Telegram<\/h4>\n<p>Telegram API \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435 \u0434\u043b\u044f \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u0438\u044f \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0439 \u0442\u0435\u043c\u044b (\u0442\u043e\u0439 \u0442\u0435\u043c\u044b, \u043a\u043e\u0442\u043e\u0440\u0443\u044e \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u0432\u044b\u0441\u0442\u0430\u0432\u0438\u043b \u0432 \u0441\u0432\u043e\u0451\u043c \u043a\u043b\u0438\u0435\u043d\u0442\u0435 \u0442\u0435\u043b\u0435\u0433\u0440\u0430\u043c), \u0447\u0442\u043e \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043d\u0430\u043c \u0441\u0442\u0438\u043b\u0438\u0437\u043e\u0432\u0430\u0442\u044c \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443 \u043f\u043e\u0434 \u0442\u0435\u043c\u0443 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f.<\/p>\n<p>\u0421\u0430\u043c\u0438 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435:<\/p>\n<ul>\n<li>\n<p><code>--tg-theme-bg-color<\/code> \u2014 \u0431\u0443\u043a\u0432\u0430\u043b\u044c\u043d\u043e \u0446\u0432\u0435\u0442 \u0444\u043e\u043d\u0430;<\/p>\n<\/li>\n<li>\n<p><code>--tg-theme-text-color<\/code> \u2014 \u0446\u0432\u0435\u0442 \u0448\u0440\u0438\u0444\u0442\u0430 \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0435\u043d\u043d\u043e;<\/p>\n<\/li>\n<li>\n<p><code>--tg-color-scheme<\/code> \u2014 \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u0438\u0435 \u0442\u0435\u043c\u044b \u043a\u043b\u0438\u0435\u043d\u0442\u0430 (<code>light<\/code> \u0438\u043b\u0438 <code>dark<\/code>);<\/p>\n<\/li>\n<li>\n<p><code>--tg-theme-hint-color<\/code> \u2014 \u0432\u0442\u043e\u0440\u0438\u0447\u043d\u044b\u0439 \u0442\u0435\u043a\u0441\u0442 \/ \u043f\u043e\u0434\u0441\u043a\u0430\u0437\u043a\u0438;<\/p>\n<\/li>\n<li>\n<p><code>--tg-theme-link-color<\/code> \u2014 \u0446\u0432\u0435\u0442 \u0441\u0441\u044b\u043b\u043e\u043a;<\/p>\n<\/li>\n<li>\n<p><code>--tg-theme-button-color<\/code> \u2014 \u0446\u0432\u0435\u0442 \u043a\u043d\u043e\u043f\u043a\u0438;<\/p>\n<\/li>\n<li>\n<p><code>--tg-theme-button-text-color<\/code> \u2014 \u0442\u0435\u043a\u0441\u0442 \u043d\u0430 \u043a\u043d\u043e\u043f\u043a\u0435;<\/p>\n<\/li>\n<li>\n<p><code>--tg-theme-secondary-bg-color<\/code> \u2014 \u0432\u0442\u043e\u0440\u0438\u0447\u043d\u044b\u0439 \u0446\u0432\u0435\u0442 \u0444\u043e\u043d\u0430;<\/p>\n<\/li>\n<li>\n<p><code>--tg-theme-header-bg-color<\/code> \u2014 \u0444\u043e\u043d \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u0430 (\u0445\u0435\u0430\u0434\u0435\u0440\u0430);<\/p>\n<\/li>\n<li>\n<p>\u0438 \u0442. \u0434. \u0412\u0441\u0435 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435 \u043e\u043f\u0438\u0441\u0430\u043d\u044b <a href=\"https:\/\/core.telegram.org\/bots\/webapps#themeparams\" rel=\"noopener noreferrer nofollow\">\u0437\u0434\u0435\u0441\u044c<\/a>.<\/p>\n<\/li>\n<\/ul>\n<h4>\u0411\u0435\u0437\u043e\u043f\u0430\u0441\u043d\u043e\u0441\u0442\u044c \u0438 \u0438\u0434\u0435\u043d\u0442\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u044f<\/h4>\n<ul>\n<li>\n<p><code>initData<\/code> \u2014 \u0437\u0430\u0448\u0438\u0444\u0440\u043e\u0432\u0430\u043d\u043d\u0430\u044f \u0441\u0442\u0440\u043e\u043a\u0430, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0432\u0435\u0440\u0438\u0444\u0438\u0446\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u0441\u0435\u0440\u0432\u0435\u0440\u043e\u043c (\u0443\u0433\u043b\u0443\u0431\u0438\u043c\u0441\u044f \u0447\u0443\u0442\u044c \u043f\u043e\u0437\u0436\u0435);<\/p>\n<\/li>\n<li>\n<p><code>initDataUnsafe<\/code> \u2014 \u0443\u0436\u0435 \u0440\u0430\u0441\u043f\u0430\u0440\u0441\u0435\u043d\u043d\u044b\u0439 \u043e\u0431\u044a\u0435\u043a\u0442. \u041d\u0435 \u0440\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u0443\u0435\u0442\u0441\u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043d\u0430 \u043f\u0440\u043e\u0434\u0435.<\/p>\n<\/li>\n<\/ul>\n<h4>\u041d\u044e\u0430\u043d\u0441\u044b \u0434\u0435\u043f\u043b\u043e\u044f<\/h4>\n<ul>\n<li>\n<p>Web App \u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u043e \u0434\u043e\u043b\u0436\u0435\u043d \u0431\u044b\u0442\u044c \u0434\u043e\u0441\u0442\u0443\u043f\u0435\u043d \u043f\u043e <code>https.<\/code>\u041e\u0431\u044b\u0447\u043d\u044b\u0439 <code>http<\/code> \u043d\u0435 \u043f\u043e\u0434\u043e\u0439\u0434\u0451\u0442. \u041e\u0434\u043d\u0430\u043a\u043e \u0432 \u043d\u0430\u0448\u0435\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u044d\u0442\u043e \u043d\u0435 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430. Amvera \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0441\u043e\u0432\u0435\u0440\u0448\u0435\u043d\u043d\u043e <strong>\u0431\u0435\u0441\u043f\u043b\u0430\u0442\u043d\u044b\u0439 \u0434\u043e\u043c\u0435\u043d \u0438 SSL-\u0441\u0435\u0440\u0442\u0438\u0444\u0438\u043a\u0430\u0442<\/strong>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0432\u044b \u0441\u043c\u043e\u0436\u0435\u0442\u0435 \u0430\u043a\u0442\u0438\u0432\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0434\u043b\u044f \u0441\u0432\u043e\u0435\u0433\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0430 \u043f\u0440\u044f\u043c \u0432 \u041b\u041a \u0437\u0430 \u043f\u0430\u0440\u0443 \u043c\u0438\u043d\u0443\u0442.<\/p>\n<\/li>\n<li>\n<p>Telegram \u043e\u0442\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u0442 \u0434\u0430\u043d\u043d\u044b\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u043f\u043e\u0441\u043b\u0435 \u043a\u043b\u0438\u043a\u0430 \u043f\u043e <strong>web_app-\u043a\u043d\u043e\u043f\u043a\u0435<\/strong>, \u043f\u0440\u0438 \u043e\u0442\u043a\u0440\u044b\u0442\u0438\u0438 \u0441\u0441\u044b\u043b\u043a\u0438 \u0434\u0430\u043d\u043d\u044b\u0435 \u043d\u0435 \u043e\u0442\u043f\u0440\u0430\u0432\u044f\u0442\u0441\u044f.<\/p>\n<\/li>\n<\/ul>\n<h4>\u041f\u0440\u0438\u043c\u0435\u0440 initDataUnsafe \u0438 initData<\/h4>\n<p>\u041a\u043e\u0433\u0434\u0430 Mini App \u043e\u0442\u043a\u0440\u044b\u0442 \u043a\u043e\u0440\u0440\u0435\u043a\u0442\u043d\u043e, Telegram \u043f\u0435\u0440\u0435\u0434\u0430\u0451\u0442 \u0434\u0432\u0430 \u0432\u0438\u0434\u0430 \u0434\u0430\u043d\u043d\u044b\u0445:<\/p>\n<h3>initDataUnsafe \u2014 \u0443\u0436\u0435 \u0440\u0430\u0441\u043f\u0430\u0440\u0441\u0435\u043d\u043d\u044b\u0439 \u043e\u0431\u044a\u0435\u043a\u0442:<\/h3>\n<pre><code class=\"json\">{   \"user\": {     \"id\": ,     \"first_name\": \"\",     \"last_name\": \"\",     \"username\": \"\",     \"language_code\": \"\",     \"is_premium\": true,     \"allows_write_to_pm\": true,     \"photo_url\": \"\"   },   \"chat_instance\": \"\",   \"chat_type\": \"sender\",   \"auth_date\": \"\",   \"signature\": \"\",   \"hash\": \"\" } <\/code><\/pre>\n<p>\u042d\u0442\u043e\u0442 \u043e\u0431\u044a\u0435\u043a\u0442 \u0434\u043e\u0441\u0442\u0443\u043f\u0435\u043d \u0432 <code>tg.initDataUnsafe<\/code> \u0438 \u0443\u0434\u043e\u0431\u0435\u043d \u0434\u043b\u044f \u0432\u044b\u0432\u043e\u0434\u0430 \u0438\u043c\u0435\u043d\u0438, \u0430\u0432\u0430\u0442\u0430\u0440\u043a\u0438 \u0438 \u0434\u0440., \u043d\u043e <strong>\u043d\u0435\u0431\u0435\u0437\u043e\u043f\u0430\u0441\u0435\u043d<\/strong>. \u0417\u043b\u043e\u0443\u043c\u044b\u0448\u043b\u0435\u043d\u043d\u0438\u043a \u043c\u043e\u0436\u0435\u0442 \u043f\u043e\u0434\u0434\u0435\u043b\u0430\u0442\u044c \u0435\u0433\u043e \u043f\u0440\u0438 \u043e\u0442\u043a\u0440\u044b\u0442\u0438\u0438 \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435.<\/p>\n<h3>initData \u2014 \u0441\u0442\u0440\u043e\u043a\u0430, \u043a\u043e\u0442\u043e\u0440\u0443\u044e \u043d\u0443\u0436\u043d\u043e \u043f\u0440\u043e\u0432\u0435\u0440\u0438\u0442\u044c \u043d\u0430 \u0441\u0435\u0440\u0432\u0435\u0440\u0435:<\/h3>\n<pre><code class=\"perl\">user=%7B%22id%22%3A&amp;lt;...&amp;gt;%2C%22first_name%22%3A%22&amp;lt;...&amp;gt;%22%7D&amp;amp;chat_instance=&amp;amp;chat_type=sender&amp;amp;auth_date=&amp;amp;signature=&amp;amp;hash=<\/code><\/pre>\n<p>\u042d\u0442\u043e URL-\u043a\u043e\u0434\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u0430\u044f \u0441\u0442\u0440\u043e\u043a\u0430, \u043a\u043e\u0442\u043e\u0440\u0443\u044e Telegram \u043f\u0435\u0440\u0435\u0434\u0430\u0451\u0442 \u0432 <code>tg.initData<\/code>. \u0415\u0435 \u043d\u0443\u0436\u043d\u043e <strong>\u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u043e \u0432\u0435\u0440\u0438\u0444\u0438\u0446\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043d\u0430 \u0441\u0435\u0440\u0432\u0435\u0440\u0435<\/strong>, \u0447\u0442\u043e\u0431\u044b \u0443\u0431\u0435\u0434\u0438\u0442\u044c\u0441\u044f, \u0447\u0442\u043e \u0434\u0430\u043d\u043d\u044b\u0435 \u043f\u043e\u0434\u043b\u0438\u043d\u043d\u044b\u0435, \u0438 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u043e\u0442\u043a\u0440\u044b\u043b Web App \u0447\u0435\u0440\u0435\u0437 Telegram.<\/p>\n<h4>\u041e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u0434\u0430\u043d\u043d\u044b\u0445 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f<\/h4>\n<p>\u041a\u043e\u0433\u0434\u0430 \u043c\u044b \u0443\u0441\u043f\u0435\u0448\u043d\u043e \u043f\u0440\u043e\u0432\u0435\u0440\u0438\u043b\u0438 <code>initData<\/code> \u043d\u0430 \u0441\u0435\u0440\u0432\u0435\u0440\u0435 (\u0442\u043e \u0435\u0441\u0442\u044c \u0443\u0431\u0435\u0434\u0438\u043b\u0438\u0441\u044c, \u0447\u0442\u043e \u0432\u0441\u0451 \u043f\u0440\u0438\u0448\u043b\u043e \u0438\u043c\u0435\u043d\u043d\u043e \u043e\u0442 Telegram, \u0430 \u043d\u0435 \u043f\u043e\u0434\u0434\u0435\u043b\u0430\u043d\u043e), \u043c\u043e\u0436\u0435\u043c \u0441\u043f\u043e\u043a\u043e\u0439\u043d\u043e \u0434\u043e\u0441\u0442\u0430\u0432\u0430\u0442\u044c \u043d\u0443\u0436\u043d\u044b\u0435 \u0434\u0430\u043d\u043d\u044b\u0435 \u043e \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0435.<\/p>\n<p>\u0412\u043d\u0443\u0442\u0440\u0438 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u0430 <code>user<\/code> \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442\u0441\u044f \u043f\u043e\u043b\u0435\u0437\u043d\u0430\u044f \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f:<\/p>\n<ul>\n<li>\n<p><code>id<\/code> \u2014 \u0443\u043d\u0438\u043a\u0430\u043b\u044c\u043d\u044b\u0439 Telegram \u0430\u0439\u0434\u0438 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f (\u043d\u0443\u0436\u0435\u043d, \u0447\u0442\u043e\u0431\u044b \u0438\u0434\u0435\u043d\u0442\u0438\u0444\u0438\u0446\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0435\u0433\u043e \u0432 \u0431\u0430\u0437\u0435 \u0438\u043b\u0438 \u043f\u0438\u0441\u0430\u0442\u044c \u0432 \u043b\u0438\u0447\u043a\u0443);<\/p>\n<\/li>\n<li>\n<p><code>first_name<\/code> \u2014 \u0435\u0433\u043e \u0438\u043c\u044f (\u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043b\u044e\u0431\u043e\u0435, \u0445\u043e\u0442\u044c \u0441\u043c\u0430\u0439\u043b\u0438\u043a);<\/p>\n<\/li>\n<li>\n<p><code>last_name<\/code> \u2014 \u0444\u0430\u043c\u0438\u043b\u0438\u044f, \u043d\u043e \u0447\u0430\u0441\u0442\u043e \u0431\u044b\u0432\u0430\u0435\u0442 \u043f\u0440\u043e\u0441\u0442\u043e \u043f\u0443\u0441\u0442\u043e\u0439;<\/p>\n<\/li>\n<li>\n<p><code>username<\/code> \u2014 \u043d\u0438\u043a, \u0435\u0441\u043b\u0438 \u043e\u043d \u0435\u0441\u0442\u044c (\u0442\u043e \u0441\u0430\u043c\u043e\u0435 <code>@\u0438\u043c\u044f<\/code>);<\/p>\n<\/li>\n<li>\n<p><code>language_code<\/code> \u2014 \u044f\u0437\u044b\u043a \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 <code>ru<\/code>, <code>en<\/code> \u0438 \u0442.\u043f.<\/p>\n<\/li>\n<li>\n<p><code>is_premium<\/code> \u2014 \u0444\u043b\u0430\u0433, \u0435\u0441\u0442\u044c \u043b\u0438 \u0443 \u0447\u0435\u043b\u043e\u0432\u0435\u043a\u0430 Telegram Premium;<\/p>\n<\/li>\n<li>\n<p><code>allows_write_to_pm<\/code> \u2014 \u043c\u043e\u0436\u043d\u043e \u043b\u0438 \u0431\u043e\u0442\u0443 \u043d\u0430\u043f\u0438\u0441\u0430\u0442\u044c \u044d\u0442\u043e\u043c\u0443 \u0447\u0435\u043b\u043e\u0432\u0435\u043a\u0443 \u043d\u0430\u043f\u0440\u044f\u043c\u0443\u044e;<\/p>\n<\/li>\n<li>\n<p><code>photo_url<\/code> \u2014 \u0441\u0441\u044b\u043b\u043a\u0430 \u043d\u0430 \u0430\u0432\u0430\u0442\u0430\u0440\u043a\u0443 \u0432 Telegram, \u043c\u043e\u0436\u043d\u043e \u0432\u0441\u0442\u0430\u0432\u0438\u0442\u044c \u043a\u0430\u043a \u043e\u0431\u044b\u0447\u043d\u0443\u044e \u043a\u0430\u0440\u0442\u0438\u043d\u043a\u0443.<\/p>\n<\/li>\n<\/ul>\n<p>\u041f\u043e\u043b\u0443\u0447\u0438\u0442\u044c, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, <code>first_name<\/code> \u043c\u043e\u0436\u043d\u043e \u0442\u0430\u043a:<\/p>\n<ul>\n<li>\n<p><code>const firstName = tg.initDataUnsafe.user.first_name;<\/code><\/p>\n<\/li>\n<\/ul>\n<p>\u0422\u0435\u043f\u0435\u0440\u044c, \u043a\u043e\u0433\u0434\u0430 \u043c\u044b \u0440\u0430\u0437\u043e\u0431\u0440\u0430\u043b\u0438\u0441\u044c \u0441 \u043f\u043e\u0434\u0432\u043e\u0434\u043d\u044b\u043c\u0438 \u043a\u0430\u043c\u043d\u044f\u043c\u0438, \u0434\u0430\u0432\u0430\u0439 \u0441\u043e\u0431\u0435\u0440\u0451\u043c \u043f\u0440\u043e\u0441\u0442\u043e\u0439 Mini App \u0441 \u043a\u043d\u043e\u043f\u043a\u043e\u0439 \u0438 \u0444\u043e\u0440\u043c\u043e\u0439 \u0438 \u0441\u0432\u044f\u0436\u0435\u043c \u0435\u0433\u043e \u0441 \u0431\u043e\u0442\u043e\u043c.<\/p>\n<h3>\u041f\u0440\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0430\u044f \u0447\u0430\u0441\u0442\u044c:  \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0430 Web App<\/h3>\n<p>\u041a\u0430\u043a \u0432\u0441\u0435\u0433\u0434\u0430, \u043d\u0430\u0447\u043d\u0451\u043c \u0441 \u043c\u0430\u043b\u043e\u0433\u043e: \u043f\u0440\u043e\u0432\u0435\u0440\u0438\u043c, \u0437\u0430\u043f\u0443\u0449\u0435\u043d \u043b\u0438 Web App \u0438\u0437 Telegram, \u0438 \u0435\u0441\u043b\u0438 \u043d\u0435\u0442, \u043e\u0442\u043f\u0440\u0430\u0432\u0438\u043c \u043f\u0440\u0435\u0434\u0443\u043f\u0440\u0435\u0436\u0434\u0435\u043d\u0438\u0435.<\/p>\n<p>\u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u043d\u0430\u043f\u0438\u0448\u0435\u043c \u043f\u0440\u043e\u0441\u0442\u0435\u043d\u044c\u043a\u0438\u0439 <code>index.html<\/code>:<\/p>\n<pre><code>   &lt;title&gt;Mini App&lt;\/title&gt;   &lt;style&gt;     :root {       --bg-color: var(--tg-theme-bg-color, #ffffff);       --text-color: var(--tg-theme-text-color, #000000);       --accent-color: var(--tg-theme-button-color, #0088cc);     }      * {       margin: 0;       padding: 0;       box-sizing: border-box;     }      body {       background: var(--bg-color);       color: var(--text-color);       font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;       text-align: center;     }      .warn {       background: var(--bg-color);       color: var(--text-color);       padding: 40px 20px;       display: none;       height: 100vh;       width: 100vw;       flex-direction: column;       align-items: center;       justify-content: center;     }      .warn img {       width: 120px;       height: 120px;       margin-bottom: 20px;       animation: float 2s ease-in-out infinite;     }      @keyframes float {       0% { transform: translateY(0px); }       50% { transform: translateY(-10px); }       100% { transform: translateY(0px); }     }      .warn p {       font-size: 18px;       margin: 8px 0;     }      .main {       display: none;       padding: 20px;     }      .btn {       padding: 12px 24px;       font-size: 16px;       border: none;       border-radius: 5px;       background: var(--accent-color);       color: var(--tg-theme-button-text-color, #ffffff);       cursor: pointer;       margin-top: 20px;     }   &lt;\/style&gt;     &lt;div id=\"notInTelegram\" class=\"warn\"&gt;     &lt;img alt=\"TLogo\" src=\"https:\/\/telegram.org\/img\/t_logo.png\"&gt;     &lt;p&gt;&lt;strong&gt;\u0423\u043f\u0441!&lt;\/strong&gt;&lt;\/p&gt;     &lt;p&gt;\u042d\u0442\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0434\u043e\u043b\u0436\u043d\u043e \u0431\u044b\u0442\u044c \u0437\u0430\u043f\u0443\u0449\u0435\u043d\u043e &lt;strong&gt;\u0432\u043d\u0443\u0442\u0440\u0438 Telegram!&lt;\/strong&gt;&lt;\/p&gt;   &lt;\/div&gt;    &lt;div id=\"mainApp\" class=\"main\"&gt;     &lt;h1&gt;\u041f\u0440\u0438\u0432\u0435\u0442 \u0438\u0437 Mini App &lt;\/h1&gt;     &lt;p&gt;MiniApp \u0443\u0441\u043f\u0435\u0448\u043d\u043e \u043e\u0442\u043a\u0440\u044b\u0442 \u0432 Telegram!&lt;\/p&gt;     &lt;button id=\"actionBtn\" class=\"btn\"&gt;\u041f\u0440\u043e\u0434\u043e\u043b\u0436\u0438\u0442\u044c&lt;\/button&gt;   &lt;\/div&gt; <\/code><\/pre>\n<p>\u0422\u0430\u043a\u043e\u0439 \u0448\u0430\u0431\u043b\u043e\u043d \u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0432 \u043a\u0430\u0436\u0434\u043e\u043c Mini App, \u0447\u0442\u043e\u0431\u044b \u0438\u0441\u043a\u043b\u044e\u0447\u0438\u0442\u044c \u043e\u0448\u0438\u0431\u043a\u0438 \u043f\u0440\u0438 \u043e\u0442\u043a\u0440\u044b\u0442\u0438\u0438 \u0447\u0435\u0440\u0435\u0437 \u0431\u0440\u0430\u0443\u0437\u0435\u0440. Telegram \u043d\u0435 \u043f\u0435\u0440\u0435\u0434\u0430\u0451\u0442 \u0434\u0430\u043d\u043d\u044b\u0435, \u0435\u0441\u043b\u0438 Web App \u043d\u0435 \u0431\u044b\u043b \u043e\u0442\u043a\u0440\u044b\u0442 \u043f\u043e \u043a\u043d\u043e\u043f\u043a\u0435.  \u041c\u044b \u0441\u0440\u0430\u0437\u0443 \u043f\u043e\u043a\u0430\u0436\u0435\u043c \u043e\u0431 \u044d\u0442\u043e\u043c \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0435.<\/p>\n<h3>\u0427\u0442\u043e \u0437\u0434\u0435\u0441\u044c \u0432\u0430\u0436\u043d\u043e:<\/h3>\n<ul>\n<li>\n<p><code>!tg || !tg.initDataUnsafe?.user<\/code> \u2014 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430, \u0447\u0442\u043e Mini App \u043e\u0442\u043a\u0440\u044b\u0442 \u043d\u0435 \u0432 Telegram (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043f\u0440\u043e\u0441\u0442\u043e \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435);<\/p>\n<\/li>\n<li>\n<p><code>tg.expand()<\/code> \u2014 \u0440\u0430\u0437\u0432\u043e\u0440\u0430\u0447\u0438\u0432\u0430\u0435\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043d\u0430 \u0432\u0435\u0441\u044c \u044d\u043a\u0440\u0430\u043d;<\/p>\n<\/li>\n<li>\n<p>\u0421\u0442\u0438\u043b\u0438 \u0438 \u0446\u0432\u0435\u0442\u0430 \u0431\u0435\u0440\u0443\u0442\u0441\u044f \u043d\u0430\u043f\u0440\u044f\u043c\u0443\u044e \u0438\u0437 Telegram-\u043a\u043b\u0438\u0435\u043d\u0442\u0430, \u0431\u0435\u0437 \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0439 \u0442\u0435\u043c\u044b.<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/a27\/f8b\/34b\/a27f8b34be4337f13844de8d5999869c.png\" alt=\"\u041e\u0442\u043a\u0440\u044b\u0442\u0438\u0435 Telegram Web App \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435\" title=\"\u041e\u0442\u043a\u0440\u044b\u0442\u0438\u0435 Telegram Web App \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435\" width=\"800\" height=\"946\" sizes=\"auto, (max-width: 780px) 100vw, 50vw\" srcset=\"https:\/\/habrastorage.org\/r\/w780\/getpro\/habr\/upload_files\/a27\/f8b\/34b\/a27f8b34be4337f13844de8d5999869c.png 780w,&#10;       https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/a27\/f8b\/34b\/a27f8b34be4337f13844de8d5999869c.png 781w\" loading=\"lazy\" decode=\"async\"\/><\/p>\n<div><figcaption>\u041e\u0442\u043a\u0440\u044b\u0442\u0438\u0435 Telegram Web App \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435<\/figcaption><\/div>\n<\/figure>\n<h4>\u041e\u0442\u043f\u0440\u0430\u0432\u043a\u0430 \u0434\u0430\u043d\u043d\u044b\u0445 \u0438\u0437 Mini App: sendData() \u0438 \u043a\u0430\u043a \u043e\u043d (\u043d\u0435) \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442<\/h4>\n<p>\u041c\u0438\u043d\u0438-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u043c\u043e\u0433\u0443\u0442 \u043e\u0442\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435 \u043e\u0431\u0440\u0430\u0442\u043d\u043e \u0432 \u0431\u043e\u0442\u0430. \u0414\u0435\u043b\u0430\u0435\u0442\u0441\u044f \u044d\u0442\u043e \u0447\u0435\u0440\u0435\u0437 \u043c\u0435\u0442\u043e\u0434:<\/p>\n<pre><code>tg.sendData(\"\u043b\u044e\u0431\u0430\u044f \u0441\u0442\u0440\u043e\u043a\u0430\");<\/code><\/pre>\n<p>\u041e\u0431\u044b\u0447\u043d\u043e \u044d\u0442\u043e \u0441\u0442\u0440\u043e\u043a\u0430 \u0432 \u0444\u043e\u0440\u043c\u0430\u0442\u0435 JSON. \u0411\u043e\u0442 \u043f\u043e\u043b\u0443\u0447\u0430\u0435\u0442 \u0435\u0451 \u0432 \u0441\u043e\u0431\u044b\u0442\u0438\u0438 WEB_APP_DATA.<\/p>\n<p><strong>\u041d\u043e! \u0415\u0441\u0442\u044c \u0432\u0430\u0436\u043d\u043e\u0435 \u043e\u0433\u0440\u0430\u043d\u0438\u0447\u0435\u043d\u0438\u0435:<\/strong><\/p>\n<p><code>tg.sendData()<\/code> \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 <strong>\u0422\u041e\u041b\u042c\u041a\u041e<\/strong>, \u0435\u0441\u043b\u0438 Mini App \u043e\u0442\u043a\u0440\u044b\u0442 <strong>\u043f\u043e \u043a\u043d\u043e\u043f\u043a\u0435 \u0441 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u043e\u043c <\/strong><code><strong>web_app<\/strong><\/code>, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440:<\/p>\n<pre><code class=\"python\">KeyboardButton(text=\"\u041e\u0442\u043a\u0440\u044b\u0442\u044c\", web_app=WebAppInfo(url=\"https:\/\/...\"))<\/code><\/pre>\n<p><strong>\u0415\u0441\u043b\u0438 \u043e\u0442\u043a\u0440\u044b\u0442\u044c Web App \u043f\u043e inline-\u043a\u043d\u043e\u043f\u043a\u0435<\/strong>, <code>sendData()<\/code> \u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u043d\u0435 \u0431\u0443\u0434\u0435\u0442 <\/p>\n<h4>\u041f\u0440\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0430\u044f \u0447\u0430\u0441\u0442\u044c:  \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0430 Web App<\/h4>\n<p>\u041a\u0430\u043a \u0432\u0441\u0435\u0433\u0434\u0430 \u043d\u0430\u0447\u043d\u0451\u043c \u0441 \u043c\u0430\u043b\u043e\u0433\u043e: \u043f\u0440\u043e\u0432\u0435\u0440\u0438\u043c, \u0437\u0430\u043f\u0443\u0449\u0435\u043d \u043b\u0438 Web App \u0438\u0437 Telegram, \u0438 \u0435\u0441\u043b\u0438 \u043d\u0435\u0442 &#8212; \u043e\u0442\u043f\u0440\u0430\u0432\u0438\u043c \u043f\u0440\u0435\u0434\u0443\u043f\u0440\u0435\u0436\u0434\u0435\u043d\u0438\u0435.<\/p>\n<p>\u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u043d\u0430\u043f\u0438\u0448\u0435\u043c \u043f\u0440\u043e\u0441\u0442\u0435\u043d\u044c\u043a\u0438\u0439 <code>index.html<\/code>:<\/p>\n<pre><code>   &lt;title&gt;Mini App&lt;\/title&gt;   &lt;style&gt;     :root {       --bg-color: var(--tg-theme-bg-color, #ffffff);       --text-color: var(--tg-theme-text-color, #000000);       --accent-color: var(--tg-theme-button-color, #0088cc);     }      * {       margin: 0;       padding: 0;       box-sizing: border-box;     }      body {       background: var(--bg-color);       color: var(--text-color);       font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;       text-align: center;     }      .warn {       background: var(--bg-color);       color: var(--text-color);       padding: 40px 20px;       display: none;       height: 100vh;       width: 100vw;       flex-direction: column;       align-items: center;       justify-content: center;     }      .warn img {       width: 120px;       height: 120px;       margin-bottom: 20px;       animation: float 2s ease-in-out infinite;     }      @keyframes float {       0% { transform: translateY(0px); }       50% { transform: translateY(-10px); }       100% { transform: translateY(0px); }     }      .warn p {       font-size: 18px;       margin: 8px 0;     }      .main {       display: none;       padding: 20px;     }      .btn {       padding: 12px 24px;       font-size: 16px;       border: none;       border-radius: 5px;       background: var(--accent-color);       color: var(--tg-theme-button-text-color, #ffffff);       cursor: pointer;       margin-top: 20px;     }   &lt;\/style&gt;     &lt;div id=\"notInTelegram\" class=\"warn\"&gt;     &lt;img alt=\"TLogo\" src=\"https:\/\/telegram.org\/img\/t_logo.png\"&gt;     &lt;p&gt;&lt;strong&gt;\u0423\u043f\u0441!&lt;\/strong&gt;&lt;\/p&gt;     &lt;p&gt;\u042d\u0442\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0434\u043e\u043b\u0436\u043d\u043e \u0431\u044b\u0442\u044c \u0437\u0430\u043f\u0443\u0449\u0435\u043d\u043e &lt;strong&gt;\u0432\u043d\u0443\u0442\u0440\u0438 Telegram!&lt;\/strong&gt;&lt;\/p&gt;   &lt;\/div&gt;    &lt;div id=\"mainApp\" class=\"main\"&gt;     &lt;h1&gt;\u041f\u0440\u0438\u0432\u0435\u0442 \u0438\u0437 Mini App \ud83d\udc4b&lt;\/h1&gt;     &lt;p&gt;MiniApp \u0443\u0441\u043f\u0435\u0448\u043d\u043e \u043e\u0442\u043a\u0440\u044b\u0442 \u0432 Telegram!&lt;\/p&gt;     &lt;button id=\"actionBtn\" class=\"btn\"&gt;\u041f\u0440\u043e\u0434\u043e\u043b\u0436\u0438\u0442\u044c&lt;\/button&gt;   &lt;\/div&gt; <\/code><\/pre>\n<p>\u0422\u0430\u043a\u043e\u0439 \u0448\u0430\u0431\u043b\u043e\u043d \u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0432 \u043a\u0430\u0436\u0434\u043e\u043c Mini App, \u0447\u0442\u043e\u0431\u044b \u0438\u0441\u043a\u043b\u044e\u0447\u0438\u0442\u044c \u043e\u0448\u0438\u0431\u043a\u0438 \u043f\u0440\u0438 \u043e\u0442\u043a\u0440\u044b\u0442\u0438\u0438 \u0447\u0435\u0440\u0435\u0437 \u0431\u0440\u0430\u0443\u0437\u0435\u0440. Telegram \u043d\u0435 \u043f\u0435\u0440\u0435\u0434\u0430\u0451\u0442 \u0434\u0430\u043d\u043d\u044b\u0435, \u0435\u0441\u043b\u0438 Web App \u043d\u0435 \u0431\u044b\u043b \u043e\u0442\u043a\u0440\u044b\u0442 \u043f\u043e \u043a\u043d\u043e\u043f\u043a\u0435.  \u041c\u044b \u0441\u0440\u0430\u0437\u0443 \u043f\u043e\u043a\u0430\u0436\u0435\u043c \u043e\u0431 \u044d\u0442\u043e\u043c \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0435.<\/p>\n<h4>\u0427\u0442\u043e \u0442\u0443\u0442 \u0432\u0430\u0436\u043d\u043e:<\/h4>\n<ul>\n<li>\n<p><code>!tg || !tg.initDataUnsafe?.user<\/code> \u2014 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430, \u0447\u0442\u043e Mini App <strong>\u043e\u0442\u043a\u0440\u044b\u0442 \u043d\u0435 \u0432 Telegram<\/strong> (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043f\u0440\u043e\u0441\u0442\u043e \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435).<\/p>\n<\/li>\n<li>\n<p><code>tg.expand()<\/code> \u2014 \u0440\u0430\u0437\u0432\u043e\u0440\u0430\u0447\u0438\u0432\u0430\u0435\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043d\u0430 \u0432\u0435\u0441\u044c \u044d\u043a\u0440\u0430\u043d.<\/p>\n<\/li>\n<li>\n<p>\u0421\u0442\u0438\u043b\u0438 \u0438 \u0446\u0432\u0435\u0442\u0430 \u0431\u0435\u0440\u0443\u0442\u0441\u044f <strong>\u043d\u0430\u043f\u0440\u044f\u043c\u0443\u044e \u0438\u0437 Telegram-\u043a\u043b\u0438\u0435\u043d\u0442\u0430<\/strong>, \u0431\u0435\u0437 \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0439 \u0442\u0435\u043c\u044b.<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/a27\/f8b\/34b\/a27f8b34be4337f13844de8d5999869c.png\" alt=\"\u041e\u0442\u043a\u0440\u044b\u0442\u0438\u0435 Telegram Web App \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435\" title=\"\u041e\u0442\u043a\u0440\u044b\u0442\u0438\u0435 Telegram Web App \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435\" width=\"800\" height=\"946\" sizes=\"auto, (max-width: 780px) 100vw, 50vw\" srcset=\"https:\/\/habrastorage.org\/r\/w780\/getpro\/habr\/upload_files\/a27\/f8b\/34b\/a27f8b34be4337f13844de8d5999869c.png 780w,&#10;       https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/a27\/f8b\/34b\/a27f8b34be4337f13844de8d5999869c.png 781w\" loading=\"lazy\" decode=\"async\"\/><\/p>\n<div><figcaption>\u041e\u0442\u043a\u0440\u044b\u0442\u0438\u0435 Telegram Web App \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435<\/figcaption><\/div>\n<\/figure>\n<h3>\u041e\u0442\u043f\u0440\u0430\u0432\u043a\u0430 \u0434\u0430\u043d\u043d\u044b\u0445 \u0438\u0437 Mini App: sendData() \u0438 \u043a\u0430\u043a \u043e\u043d (\u043d\u0435) \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442<\/h3>\n<p>\u041c\u0438\u043d\u0438-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u043c\u043e\u0433\u0443\u0442 \u043e\u0442\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435 \u043e\u0431\u0440\u0430\u0442\u043d\u043e \u0432 \u0431\u043e\u0442\u0430. \u0414\u0435\u043b\u0430\u0435\u0442\u0441\u044f \u044d\u0442\u043e \u0447\u0435\u0440\u0435\u0437 \u043c\u0435\u0442\u043e\u0434:<\/p>\n<pre><code>tg.sendData(\"\u043b\u044e\u0431\u0430\u044f \u0441\u0442\u0440\u043e\u043a\u0430\");<\/code><\/pre>\n<p>\u041e\u0431\u044b\u0447\u043d\u043e \u044d\u0442\u043e \u0441\u0442\u0440\u043e\u043a\u0430 \u0432 \u0444\u043e\u0440\u043c\u0430\u0442\u0435 JSON. \u0411\u043e\u0442 \u043f\u043e\u043b\u0443\u0447\u0430\u0435\u0442 \u0435\u0451 \u0432 \u0441\u043e\u0431\u044b\u0442\u0438\u0438 WEB_APP_DATA.<\/p>\n<p><strong>\u041d\u043e! \u0415\u0441\u0442\u044c \u0432\u0430\u0436\u043d\u043e\u0435 \u043e\u0433\u0440\u0430\u043d\u0438\u0447\u0435\u043d\u0438\u0435:<\/strong><\/p>\n<p><code>tg.sendData()<\/code> \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 <strong>\u0422\u041e\u041b\u042c\u041a\u041e<\/strong>, \u0435\u0441\u043b\u0438 Mini App \u043e\u0442\u043a\u0440\u044b\u0442 <strong>\u043f\u043e \u043a\u043d\u043e\u043f\u043a\u0435 \u0441 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u043e\u043c <\/strong><code><strong>web_app<\/strong><\/code>, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440:<\/p>\n<pre><code class=\"python\">KeyboardButton(text=\"\u041e\u0442\u043a\u0440\u044b\u0442\u044c\", web_app=WebAppInfo(url=\"https:\/\/...\"))<\/code><\/pre>\n<p><strong>\u0415\u0441\u043b\u0438 \u043e\u0442\u043a\u0440\u044b\u0442\u044c Web App \u043f\u043e inline-\u043a\u043d\u043e\u043f\u043a\u0435<\/strong>, <code>sendData()<\/code> \u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u043d\u0435 \u0431\u0443\u0434\u0435\u0442 \u2014 Telegram \u043f\u0440\u043e\u0441\u0442\u043e \u043f\u0440\u043e\u0438\u0433\u043d\u043e\u0440\u0438\u0440\u0443\u0435\u0442 \u0432\u044b\u0437\u043e\u0432. \u042d\u0442\u043e \u043e\u0434\u043d\u0430 \u0438\u0437 \u0433\u043b\u0430\u0432\u043d\u044b\u0445 &#171;\u043b\u043e\u0432\u0443\u0448\u0435\u043a&#187; Mini App.<\/p>\n<h4>\u0421\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u043f\u0440\u043e\u0441\u0442\u0443\u044e \u0444\u043e\u0440\u043c\u0443 \u0432 HTML, \u0433\u0434\u0435 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u043c\u043e\u0436\u0435\u0442 \u0432\u0432\u0435\u0441\u0442\u0438 \u0441\u043b\u0443\u0447\u0430\u0439\u043d\u044b\u0435 \u0434\u0430\u043d\u043d\u044b\u0435<\/h4>\n<p>\u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: \u0438\u043c\u044f \u0438 \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0435. \u0422\u0430\u043a\u0430\u044f \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u0443\u0436\u0435 \u043f\u0440\u0430\u043a\u0442\u0438\u0447\u043d\u0430 \u0434\u043b\u044f \u043e\u0442\u043f\u0440\u0430\u0432\u043a\u0438 \u043e\u0442\u0437\u044b\u0432\u043e\u0432 \u043f\u0440\u044f\u043c \u0430\u0434\u043c\u0438\u043d\u0438\u0441\u0442\u0440\u0430\u0442\u043e\u0440\u0443 \u0447\u0435\u0440\u0435\u0437 \u043f\u0440\u0438\u044f\u0442\u043d\u044b\u0439 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441 MiniApp. \u0415\u0434\u0438\u043d\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0435, \u0447\u0442\u043e \u043f\u043e\u043d\u0430\u0434\u043e\u0431\u0438\u0442\u0441\u044f \u2014 \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435 \u0441\u0430\u043c\u0438\u043c \u0431\u043e\u0442\u043e\u043c.<\/p>\n<pre><code>  &lt;div id=\"mainApp\" class=\"main\"&gt;     &lt;h1&gt;\u041f\u0440\u0438\u0432\u0435\u0442 \u0438\u0437 Mini App &lt;\/h1&gt;     &lt;p&gt;MiniApp \u0443\u0441\u043f\u0435\u0448\u043d\u043e \u043e\u0442\u043a\u0440\u044b\u0442 \u0432 Telegram!&lt;\/p&gt;     &lt;button id=\"actionBtn\" class=\"btn\"&gt;\u041e\u0442\u043a\u0440\u044b\u0442\u044c \u0444\u043e\u0440\u043c\u0443&lt;\/button&gt;      &lt;form id=\"dataForm\"&gt;       &lt;input required=\"\" id=\"nameInput\" placeholder=\"\u0412\u0430\u0448\u0435 \u0438\u043c\u044f\" type=\"text\"&gt;       &lt;textarea required=\"\" id=\"msgInput\" placeholder=\"\u0412\u0430\u0448\u0435 \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0435\"&gt;&lt;\/textarea&gt;       &lt;button class=\"btn\" type=\"submit\"&gt;\u041e\u0442\u043f\u0440\u0430\u0432\u0438\u0442\u044c&lt;\/button&gt;     &lt;\/form&gt;   &lt;\/div&gt; <\/code><\/pre>\n<pre><code class=\"css\">    .btn {       padding: 12px 24px;       font-size: 16px;       border: none;       border-radius: 8px;       background: var(--accent-color);       color: var(--button-text-color);       cursor: pointer;       transition: background 0.2s ease;     }      .btn:hover {       opacity: 0.9;     }      form {       margin-top: 20px;       width: 100%;       display: none;       flex-direction: column;       align-items: center;       gap: 12px;     }      input, textarea {       width: 100%;       padding: 12px;       font-size: 15px;       border: 1px solid var(--border-color);       border-radius: 6px;       background: var(--input-bg);       color: var(--text-color);       resize: vertical;     }      textarea {       min-height: 100px;     } <\/code><\/pre>\n<p>\u0438 \u0441\u043a\u0440\u0438\u043f\u0442:<\/p>\n<pre><code>    const form = document.getElementById(\"dataForm\");     const actionBtn = document.getElementById(\"actionBtn\");      actionBtn.addEventListener(\"click\", () =&amp;gt; {       form.style.display = \"flex\";       actionBtn.style.display = \"none\";     });      form.addEventListener(\"submit\", (e) =&amp;gt; {       e.preventDefault();        const name = document.getElementById(\"nameInput\").value.trim();       const msg = document.getElementById(\"msgInput\").value.trim();        if (!name || !msg) return;        const payload = {         name,         message: msg       };        tg.sendData(JSON.stringify(payload));     });  <\/code><\/pre>\n<hr\/>\n<p>\u0411\u043e\u0442 \u0434\u043e\u043b\u0436\u0435\u043d \u0441\u043b\u0443\u0448\u0430\u0442\u044c \u0441\u043e\u0431\u044b\u0442\u0438\u044f WEB_APP_DATA, \u0438 \u0435\u0441\u043b\u0438 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u043e\u0442\u043f\u0440\u0430\u0432\u0438\u043b \u0434\u0430\u043d\u043d\u044b\u0435 \u2014 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u0438\u0445.<\/p>\n<p>\u0412\u043e\u0442 \u043f\u0440\u0438\u043c\u0435\u0440 \u043d\u0430 aiogram 3:<\/p>\n<pre><code class=\"python\">@dp.message(F.content_type == ContentType.WEB_APP_DATA) async def handle_webapp_data(message: types.Message):     try:         data = json.loads(message.web_app_data.data)         name = data.get(\"name\", \"\u041d\u0435\u0438\u0437\u0432\u0435\u0441\u0442\u043d\u044b\u0439 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\")         msg = data.get(\"message\", \"(\u043f\u0443\u0441\u0442\u043e)\")          await message.answer(             f\"&lt;b&gt;{name}&lt;\/b&gt; \u043e\u0442\u043f\u0440\u0430\u0432\u0438\u043b(\u0430) \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0435:\\n\\n{msg}\",             parse_mode=ParseMode.HTML         )      except Exception as e:         await message.answer(\"\u041f\u0440\u043e\u0438\u0437\u043e\u0448\u043b\u0430 \u043e\u0448\u0438\u0431\u043a\u0430 \u043f\u0440\u0438 \u0440\u0430\u0437\u0431\u043e\u0440\u0435 \u0434\u0430\u043d\u043d\u044b\u0445 \u0438\u0437 Mini App\") <\/code><\/pre>\n<h3>\u0427\u0442\u043e \u0432\u0430\u0436\u043d\u043e \u0443\u0447\u0438\u0442\u044b\u0432\u0430\u0442\u044c:<\/h3>\n<ul>\n<li>\n<p><code>sendData()<\/code> = \u0441\u0432\u044f\u0437\u044c Mini App \u0438 \u0431\u043e\u0442\u0430;<\/p>\n<\/li>\n<li>\n<p>\u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u0442\u043e\u043b\u044c\u043a\u043e \u0441 reply-\u043a\u043d\u043e\u043f\u043a\u043e\u0439;<\/p>\n<\/li>\n<li>\n<p>inline-\u043a\u043d\u043e\u043f\u043a\u0438 <strong>\u041d\u0415 \u043e\u0442\u043f\u0440\u0430\u0432\u043b\u044f\u044e\u0442<\/strong> <code>sendData()<\/code>. \u041d\u0443\u0436\u043d\u043e \u043e\u0442\u043a\u0440\u044b\u0432\u0430\u0442\u044c \u0438\u043c\u0435\u043d\u043d\u043e \u0447\u0435\u0440\u0435\u0437 reply;<\/p>\n<\/li>\n<li>\n<p>\u0434\u0430\u043d\u043d\u044b\u0435 \u043c\u043e\u0436\u043d\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c \u0442\u043e\u043b\u044c\u043a\u043e \u043a\u0430\u043a <code>\u0441\u0442\u0440\u043e\u043a\u0443<\/code> (\u043e\u0431\u044b\u0447\u043d\u043e JSON).<\/p>\n<\/li>\n<\/ul>\n<h4>\u0418\u0442\u043e\u0433 \u043f\u043e \u043e\u0442\u043f\u0440\u0430\u0432\u043a\u0435 \u0434\u0430\u043d\u043d\u044b\u0445<\/h4>\n<p>\u0421\u0435\u0439\u0447\u0430\u0441 \u0443 \u043d\u0430\u0441 \u0433\u043e\u0442\u043e\u0432\u043e \u043c\u0430\u043a\u0441\u0438\u043c\u0430\u043b\u044c\u043d\u043e \u043f\u0440\u043e\u0441\u0442\u043e\u0435 \u043c\u0438\u043d\u0438 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0443\u043c\u0435\u0435\u0442:<\/p>\n<ul>\n<li>\n<p>\u041f\u0440\u043e\u0432\u0435\u0440\u044f\u0442\u044c, \u043e\u0442\u043a\u0440\u044b\u0442\u043e \u043b\u0438 \u0432\u0435\u0431-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0447\u0435\u0440\u0435\u0437 Telegram<\/p>\n<\/li>\n<li>\n<p>\u041e\u0442\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435 \u0447\u0435\u0440\u0435\u0437 <code>tg.sendData()<\/code><\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/7b2\/617\/96e\/7b261796e33a158a35f288467dbc05bd.png\" alt=\"\u0414\u0435\u043c\u043e\u043d\u0441\u0442\u0440\u0430\u0446\u0438\u044f \u0440\u0430\u0431\u043e\u0442\u044b Telegram Web App\" title=\"\u0414\u0435\u043c\u043e\u043d\u0441\u0442\u0440\u0430\u0446\u0438\u044f \u0440\u0430\u0431\u043e\u0442\u044b Telegram Web App\" width=\"1439\" height=\"943\" sizes=\"auto, (max-width: 780px) 100vw, 50vw\" srcset=\"https:\/\/habrastorage.org\/r\/w780\/getpro\/habr\/upload_files\/7b2\/617\/96e\/7b261796e33a158a35f288467dbc05bd.png 780w,&#10;       https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/7b2\/617\/96e\/7b261796e33a158a35f288467dbc05bd.png 781w\" loading=\"lazy\" decode=\"async\"\/><\/p>\n<div><figcaption>\u0414\u0435\u043c\u043e\u043d\u0441\u0442\u0440\u0430\u0446\u0438\u044f \u0440\u0430\u0431\u043e\u0442\u044b Telegram Web App<\/figcaption><\/div>\n<\/figure>\n<figure class=\"full-width\"><img decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/dae\/a83\/f47\/daea83f47649d7605be390e88e65539d.png\" alt=\"\u041e\u0442\u043f\u0440\u0430\u0432\u043a\u0430 \u0434\u0430\u043d\u043d\u044b\u0445 \" title=\"\u041e\u0442\u043f\u0440\u0430\u0432\u043a\u0430 \u0434\u0430\u043d\u043d\u044b\u0445 \" width=\"904\" height=\"196\" sizes=\"auto, (max-width: 780px) 100vw, 50vw\" srcset=\"https:\/\/habrastorage.org\/r\/w780\/getpro\/habr\/upload_files\/dae\/a83\/f47\/daea83f47649d7605be390e88e65539d.png 780w,&#10;       https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/dae\/a83\/f47\/daea83f47649d7605be390e88e65539d.png 781w\" loading=\"lazy\" decode=\"async\"\/><\/p>\n<div><figcaption>\u041e\u0442\u043f\u0440\u0430\u0432\u043a\u0430 \u0434\u0430\u043d\u043d\u044b\u0445 <\/figcaption><\/div>\n<\/figure>\n<h4>\u041a\u043e\u0434 \u0431\u043e\u0442\u0430<\/h4>\n<p>\u0411\u043e\u0442 \u043d\u0430\u043f\u0438\u0441\u0430\u043d \u043d\u0430 aiogram v3, \u0441\u043b\u0443\u0448\u0430\u0435\u0442 \u0432\u0441\u0435 \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u044f \u0438 \u0432 \u043e\u0442\u0432\u0435\u0442 \u043d\u0430 \u043d\u0438\u0445 \u043f\u0440\u0438\u0441\u044b\u043b\u0430\u0435\u0442 web_app \u0432 KeyboardButton, \u043f\u043e\u043b\u0443\u0447\u0430\u0435\u0442 \u0434\u0430\u043d\u043d\u044b\u0435 \u043e\u0442 WEB_APP \u0438 \u043e\u0431\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0435\u0442 \u0438\u0445:<\/p>\n<pre><code class=\"python\">import asyncio import os import json  from aiogram import Bot, Dispatcher, types, F from aiogram.enums import ParseMode, ContentType from aiogram.types import WebAppInfo, KeyboardButton, ReplyKeyboardMarkup from dotenv import load_dotenv  load_dotenv()  bot = Bot(os.getenv(\"BOT_TOKEN\")) dp = Dispatcher()  @dp.message() async def show_miniapp(message: types.Message):     keyboard = ReplyKeyboardMarkup(         keyboard=[             [KeyboardButton(                 text=\"\u041e\u0442\u043a\u0440\u044b\u0442\u044c MiniApp\",                 ##### \u0417\u0430\u043c\u0435\u043d\u0438\u0442\u044c \u043d\u0438\u0436\u0435:                 web_app=WebAppInfo(url=\"https:\/\/\u0421\u0421\u042b\u041b\u041a\u0410-\u041a\u041e\u0422\u041e\u0420\u0423\u042e-\u0412\u042b-\u041f\u041e\u041b\u0423\u0427\u0418\u0422\u0415-\u041f\u041e\u0417\u0416\u0415\/\")             )]         ],         resize_keyboard=True     )     await message.answer(\"\u041d\u0430\u0436\u043c\u0438\u0442\u0435 \u043a\u043d\u043e\u043f\u043a\u0443 \u043d\u0438\u0436\u0435, \u0447\u0442\u043e\u0431\u044b \u043e\u0442\u043a\u0440\u044b\u0442\u044c Mini App:\", reply_markup=keyboard)   @dp.message(F.content_type == ContentType.WEB_APP_DATA) async def handle_webapp_data(message: types.Message):     try:         data = json.loads(message.web_app_data.data)         name = data.get(\"name\", \"\u041d\u0435\u0438\u0437\u0432\u0435\u0441\u0442\u043d\u044b\u0439 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\")         msg = data.get(\"message\", \"(\u043f\u0443\u0441\u0442\u043e)\")          await message.answer(             f\"&lt;b&gt;{name}&lt;\/b&gt; \u043e\u0442\u043f\u0440\u0430\u0432\u0438\u043b(\u0430) \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0435:\\n\\n{msg}\",             parse_mode=ParseMode.HTML         )      except Exception as e:         await message.answer(\"\u041f\u0440\u043e\u0438\u0437\u043e\u0448\u043b\u0430 \u043e\u0448\u0438\u0431\u043a\u0430 \u043f\u0440\u0438 \u0440\u0430\u0437\u0431\u043e\u0440\u0435 \u0434\u0430\u043d\u043d\u044b\u0445 \u0438\u0437 Mini App\")  async def main():     await bot.delete_webhook(drop_pending_updates=True)     await dp.start_polling(bot)   if __name__ == \"__main__\":     asyncio.run(main()) <\/code><\/pre>\n<p>&gt; \u0412 <code>.env<\/code> \u043d\u0443\u0436\u043d\u043e \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0441\u0442\u0440\u043e\u043a\u0443:<br \/> &gt; <code>&amp;gt; BOT_TOKEN=\u0412\u0410\u0428:\u0422\u041e\u041a\u0415\u041d &amp;gt;<\/code><\/p>\n<h3>\u0414\u0435\u043f\u043b\u043e\u0439 <\/h3>\n<p><strong>\u041e\u0431\u0440\u0430\u0442\u0438\u0442\u0435 \u0432\u043d\u0438\u043c\u0430\u043d\u0438\u0435<\/strong>: \u043c\u044b \u043d\u0430\u043f\u0438\u0441\u0430\u043b\u0438 \u043c\u0438\u043d\u0438\u043c\u0430\u043b\u044c\u043d\u0443\u044e \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044e Mini App, \u0433\u0434\u0435 \u043d\u0435 \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u0442\u0441\u044f initData. \u042d\u0442\u043e \u0432\u0430\u0436\u043d\u043e, \u0432\u0435\u0434\u044c \u043b\u044e\u0431\u043e\u0439 \u0437\u043b\u043e\u0443\u043c\u044b\u0448\u043b\u0435\u043d\u043d\u0438\u043a \u043c\u043e\u0436\u0435\u0442 \u043f\u043e\u0434\u043c\u0435\u043d\u0438\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435.<\/p>\n<p>\u041f\u043e\u0441\u043b\u0435 \u0442\u043e\u0433\u043e \u043a\u0430\u043a \u043c\u044b \u043f\u043e\u0434\u0433\u043e\u0442\u043e\u0432\u0438\u043b\u0438 \u043d\u0430\u0448\u0443 \u043f\u0440\u043e\u0441\u0442\u0435\u043d\u044c\u043a\u0443\u044e \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044e Web App, \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u043f\u0435\u0440\u0435\u0439\u0442\u0438 \u043a \u0434\u0435\u043f\u043b\u043e\u044e. \u0420\u0430\u0437\u0432\u043e\u0440\u0430\u0447\u0438\u0432\u0430\u0442\u044c\u0441\u044f \u043c\u044b \u0431\u0443\u0434\u0435\u043c \u0432 <a href=\"https:\/\/amvera.ru\/?utm_source=habr&amp;utm_medium=article&amp;utm_campaign=tg-web-app\" rel=\"noopener noreferrer nofollow\">Amvera<\/a>.<\/p>\n<p><strong>Amvera<\/strong> &#8212; \u044d\u0442\u043e \u0441\u0435\u0440\u0432\u0438\u0441 \u0434\u043b\u044f <strong>\u043f\u0440\u043e\u0441\u0442\u043e\u0433\u043e \u0438 \u0431\u044b\u0441\u0442\u0440\u043e\u0433\u043e<\/strong> \u0434\u0435\u043f\u043b\u043e\u044f IT-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0439, \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e \u0443\u0434\u043e\u0431\u043d\u044b\u0439 \u0434\u043b\u044f \u0442\u0435\u0445, \u043a\u0442\u043e \u043d\u0435 \u0445\u043e\u0447\u0435\u0442 \u0442\u0440\u0430\u0442\u0438\u0442\u044c \u0432\u0440\u0435\u043c\u044f \u043d\u0430 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0443 \u0441\u0435\u0440\u0432\u0435\u0440\u043e\u0432. \u041f\u043e\u0441\u043b\u0435 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0430\u0446\u0438\u0438 \u0432\u044b \u0441\u0440\u0430\u0437\u0443 \u043f\u043e\u043b\u0443\u0447\u0430\u0435\u0442\u0435 <strong>111 \u0440\u0443\u0431\u043b\u0435\u0439 \u043d\u0430 \u0431\u0430\u043b\u0430\u043d\u0441<\/strong>, \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u0445\u0432\u0430\u0442\u0438\u0442, \u0447\u0442\u043e\u0431\u044b \u0431\u0435\u0437 \u043b\u0438\u0448\u043d\u0438\u0445 \u0432\u043b\u043e\u0436\u0435\u043d\u0438\u0439 \u0440\u0430\u0437\u0432\u0435\u0440\u043d\u0443\u0442\u044c \u043f\u0435\u0440\u0432\u043e\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435.<\/p>\n<p>\u0410 \u0435\u0449\u0451 \u2014 <strong>\u0431\u0435\u0441\u043f\u043b\u0430\u0442\u043d\u044b\u0439 \u0434\u043e\u043c\u0435\u043d \u0441 SSL-\u0441\u0435\u0440\u0442\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u043c<\/strong>, \u0442\u0430\u043a \u0447\u0442\u043e \u0432\u044b \u0441\u0440\u0430\u0437\u0443 \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u0435 \u0431\u0435\u0437\u043e\u043f\u0430\u0441\u043d\u0443\u044e \u0441\u0441\u044b\u043b\u043a\u0443 \u0432\u0438\u0434\u0430 <a href=\"https:\/\/%D0%B8%D0%BC%D1%8F-%D0%BF%D1%80%D0%BE%D0%B5%D0%BA%D1%82.amvera.io\" rel=\"noopener noreferrer nofollow\"><code>https:\/\/\u0438\u043c\u044f-\u043f\u0440\u043e\u0435\u043a\u0442.amvera.io<\/code><\/a>, \u0431\u0435\u0437 \u0442\u0430\u043d\u0446\u0435\u0432 \u0441 DNS \u0438 \u0441\u0435\u0440\u0442\u0438\u0444\u0438\u043a\u0430\u0442\u0430\u043c\u0438.<\/p>\n<p>\u0418\u0442\u0430\u043a, \u0434\u043b\u044f \u043d\u0430\u0447\u0430\u043b\u0430 \u043d\u0430\u043c \u043d\u0443\u0436\u043d\u043e \u0437\u0430\u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u0432 \u0441\u0435\u0440\u0432\u0438\u0441\u0435 \u043f\u043e <a href=\"https:\/\/amvera.ru\" rel=\"noopener noreferrer nofollow\">\u0441\u0441\u044b\u043b\u043a\u0435<\/a> \u0438 \u043f\u043e\u0434\u0442\u0432\u0435\u0440\u0434\u0438\u0442\u044c \u043f\u043e\u0447\u0442\u0443. \u0421\u0440\u0430\u0437\u0443 \u043f\u043e\u0441\u043b\u0435 \u044d\u0442\u043e\u0433\u043e \u0432\u044b \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u0435 111 \u0440\u0443\u0431\u043b\u0435\u0439 \u043d\u0430 \u0431\u0430\u043b\u0430\u043d\u0441.<\/p>\n<p>\u041d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 \u043f\u0440\u043e\u0435\u043a\u0442\u043e\u0432 \u0436\u043c\u0451\u043c \u043a\u043d\u043e\u043f\u043a\u0443 &#171;\u0421\u043e\u0437\u0434\u0430\u0442\u044c \u043f\u0440\u043e\u0435\u043a\u0442&#187; \u0438 \u0441\u043e\u0437\u0434\u0430\u0435\u043c \u0441\u043e \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u043c\u0438 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u0430\u043c\u0438:<\/p>\n<ul>\n<li>\n<p>\u0422\u0438\u043f \u0441\u0435\u0440\u0432\u0438\u0441\u0430: <code>\u041f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435<\/code>. \u0416\u043c\u0451\u043c \u0434\u0430\u043b\u0435\u0435;<\/p>\n<\/li>\n<li>\n<p><code>\u041d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u043f\u0440\u043e\u0435\u043a\u0442\u0430<\/code>: \u043b\u044e\u0431\u043e\u0435;<\/p>\n<\/li>\n<li>\n<p><code>\u0422\u0430\u0440\u0438\u0444<\/code>: \u0440\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u0443\u0435\u0442\u0441\u044f \u0432\u044b\u0431\u0440\u0430\u0442\u044c \u0442\u0430\u0440\u0438\u0444 &#171;\u041d\u0430\u0447\u0430\u043b\u044c\u043d\u044b\u0439&#187; \u0438\u043b\u0438 \u0432\u044b\u0448\u0435. \u0416\u043c\u0451\u043c \u0434\u0430\u043b\u0435\u0435.<\/p>\n<\/li>\n<\/ul>\n<p>\u0412\u0441\u0435 \u043e\u0441\u0442\u0430\u043b\u044c\u043d\u044b\u0435 \u044d\u0442\u0430\u043f\u044b \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u043c\u043e\u0436\u043d\u043e \u043f\u0440\u043e\u043f\u0443\u0441\u043a\u0430\u0442\u044c. \u041c\u044b \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u043c \u0432\u0441\u0435  \u0432 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430\u0445 \u043f\u0440\u043e\u0435\u043a\u0442\u0430.<\/p>\n<h4>\u0417\u0430\u0433\u0440\u0443\u0437\u043a\u0430 \u0444\u0430\u0439\u043b\u043e\u0432<\/h4>\n<p>\u0427\u0442\u043e\u0431\u044b \u0440\u0430\u0437\u0432\u0435\u0440\u043d\u0443\u0442\u044c \u0441\u0430\u0439\u0442, \u043d\u0430\u043c \u043f\u043e\u043d\u0430\u0434\u043e\u0431\u0438\u0442\u0441\u044f \u0437\u0430\u0433\u0440\u0443\u0437\u0438\u0442\u044c \u043f\u0440\u043e\u0441\u0442\u043e\u0439 Python-\u043a\u043e\u0434, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0437\u0430\u043f\u0443\u0441\u0442\u0438\u0442 Flask-\u0441\u0435\u0440\u0432\u0435\u0440 \u0438 \u043e\u0442\u0440\u0435\u043d\u0434\u0435\u0440\u0438\u0442 \u043d\u0430\u0448 index.html.<\/p>\n<p><a href=\"http:\/\/main.py\" rel=\"noopener noreferrer nofollow\"><code>main.py<\/code><\/a>:<\/p>\n<pre><code class=\"python\">from flask import Flask, render_template      app = Flask(__name__, template_folder='.')      @app.route(\"\/\")   def web():       return render_template('index.html')      if __name__ == \"__main__\":       app.run(debug=True, host=\"0.0.0.0\", port='80')   <\/code><\/pre>\n<p>\u041a\u043e\u0434 \u0432\u0437\u044f\u0442 \u0438\u0437 \u043e\u0434\u043d\u043e\u0439 \u0438\u0437 \u0441\u0442\u0430\u0440\u0448\u0438\u0445 <a href=\"https:\/\/habr.com\/ru\/companies\/amvera\/articles\/833482\" rel=\"noopener noreferrer nofollow\">\u0441\u0442\u0430\u0442\u0435\u0439<\/a>.<\/p>\n<p>\u0412\u043c\u0435\u0441\u0442\u0435 \u0441 \u043d\u0438\u043c \u043d\u0430\u043c \u043d\u0443\u0436\u043d\u043e \u0437\u0430\u0433\u0440\u0443\u0437\u0438\u0442\u044c \u0444\u0430\u0439\u043b <code>requirements.txt<\/code>. \u0424\u0430\u0439\u043b \u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u043e \u043d\u0443\u0436\u0435\u043d \u0434\u043b\u044f \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0438 <code>Flask==3.0.3<\/code><\/p>\n<p><code>requirements.txt<\/code>:<\/p>\n<pre><code>Flask==3.0.3<\/code><\/pre>\n<p>\u0413\u0440\u0443\u0437\u0438\u043c \u0432\u0441\u0435 3 \u0444\u0430\u0439\u043b\u0430:<\/p>\n<ul>\n<li>\n<p><a href=\"http:\/\/main.py\" rel=\"noopener noreferrer nofollow\"><code>main.py<\/code><\/a><\/p>\n<\/li>\n<li>\n<p><code>requirements.txt<\/code><\/p>\n<\/li>\n<li>\n<p><code>index.html<\/code> \u0441 Mini App \u0432<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/998\/733\/042\/9987330424a2074b50dfaf8cda2732df.png\" alt=\"\u041f\u043e\u0437\u0436\u0435 \u0437\u0434\u0435\u0441\u044c \u0431\u0443\u0434\u0435\u0442 \u0438 amvera.yml - \u0444\u0430\u0439\u043b \u043a\u043e\u043d\u0444\u0438\u0433\u0443\u0440\u0430\u0446\u0438\u0438\" title=\"\u041f\u043e\u0437\u0436\u0435 \u0437\u0434\u0435\u0441\u044c \u0431\u0443\u0434\u0435\u0442 \u0438 amvera.yml - \u0444\u0430\u0439\u043b \u043a\u043e\u043d\u0444\u0438\u0433\u0443\u0440\u0430\u0446\u0438\u0438\" width=\"1392\" height=\"548\" sizes=\"auto, (max-width: 780px) 100vw, 50vw\" srcset=\"https:\/\/habrastorage.org\/r\/w780\/getpro\/habr\/upload_files\/998\/733\/042\/9987330424a2074b50dfaf8cda2732df.png 780w,&#10;       https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/998\/733\/042\/9987330424a2074b50dfaf8cda2732df.png 781w\" loading=\"lazy\" decode=\"async\"\/><\/p>\n<div><figcaption><em>\u041f\u043e\u0437\u0436\u0435 \u0437\u0434\u0435\u0441\u044c \u0431\u0443\u0434\u0435\u0442 \u0438 amvera.yml &#8212; \u0444\u0430\u0439\u043b \u043a\u043e\u043d\u0444\u0438\u0433\u0443\u0440\u0430\u0446\u0438\u0438<\/em><\/figcaption><\/div>\n<\/figure>\n<h4>\u0421\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u043a\u043e\u043d\u0444\u0438\u0433\u0443\u0440\u0430\u0446\u0438\u0438<\/h4>\n<p>\u041f\u0440\u0435\u0434\u043f\u043e\u0441\u043b\u0435\u0434\u043d\u0438\u0439 \u044d\u0442\u0430\u043f \u2014 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u043a\u043e\u043d\u0444\u0438\u0433\u0443\u0440\u0430\u0446\u0438\u0438. \u0412\u0441\u0451, \u0447\u0442\u043e \u0432\u0430\u043c \u043d\u0443\u0436\u043d\u043e \u2014 \u043f\u043e\u0432\u0442\u043e\u0440\u0438\u0442\u044c \u043a\u043e\u043d\u0444\u0438\u0433\u0443\u0440\u0430\u0446\u0438\u044e \u0441\u043e \u0441\u043a\u0440\u0438\u043d\u0448\u043e\u0442\u0430 \u0432\u043e \u0432\u043a\u043b\u0430\u0434\u043a\u0435 &#171;\u041a\u043e\u043d\u0444\u0438\u0433\u0443\u0440\u0430\u0446\u0438\u044f&#187;:<\/p>\n<figure class=\"full-width\"><img decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/4cb\/bad\/d74\/4cbbadd7433284aaf0263ce7e42fe152.png\" alt=\"\u0417\u0430\u0434\u0430\u043d\u0438\u0435 \u043a\u043e\u043d\u0444\u0438\u0433\u0443\u0440\u0430\u0446\u0438\u0438\" title=\"\u0417\u0430\u0434\u0430\u043d\u0438\u0435 \u043a\u043e\u043d\u0444\u0438\u0433\u0443\u0440\u0430\u0446\u0438\u0438\" width=\"1378\" height=\"836\" sizes=\"auto, (max-width: 780px) 100vw, 50vw\" srcset=\"https:\/\/habrastorage.org\/r\/w780\/getpro\/habr\/upload_files\/4cb\/bad\/d74\/4cbbadd7433284aaf0263ce7e42fe152.png 780w,&#10;       https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/4cb\/bad\/d74\/4cbbadd7433284aaf0263ce7e42fe152.png 781w\" loading=\"lazy\" decode=\"async\"\/><\/p>\n<div><figcaption>\u0417\u0430\u0434\u0430\u043d\u0438\u0435 \u043a\u043e\u043d\u0444\u0438\u0433\u0443\u0440\u0430\u0446\u0438\u0438<\/figcaption><\/div>\n<\/figure>\n<p>\u0416\u043c\u0451\u043c \u00ab\u041f\u0440\u0438\u043c\u0435\u043d\u0438\u0442\u044c\u00bb \u0438 \u00ab\u0421\u043e\u0431\u0440\u0430\u0442\u044c\u00bb. \u0421\u0431\u043e\u0440\u043a\u0430 \u0437\u0430\u0439\u043c\u0435\u0442 \u043e\u043a\u043e\u043b\u043e \u043f\u044f\u0442\u0438 \u043c\u0438\u043d\u0443\u0442, \u0437\u0430\u043f\u0443\u0441\u043a \u043e\u043a\u043e\u043b\u043e \u043c\u0438\u043d\u0443\u0442\u044b.<\/p>\n<h4>\u0421\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u0431\u0435\u0441\u043f\u043b\u0430\u0442\u043d\u043e\u0433\u043e \u0434\u043e\u043c\u0435\u043d\u0430 \u0441 SSL<\/h4>\n<p>\u041f\u043e\u043a\u0430 \u043f\u0440\u043e\u0435\u043a\u0442 \u0441\u043e\u0431\u0438\u0440\u0430\u0435\u0442\u0441\u044f, \u0441\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u0434\u043e\u043c\u0435\u043d \u0432 \u043e\u0434\u043d\u043e\u0438\u043c\u0451\u043d\u043d\u043e\u0439 \u0432\u043a\u043b\u0430\u0434\u043a\u0435.<\/p>\n<p>\u0416\u043c\u0451\u043c \u043a\u043d\u043e\u043f\u043a\u0443 \u00ab\u0421\u043e\u0437\u0434\u0430\u0442\u044c \u0434\u043e\u043c\u0435\u043d\u043d\u043e\u0435 \u0438\u043c\u044f\u00bb, \u0432\u044b\u0431\u0438\u0440\u0430\u0435\u043c:<\/p>\n<ul>\n<li>\n<p><code>\u0422\u0438\u043f \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u044f<\/code>: <code>HTTPS<\/code><\/p>\n<\/li>\n<li>\n<p><code>\u0422\u0438\u043f \u0434\u043e\u043c\u0435\u043d\u0430<\/code>: <code>\u0411\u0435\u0441\u043f\u043b\u0430\u0442\u043d\u044b\u0439 \u0434\u043e\u043c\u0435\u043d Amvera<\/code><\/p>\n<\/li>\n<\/ul>\n<p>\u041f\u0440\u0438\u043c\u0435\u043d\u044f\u0435\u043c, \u0438 \u0447\u0435\u0440\u0435\u0437 \u0442\u0440\u0438\u0434\u0446\u0430\u0442\u044c \u0441\u0435\u043a\u0443\u043d\u0434 \u0434\u043e\u043c\u0435\u043d \u0431\u0443\u0434\u0435\u0442 \u0433\u043e\u0442\u043e\u0432.<\/p>\n<h3>\u0420\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442<\/h3>\n<p>\u041f\u043e\u0441\u043b\u0435 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0439 \u0432\u044b\u0448\u0435, \u0432\u0430\u0448\u0435 \u043c\u0438\u043d\u0438 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0431\u0443\u0434\u0435\u0442 \u0433\u043e\u0442\u043e\u0432\u043e \u0438 \u043e\u0441\u0442\u0430\u043d\u0435\u0442\u0441\u044f \u043b\u0438\u0448\u044c \u043f\u0440\u043e\u043f\u0438\u0441\u0430\u0442\u044c \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u043d\u0443\u044e \u0441\u0441\u044b\u043b\u043a\u0443 \u0432 \u043a\u043e\u0434 <a href=\"http:\/\/main.py\" rel=\"noopener noreferrer nofollow\"><code>main.py<\/code><\/a> \u0438 \u0437\u0430\u043f\u0443\u0441\u0442\u0438\u0442\u044c \u0431\u043e\u0442\u0430.<\/p>\n<p>\u0420\u0430\u0437\u0432\u0435\u0440\u043d\u0443\u0442\u044c \u0431\u043e\u0442\u0430 \u043c\u043e\u0436\u043d\u043e \u0431\u0443\u0434\u0435\u0442 \u043f\u043e \u044d\u0442\u043e\u0439 \u0438\u0434\u0435\u043d\u0442\u0438\u0447\u043d\u043e\u0439 \u043b\u043e\u0433\u0438\u043a\u0435, \u0441\u0432\u044f\u0437\u0430\u0432 \u043f\u043e \u0432\u043d\u0443\u0442\u0440\u0435\u043d\u043d\u0435\u043c\u0443 \u0434\u043e\u043c\u0435\u043d\u043d\u043e\u043c\u0443 \u0438\u043c\u0435\u043d\u0438.<\/p>\n<hr\/>\n<p>\u041a\u0430\u043a \u0432\u0430\u043c \u0441\u0442\u0430\u0442\u044c\u044f? \u041d\u0430\u043f\u0438\u0448\u0438\u0442\u0435 \u0432 \u043a\u043e\u043c\u043c\u0435\u043d\u0442\u0430\u0440\u0438\u044f\u0445, \u0447\u0442\u043e \u0435\u0449\u0451 \u0445\u043e\u0442\u0435\u043b\u043e\u0441\u044c \u0431\u044b \u0440\u0430\u0437\u043e\u0431\u0440\u0430\u0442\u044c. \u0412\u043e\u0437\u043c\u043e\u0436\u043d\u043e, \u0432 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0439 \u0440\u0430\u0437 \u0434\u043e\u0431\u0430\u0432\u0438\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u044b \u0441 \u0431\u0430\u0437\u043e\u0439 \u0434\u0430\u043d\u043d\u044b\u0445, \u043e\u043f\u043b\u0430\u0442\u0430\u043c\u0438 \u0438\u043b\u0438 \u0431\u043e\u043b\u0435\u0435 \u0441\u043b\u043e\u0436\u043d\u044b\u043c \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u043e\u043c \u0438 \u0431\u044d\u043a\u0435\u043d\u0434\u043e\u043c.<\/p>\n<p><strong>\u0420\u0435\u043b\u0435\u0432\u0430\u043d\u0442\u043d\u044b\u0435 \u0438\u043b\u0438 \u0443\u043f\u043e\u043c\u044f\u043d\u0443\u0442\u044b\u0435 \u0440\u0435\u0441\u0443\u0440\u0441\u044b<\/strong>:<\/p>\n<ul>\n<li>\n<p><a href=\"https:\/\/habr.com\/ru\/companies\/amvera\/articles\/838180\" rel=\"noopener noreferrer nofollow\">Telegram Mini App. \u041a\u0430\u043a \u0441\u043e\u0437\u0434\u0430\u0442\u044c Web App \u0441 \u043d\u0443\u043b\u044f<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/habr.com\/ru\/companies\/amvera\/articles\/833482\" rel=\"noopener noreferrer nofollow\">\u0414\u0435\u043f\u043b\u043e\u0439 \u0441\u0430\u0439\u0442\u0430 \u0432 \u043e\u0431\u043b\u0430\u043a\u043e \u0437\u0430 4 \u043a\u043e\u043c\u0430\u043d\u0434\u044b \u0432 IDE<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/docs.amvera.ru\" rel=\"noopener noreferrer nofollow\">\u0414\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044f Amvera<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/docs.amvera.ru\/general\/examples\/python-tgbot.html\" rel=\"noopener noreferrer nofollow\">\u041f\u0440\u0438\u043c\u0435\u0440\u044b \u0434\u0435\u043f\u043b\u043e\u044f \u0422\u0435\u043b\u0435\u0433\u0440\u0430\u043c \u0431\u043e\u0442\u0430 \u043d\u0430 Amvera<\/a><\/p>\n<\/li>\n<\/ul>\n<\/div>\n<\/div>\n<\/div>\n<p><!----><!----><\/div>\n<p><!----><!----><br \/> \u0441\u0441\u044b\u043b\u043a\u0430 \u043d\u0430 \u043e\u0440\u0438\u0433\u0438\u043d\u0430\u043b \u0441\u0442\u0430\u0442\u044c\u0438 <a href=\"https:\/\/habr.com\/ru\/articles\/935718\/\"> https:\/\/habr.com\/ru\/articles\/935718\/<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<div><!--[--><!--]--><\/div>\n<div id=\"post-content-body\">\n<div>\n<div class=\"article-formatted-body article-formatted-body article-formatted-body_version-2\">\n<div xmlns=\"http:\/\/www.w3.org\/1999\/xhtml\">\n<h2>\u0427\u0442\u043e \u0442\u0430\u043a\u043e\u0435 Mini App (Web App) \u0432 TG<\/h2>\n<p><a href=\"https:\/\/core.telegram.org\/bots\/webapps\" rel=\"noopener noreferrer nofollow\"><strong>Mini App<\/strong><\/a> (\u043e\u043d \u0436\u0435 <strong>Web App<\/strong>) \u2014 \u044d\u0442\u043e \u0432\u0435\u0431-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 (\u043f\u0440\u043e\u0449\u0435 \u0433\u043e\u0432\u043e\u0440\u044f \u0441\u0430\u0439\u0442), \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u043e\u0435 \u0432 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441 Telegram. \u041e\u043d\u043e \u043e\u0442\u043a\u0440\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u043f\u0440\u044f\u043c\u043e \u0432\u043d\u0443\u0442\u0440\u0438 \u0447\u0430\u0442\u0430: \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u043d\u0430\u0436\u0438\u043c\u0430\u0435\u0442 \u043a\u043d\u043e\u043f\u043a\u0443 \u00ab\u041e\u0442\u043a\u0440\u044b\u0442\u044c\u00bb \u0438 \u0432\u0438\u0434\u0438\u0442 \u043f\u043e\u043b\u043d\u043e\u0446\u0435\u043d\u043d\u0443\u044e \u0432\u0435\u0431-\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443 \u0441 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c\u044e \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f, \u0441\u0442\u0438\u043b\u0438\u0437\u0430\u0446\u0438\u0435\u0439 \u043f\u043e\u0434 \u0442\u0435\u043c\u0443 Telegram \u0438 \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0435\u0439 \u0434\u0430\u043d\u043d\u044b\u0445 \u043e\u0431\u0440\u0430\u0442\u043d\u043e \u0432 \u0431\u043e\u0442\u0430.<\/p>\n<p>\u042d\u0442\u043e \u0434\u0430\u0451\u0442 \u043d\u0430\u043c \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u043e \u043f\u0440\u0435\u0438\u043c\u0443\u0449\u0435\u0441\u0442\u0432, \u0442\u0430\u043a\u0438\u0445 \u043a\u0430\u043a:<\/p>\n<ul>\n<li>\n<p>\u0440\u0430\u0431\u043e\u0442\u0430 \u0441 \u0430\u0432\u0442\u043e\u0440\u0438\u0437\u043e\u0432\u0430\u043d\u043d\u044b\u043c\u0438 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f\u043c\u0438 (<code>tg.initDataUnsafe.user<\/code>);<\/p>\n<\/li>\n<li>\n<p>\u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u043e\u0435 \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0438\u0435 Telegram (\u0442\u0451\u043c\u043d\u0430\u044f\/\u0441\u0432\u0435\u0442\u043b\u0430\u044f \u0442\u0435\u043c\u0430);<\/p>\n<\/li>\n<li>\n<p>\u0434\u043e\u0441\u0442\u0443\u043f \u043a \u0434\u0430\u043d\u043d\u044b\u043c \u044e\u0437\u0435\u0440\u0430 (first_name, id \u0438 \u0434\u0440.) \u0431\u0435\u0437 \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0445 \u0430\u043d\u043a\u0435\u0442;<\/p>\n<\/li>\n<li>\n<p>\u043a\u043d\u043e\u043f\u043a\u0438 \u0438 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u0441 \u0431\u043e\u0442\u043e\u043c \u0431\u0435\u0437 \u043b\u0438\u0448\u043d\u0438\u0445 \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0439.<\/p>\n<\/li>\n<\/ul>\n<p>\u0412 <a href=\"https:\/\/habr.com\/ru\/companies\/amvera\/articles\/838180\/\" rel=\"noopener noreferrer nofollow\">\u043f\u0440\u043e\u0448\u043b\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435<\/a> \u044f \u0443\u0436\u0435 \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0435\u043b \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0438 Web App, \u0430 \u0441\u0435\u0433\u043e\u0434\u043d\u044f \u0436\u0435 \u043f\u043e\u0434\u0432\u0435\u0434\u0451\u043c \u0438\u0442\u043e\u0433\u0438, \u0440\u0430\u0441\u0441\u043a\u0430\u0436\u0435\u043c \u0432\u0441\u0435 \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u0438 \u0438 \u043d\u044e\u0430\u043d\u0441\u044b \u0440\u0430\u0431\u043e\u0442\u044b \u0441 Web App \u0432 TG \u0438 \u0441\u043e\u0431\u0435\u0440\u0451\u043c \u043f\u0440\u043e\u0441\u0442\u0435\u043d\u044c\u043a\u043e\u0435 \u0432\u0435\u0431-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435.<\/p>\n<h3>\u041e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u0438 \u0438 \u043d\u044e\u0430\u043d\u0441\u044b \u0440\u0430\u0431\u043e\u0442\u044b \u0441 Web App<\/h3>\n<h4>\u041f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u0438 \u0437\u0430\u043f\u0443\u0441\u043a<\/h4>\n<p>\u0417\u0434\u0435\u0441\u044c \u0432\u0430\u0436\u043d\u043e \u0437\u043d\u0430\u0442\u044c \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0432\u0435\u0449\u0435\u0439:<\/p>\n<ol>\n<li>\n<p><code>tg.initDataUnsafe<\/code> \u2014 \u043c\u0435\u0442\u043e\u0434 \u0434\u043b\u044f \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u0438\u044f \u0432\u0441\u0435\u0445 \u0434\u0430\u043d\u043d\u044b\u0445 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f. \u0420\u0430\u0431\u043e\u0442\u0430\u0435\u0442 <strong>\u0442\u043e\u043b\u044c\u043a\u043e<\/strong> \u0442\u043e\u0433\u0434\u0430, \u043a\u043e\u0433\u0434\u0430 Mini App \u043e\u0442\u043a\u0440\u044b\u0442 \u0438\u0437 Telegram, \u0430 \u043d\u0430\u043f\u0440\u044f\u043c\u0443\u044e \u0438\u0437 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430. \u0422\u0435\u043c \u0441\u0430\u043c\u044b\u043c \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0442\u044c, \u043d\u0435 \u043e\u0442\u043a\u0440\u044b\u043b \u043b\u0438 \u0435\u0433\u043e \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u0441 \u0432\u043d\u0435\u0448\u043d\u0435\u0433\u043e \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430, \u0447\u0442\u043e\u0431\u044b \u043d\u0435 \u0441\u043b\u043e\u0432\u0438\u0442\u044c \u043a\u0443\u0447\u0443 \u0431\u0430\u0433\u043e\u0432;<\/p>\n<\/li>\n<li>\n<p><code>tg.sendData()<\/code> \u2014 \u043c\u0435\u0442\u043e\u0434 \u0434\u043b\u044f \u043e\u0442\u043f\u0440\u0430\u0432\u043a\u0438 \u0434\u0430\u043d\u043d\u044b\u0445 \u043e\u0431\u0440\u0430\u0442\u043d\u043e \u0432 \u0431\u043e\u0442\u0430. \u0420\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u0442\u043e\u043b\u044c\u043a\u043e, \u0435\u0441\u043b\u0438 MiniApp \u043e\u0442\u043a\u0440\u044b\u0442 \u0447\u0435\u0440\u0435\u0437 reply-\u043a\u043d\u043e\u043f\u043a\u0443 \u0441 <code>web_app<\/code>. \u0422\u043e \u0435\u0441\u0442\u044c \u043f\u0440\u0438 \u043e\u0442\u043a\u0440\u044b\u0442\u0438\u0438 \u0447\u0435\u0440\u0435\u0437 inline-\u043a\u043d\u043e\u043f\u043a\u0443 <code>sendData()<\/code> \u043d\u0435 \u0441\u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442.<\/p>\n<\/li>\n<\/ol>\n<h4>\u0421\u0442\u0438\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u0442\u0435\u043c\u044b \u043f\u043e\u0434 Telegram<\/h4>\n<p>Telegram API \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435 \u0434\u043b\u044f \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u0438\u044f \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0439 \u0442\u0435\u043c\u044b (\u0442\u043e\u0439 \u0442\u0435\u043c\u044b, \u043a\u043e\u0442\u043e\u0440\u0443\u044e \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u0432\u044b\u0441\u0442\u0430\u0432\u0438\u043b \u0432 \u0441\u0432\u043e\u0451\u043c \u043a\u043b\u0438\u0435\u043d\u0442\u0435 \u0442\u0435\u043b\u0435\u0433\u0440\u0430\u043c), \u0447\u0442\u043e \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043d\u0430\u043c \u0441\u0442\u0438\u043b\u0438\u0437\u043e\u0432\u0430\u0442\u044c \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443 \u043f\u043e\u0434 \u0442\u0435\u043c\u0443 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f.<\/p>\n<p>\u0421\u0430\u043c\u0438 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435:<\/p>\n<ul>\n<li>\n<p><code>--tg-theme-bg-color<\/code> \u2014 \u0431\u0443\u043a\u0432\u0430\u043b\u044c\u043d\u043e \u0446\u0432\u0435\u0442 \u0444\u043e\u043d\u0430;<\/p>\n<\/li>\n<li>\n<p><code>--tg-theme-text-color<\/code> \u2014 \u0446\u0432\u0435\u0442 \u0448\u0440\u0438\u0444\u0442\u0430 \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0435\u043d\u043d\u043e;<\/p>\n<\/li>\n<li>\n<p><code>--tg-color-scheme<\/code> \u2014 \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u0438\u0435 \u0442\u0435\u043c\u044b \u043a\u043b\u0438\u0435\u043d\u0442\u0430 (<code>light<\/code> \u0438\u043b\u0438 <code>dark<\/code>);<\/p>\n<\/li>\n<li>\n<p><code>--tg-theme-hint-color<\/code> \u2014 \u0432\u0442\u043e\u0440\u0438\u0447\u043d\u044b\u0439 \u0442\u0435\u043a\u0441\u0442 \/ \u043f\u043e\u0434\u0441\u043a\u0430\u0437\u043a\u0438;<\/p>\n<\/li>\n<li>\n<p><code>--tg-theme-link-color<\/code> \u2014 \u0446\u0432\u0435\u0442 \u0441\u0441\u044b\u043b\u043e\u043a;<\/p>\n<\/li>\n<li>\n<p><code>--tg-theme-button-color<\/code> \u2014 \u0446\u0432\u0435\u0442 \u043a\u043d\u043e\u043f\u043a\u0438;<\/p>\n<\/li>\n<li>\n<p><code>--tg-theme-button-text-color<\/code> \u2014 \u0442\u0435\u043a\u0441\u0442 \u043d\u0430 \u043a\u043d\u043e\u043f\u043a\u0435;<\/p>\n<\/li>\n<li>\n<p><code>--tg-theme-secondary-bg-color<\/code> \u2014 \u0432\u0442\u043e\u0440\u0438\u0447\u043d\u044b\u0439 \u0446\u0432\u0435\u0442 \u0444\u043e\u043d\u0430;<\/p>\n<\/li>\n<li>\n<p><code>--tg-theme-header-bg-color<\/code> \u2014 \u0444\u043e\u043d \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u0430 (\u0445\u0435\u0430\u0434\u0435\u0440\u0430);<\/p>\n<\/li>\n<li>\n<p>\u0438 \u0442. \u0434. \u0412\u0441\u0435 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435 \u043e\u043f\u0438\u0441\u0430\u043d\u044b <a href=\"https:\/\/core.telegram.org\/bots\/webapps#themeparams\" rel=\"noopener noreferrer nofollow\">\u0437\u0434\u0435\u0441\u044c<\/a>.<\/p>\n<\/li>\n<\/ul>\n<h4>\u0411\u0435\u0437\u043e\u043f\u0430\u0441\u043d\u043e\u0441\u0442\u044c \u0438 \u0438\u0434\u0435\u043d\u0442\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u044f<\/h4>\n<ul>\n<li>\n<p><code>initData<\/code> \u2014 \u0437\u0430\u0448\u0438\u0444\u0440\u043e\u0432\u0430\u043d\u043d\u0430\u044f \u0441\u0442\u0440\u043e\u043a\u0430, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0432\u0435\u0440\u0438\u0444\u0438\u0446\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u0441\u0435\u0440\u0432\u0435\u0440\u043e\u043c (\u0443\u0433\u043b\u0443\u0431\u0438\u043c\u0441\u044f \u0447\u0443\u0442\u044c \u043f\u043e\u0437\u0436\u0435);<\/p>\n<\/li>\n<li>\n<p><code>initDataUnsafe<\/code> \u2014 \u0443\u0436\u0435 \u0440\u0430\u0441\u043f\u0430\u0440\u0441\u0435\u043d\u043d\u044b\u0439 \u043e\u0431\u044a\u0435\u043a\u0442. \u041d\u0435 \u0440\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u0443\u0435\u0442\u0441\u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043d\u0430 \u043f\u0440\u043e\u0434\u0435.<\/p>\n<\/li>\n<\/ul>\n<h4>\u041d\u044e\u0430\u043d\u0441\u044b \u0434\u0435\u043f\u043b\u043e\u044f<\/h4>\n<ul>\n<li>\n<p>Web App \u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u043e \u0434\u043e\u043b\u0436\u0435\u043d \u0431\u044b\u0442\u044c \u0434\u043e\u0441\u0442\u0443\u043f\u0435\u043d \u043f\u043e <code>https.<\/code>\u041e\u0431\u044b\u0447\u043d\u044b\u0439 <code>http<\/code> \u043d\u0435 \u043f\u043e\u0434\u043e\u0439\u0434\u0451\u0442. \u041e\u0434\u043d\u0430\u043a\u043e \u0432 \u043d\u0430\u0448\u0435\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u044d\u0442\u043e \u043d\u0435 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430. Amvera \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0441\u043e\u0432\u0435\u0440\u0448\u0435\u043d\u043d\u043e <strong>\u0431\u0435\u0441\u043f\u043b\u0430\u0442\u043d\u044b\u0439 \u0434\u043e\u043c\u0435\u043d \u0438 SSL-\u0441\u0435\u0440\u0442\u0438\u0444\u0438\u043a\u0430\u0442<\/strong>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0432\u044b \u0441\u043c\u043e\u0436\u0435\u0442\u0435 \u0430\u043a\u0442\u0438\u0432\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0434\u043b\u044f \u0441\u0432\u043e\u0435\u0433\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0430 \u043f\u0440\u044f\u043c \u0432 \u041b\u041a \u0437\u0430 \u043f\u0430\u0440\u0443 \u043c\u0438\u043d\u0443\u0442.<\/p>\n<\/li>\n<li>\n<p>Telegram \u043e\u0442\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u0442 \u0434\u0430\u043d\u043d\u044b\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u043f\u043e\u0441\u043b\u0435 \u043a\u043b\u0438\u043a\u0430 \u043f\u043e <strong>web_app-\u043a\u043d\u043e\u043f\u043a\u0435<\/strong>, \u043f\u0440\u0438 \u043e\u0442\u043a\u0440\u044b\u0442\u0438\u0438 \u0441\u0441\u044b\u043b\u043a\u0438 \u0434\u0430\u043d\u043d\u044b\u0435 \u043d\u0435 \u043e\u0442\u043f\u0440\u0430\u0432\u044f\u0442\u0441\u044f.<\/p>\n<\/li>\n<\/ul>\n<h4>\u041f\u0440\u0438\u043c\u0435\u0440 initDataUnsafe \u0438 initData<\/h4>\n<p>\u041a\u043e\u0433\u0434\u0430 Mini App \u043e\u0442\u043a\u0440\u044b\u0442 \u043a\u043e\u0440\u0440\u0435\u043a\u0442\u043d\u043e, Telegram \u043f\u0435\u0440\u0435\u0434\u0430\u0451\u0442 \u0434\u0432\u0430 \u0432\u0438\u0434\u0430 \u0434\u0430\u043d\u043d\u044b\u0445:<\/p>\n<h3>initDataUnsafe \u2014 \u0443\u0436\u0435 \u0440\u0430\u0441\u043f\u0430\u0440\u0441\u0435\u043d\u043d\u044b\u0439 \u043e\u0431\u044a\u0435\u043a\u0442:<\/h3>\n<pre><code class=\"json\">{   \"user\": {     \"id\": ,     \"first_name\": \"\",     \"last_name\": \"\",     \"username\": \"\",     \"language_code\": \"\",     \"is_premium\": true,     \"allows_write_to_pm\": true,     \"photo_url\": \"\"   },   \"chat_instance\": \"\",   \"chat_type\": \"sender\",   \"auth_date\": \"\",   \"signature\": \"\",   \"hash\": \"\" } <\/code><\/pre>\n<p>\u042d\u0442\u043e\u0442 \u043e\u0431\u044a\u0435\u043a\u0442 \u0434\u043e\u0441\u0442\u0443\u043f\u0435\u043d \u0432 <code>tg.initDataUnsafe<\/code> \u0438 \u0443\u0434\u043e\u0431\u0435\u043d \u0434\u043b\u044f \u0432\u044b\u0432\u043e\u0434\u0430 \u0438\u043c\u0435\u043d\u0438, \u0430\u0432\u0430\u0442\u0430\u0440\u043a\u0438 \u0438 \u0434\u0440., \u043d\u043e <strong>\u043d\u0435\u0431\u0435\u0437\u043e\u043f\u0430\u0441\u0435\u043d<\/strong>. \u0417\u043b\u043e\u0443\u043c\u044b\u0448\u043b\u0435\u043d\u043d\u0438\u043a \u043c\u043e\u0436\u0435\u0442 \u043f\u043e\u0434\u0434\u0435\u043b\u0430\u0442\u044c \u0435\u0433\u043e \u043f\u0440\u0438 \u043e\u0442\u043a\u0440\u044b\u0442\u0438\u0438 \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435.<\/p>\n<h3>initData \u2014 \u0441\u0442\u0440\u043e\u043a\u0430, \u043a\u043e\u0442\u043e\u0440\u0443\u044e \u043d\u0443\u0436\u043d\u043e \u043f\u0440\u043e\u0432\u0435\u0440\u0438\u0442\u044c \u043d\u0430 \u0441\u0435\u0440\u0432\u0435\u0440\u0435:<\/h3>\n<pre><code class=\"perl\">user=%7B%22id%22%3A&amp;lt;...&amp;gt;%2C%22first_name%22%3A%22&amp;lt;...&amp;gt;%22%7D&amp;amp;chat_instance=&amp;amp;chat_type=sender&amp;amp;auth_date=&amp;amp;signature=&amp;amp;hash=<\/code><\/pre>\n<p>\u042d\u0442\u043e URL-\u043a\u043e\u0434\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u0430\u044f \u0441\u0442\u0440\u043e\u043a\u0430, \u043a\u043e\u0442\u043e\u0440\u0443\u044e Telegram \u043f\u0435\u0440\u0435\u0434\u0430\u0451\u0442 \u0432 <code>tg.initData<\/code>. \u0415\u0435 \u043d\u0443\u0436\u043d\u043e <strong>\u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u043e \u0432\u0435\u0440\u0438\u0444\u0438\u0446\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043d\u0430 \u0441\u0435\u0440\u0432\u0435\u0440\u0435<\/strong>, \u0447\u0442\u043e\u0431\u044b \u0443\u0431\u0435\u0434\u0438\u0442\u044c\u0441\u044f, \u0447\u0442\u043e \u0434\u0430\u043d\u043d\u044b\u0435 \u043f\u043e\u0434\u043b\u0438\u043d\u043d\u044b\u0435, \u0438 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u043e\u0442\u043a\u0440\u044b\u043b Web App \u0447\u0435\u0440\u0435\u0437 Telegram.<\/p>\n<h4>\u041e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u0434\u0430\u043d\u043d\u044b\u0445 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f<\/h4>\n<p>\u041a\u043e\u0433\u0434\u0430 \u043c\u044b \u0443\u0441\u043f\u0435\u0448\u043d\u043e \u043f\u0440\u043e\u0432\u0435\u0440\u0438\u043b\u0438 <code>initData<\/code> \u043d\u0430 \u0441\u0435\u0440\u0432\u0435\u0440\u0435 (\u0442\u043e \u0435\u0441\u0442\u044c \u0443\u0431\u0435\u0434\u0438\u043b\u0438\u0441\u044c, \u0447\u0442\u043e \u0432\u0441\u0451 \u043f\u0440\u0438\u0448\u043b\u043e \u0438\u043c\u0435\u043d\u043d\u043e \u043e\u0442 Telegram, \u0430 \u043d\u0435 \u043f\u043e\u0434\u0434\u0435\u043b\u0430\u043d\u043e), \u043c\u043e\u0436\u0435\u043c \u0441\u043f\u043e\u043a\u043e\u0439\u043d\u043e \u0434\u043e\u0441\u0442\u0430\u0432\u0430\u0442\u044c \u043d\u0443\u0436\u043d\u044b\u0435 \u0434\u0430\u043d\u043d\u044b\u0435 \u043e \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0435.<\/p>\n<p>\u0412\u043d\u0443\u0442\u0440\u0438 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u0430 <code>user<\/code> \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442\u0441\u044f \u043f\u043e\u043b\u0435\u0437\u043d\u0430\u044f \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f:<\/p>\n<ul>\n<li>\n<p><code>id<\/code> \u2014 \u0443\u043d\u0438\u043a\u0430\u043b\u044c\u043d\u044b\u0439 Telegram \u0430\u0439\u0434\u0438 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f (\u043d\u0443\u0436\u0435\u043d, \u0447\u0442\u043e\u0431\u044b \u0438\u0434\u0435\u043d\u0442\u0438\u0444\u0438\u0446\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0435\u0433\u043e \u0432 \u0431\u0430\u0437\u0435 \u0438\u043b\u0438 \u043f\u0438\u0441\u0430\u0442\u044c \u0432 \u043b\u0438\u0447\u043a\u0443);<\/p>\n<\/li>\n<li>\n<p><code>first_name<\/code> \u2014 \u0435\u0433\u043e \u0438\u043c\u044f (\u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043b\u044e\u0431\u043e\u0435, \u0445\u043e\u0442\u044c \u0441\u043c\u0430\u0439\u043b\u0438\u043a);<\/p>\n<\/li>\n<li>\n<p><code>last_name<\/code> \u2014 \u0444\u0430\u043c\u0438\u043b\u0438\u044f, \u043d\u043e \u0447\u0430\u0441\u0442\u043e \u0431\u044b\u0432\u0430\u0435\u0442 \u043f\u0440\u043e\u0441\u0442\u043e \u043f\u0443\u0441\u0442\u043e\u0439;<\/p>\n<\/li>\n<li>\n<p><code>username<\/code> \u2014 \u043d\u0438\u043a, \u0435\u0441\u043b\u0438 \u043e\u043d \u0435\u0441\u0442\u044c (\u0442\u043e \u0441\u0430\u043c\u043e\u0435 <code>@\u0438\u043c\u044f<\/code>);<\/p>\n<\/li>\n<li>\n<p><code>language_code<\/code> \u2014 \u044f\u0437\u044b\u043a \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 <code>ru<\/code>, <code>en<\/code> \u0438 \u0442.\u043f.<\/p>\n<\/li>\n<li>\n<p><code>is_premium<\/code> \u2014 \u0444\u043b\u0430\u0433, \u0435\u0441\u0442\u044c \u043b\u0438 \u0443 \u0447\u0435\u043b\u043e\u0432\u0435\u043a\u0430 Telegram Premium;<\/p>\n<\/li>\n<li>\n<p><code>allows_write_to_pm<\/code> \u2014 \u043c\u043e\u0436\u043d\u043e \u043b\u0438 \u0431\u043e\u0442\u0443 \u043d\u0430\u043f\u0438\u0441\u0430\u0442\u044c \u044d\u0442\u043e\u043c\u0443 \u0447\u0435\u043b\u043e\u0432\u0435\u043a\u0443 \u043d\u0430\u043f\u0440\u044f\u043c\u0443\u044e;<\/p>\n<\/li>\n<li>\n<p><code>photo_url<\/code> \u2014 \u0441\u0441\u044b\u043b\u043a\u0430 \u043d\u0430 \u0430\u0432\u0430\u0442\u0430\u0440\u043a\u0443 \u0432 Telegram, \u043c\u043e\u0436\u043d\u043e \u0432\u0441\u0442\u0430\u0432\u0438\u0442\u044c \u043a\u0430\u043a \u043e\u0431\u044b\u0447\u043d\u0443\u044e \u043a\u0430\u0440\u0442\u0438\u043d\u043a\u0443.<\/p>\n<\/li>\n<\/ul>\n<p>\u041f\u043e\u043b\u0443\u0447\u0438\u0442\u044c, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, <code>first_name<\/code> \u043c\u043e\u0436\u043d\u043e \u0442\u0430\u043a:<\/p>\n<ul>\n<li>\n<p><code>const firstName = tg.initDataUnsafe.user.first_name;<\/code><\/p>\n<\/li>\n<\/ul>\n<p>\u0422\u0435\u043f\u0435\u0440\u044c, \u043a\u043e\u0433\u0434\u0430 \u043c\u044b \u0440\u0430\u0437\u043e\u0431\u0440\u0430\u043b\u0438\u0441\u044c \u0441 \u043f\u043e\u0434\u0432\u043e\u0434\u043d\u044b\u043c\u0438 \u043a\u0430\u043c\u043d\u044f\u043c\u0438, \u0434\u0430\u0432\u0430\u0439 \u0441\u043e\u0431\u0435\u0440\u0451\u043c \u043f\u0440\u043e\u0441\u0442\u043e\u0439 Mini App \u0441 \u043a\u043d\u043e\u043f\u043a\u043e\u0439 \u0438 \u0444\u043e\u0440\u043c\u043e\u0439 \u0438 \u0441\u0432\u044f\u0436\u0435\u043c \u0435\u0433\u043e \u0441 \u0431\u043e\u0442\u043e\u043c.<\/p>\n<h3>\u041f\u0440\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0430\u044f \u0447\u0430\u0441\u0442\u044c:  \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0430 Web App<\/h3>\n<p>\u041a\u0430\u043a \u0432\u0441\u0435\u0433\u0434\u0430, \u043d\u0430\u0447\u043d\u0451\u043c \u0441 \u043c\u0430\u043b\u043e\u0433\u043e: \u043f\u0440\u043e\u0432\u0435\u0440\u0438\u043c, \u0437\u0430\u043f\u0443\u0449\u0435\u043d \u043b\u0438 Web App \u0438\u0437 Telegram, \u0438 \u0435\u0441\u043b\u0438 \u043d\u0435\u0442, \u043e\u0442\u043f\u0440\u0430\u0432\u0438\u043c \u043f\u0440\u0435\u0434\u0443\u043f\u0440\u0435\u0436\u0434\u0435\u043d\u0438\u0435.<\/p>\n<p>\u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u043d\u0430\u043f\u0438\u0448\u0435\u043c \u043f\u0440\u043e\u0441\u0442\u0435\u043d\u044c\u043a\u0438\u0439 <code>index.html<\/code>:<\/p>\n<pre><code>   &lt;title&gt;Mini App&lt;\/title&gt;   &lt;style&gt;     :root {       --bg-color: var(--tg-theme-bg-color, #ffffff);       --text-color: var(--tg-theme-text-color, #000000);       --accent-color: var(--tg-theme-button-color, #0088cc);     }      * {       margin: 0;       padding: 0;       box-sizing: border-box;     }      body {       background: var(--bg-color);       color: var(--text-color);       font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;       text-align: center;     }      .warn {       background: var(--bg-color);       color: var(--text-color);       padding: 40px 20px;       display: none;       height: 100vh;       width: 100vw;       flex-direction: column;       align-items: center;       justify-content: center;     }      .warn img {       width: 120px;       height: 120px;       margin-bottom: 20px;       animation: float 2s ease-in-out infinite;     }      @keyframes float {       0% { transform: translateY(0px); }       50% { transform: translateY(-10px); }       100% { transform: translateY(0px); }     }      .warn p {       font-size: 18px;       margin: 8px 0;     }      .main {       display: none;       padding: 20px;     }      .btn {       padding: 12px 24px;       font-size: 16px;       border: none;       border-radius: 5px;       background: var(--accent-color);       color: var(--tg-theme-button-text-color, #ffffff);       cursor: pointer;       margin-top: 20px;     }   &lt;\/style&gt;     &lt;div id=\"notInTelegram\" class=\"warn\"&gt;     &lt;img alt=\"TLogo\" src=\"https:\/\/telegram.org\/img\/t_logo.png\"&gt;     &lt;p&gt;&lt;strong&gt;\u0423\u043f\u0441!&lt;\/strong&gt;&lt;\/p&gt;     &lt;p&gt;\u042d\u0442\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0434\u043e\u043b\u0436\u043d\u043e \u0431\u044b\u0442\u044c \u0437\u0430\u043f\u0443\u0449\u0435\u043d\u043e &lt;strong&gt;\u0432\u043d\u0443\u0442\u0440\u0438 Telegram!&lt;\/strong&gt;&lt;\/p&gt;   &lt;\/div&gt;    &lt;div id=\"mainApp\" class=\"main\"&gt;     &lt;h1&gt;\u041f\u0440\u0438\u0432\u0435\u0442 \u0438\u0437 Mini App &lt;\/h1&gt;     &lt;p&gt;MiniApp \u0443\u0441\u043f\u0435\u0448\u043d\u043e \u043e\u0442\u043a\u0440\u044b\u0442 \u0432 Telegram!&lt;\/p&gt;     &lt;button id=\"actionBtn\" class=\"btn\"&gt;\u041f\u0440\u043e\u0434\u043e\u043b\u0436\u0438\u0442\u044c&lt;\/button&gt;   &lt;\/div&gt; <\/code><\/pre>\n<p>\u0422\u0430\u043a\u043e\u0439 \u0448\u0430\u0431\u043b\u043e\u043d \u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0432 \u043a\u0430\u0436\u0434\u043e\u043c Mini App, \u0447\u0442\u043e\u0431\u044b \u0438\u0441\u043a\u043b\u044e\u0447\u0438\u0442\u044c \u043e\u0448\u0438\u0431\u043a\u0438 \u043f\u0440\u0438 \u043e\u0442\u043a\u0440\u044b\u0442\u0438\u0438 \u0447\u0435\u0440\u0435\u0437 \u0431\u0440\u0430\u0443\u0437\u0435\u0440. Telegram \u043d\u0435 \u043f\u0435\u0440\u0435\u0434\u0430\u0451\u0442 \u0434\u0430\u043d\u043d\u044b\u0435, \u0435\u0441\u043b\u0438 Web App \u043d\u0435 \u0431\u044b\u043b \u043e\u0442\u043a\u0440\u044b\u0442 \u043f\u043e \u043a\u043d\u043e\u043f\u043a\u0435.  \u041c\u044b \u0441\u0440\u0430\u0437\u0443 \u043f\u043e\u043a\u0430\u0436\u0435\u043c \u043e\u0431 \u044d\u0442\u043e\u043c \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0435.<\/p>\n<h3>\u0427\u0442\u043e \u0437\u0434\u0435\u0441\u044c \u0432\u0430\u0436\u043d\u043e:<\/h3>\n<ul>\n<li>\n<p><code>!tg || !tg.initDataUnsafe?.user<\/code> \u2014 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430, \u0447\u0442\u043e Mini App \u043e\u0442\u043a\u0440\u044b\u0442 \u043d\u0435 \u0432 Telegram (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043f\u0440\u043e\u0441\u0442\u043e \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435);<\/p>\n<\/li>\n<li>\n<p><code>tg.expand()<\/code> \u2014 \u0440\u0430\u0437\u0432\u043e\u0440\u0430\u0447\u0438\u0432\u0430\u0435\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043d\u0430 \u0432\u0435\u0441\u044c \u044d\u043a\u0440\u0430\u043d;<\/p>\n<\/li>\n<li>\n<p>\u0421\u0442\u0438\u043b\u0438 \u0438 \u0446\u0432\u0435\u0442\u0430 \u0431\u0435\u0440\u0443\u0442\u0441\u044f \u043d\u0430\u043f\u0440\u044f\u043c\u0443\u044e \u0438\u0437 Telegram-\u043a\u043b\u0438\u0435\u043d\u0442\u0430, \u0431\u0435\u0437 \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0439 \u0442\u0435\u043c\u044b.<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\">\n<div><figcaption>\u041e\u0442\u043a\u0440\u044b\u0442\u0438\u0435 Telegram Web App \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435<\/figcaption><\/div>\n<\/figure>\n<h4>\u041e\u0442\u043f\u0440\u0430\u0432\u043a\u0430 \u0434\u0430\u043d\u043d\u044b\u0445 \u0438\u0437 Mini App: sendData() \u0438 \u043a\u0430\u043a \u043e\u043d (\u043d\u0435) \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442<\/h4>\n<p>\u041c\u0438\u043d\u0438-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u043c\u043e\u0433\u0443\u0442 \u043e\u0442\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435 \u043e\u0431\u0440\u0430\u0442\u043d\u043e \u0432 \u0431\u043e\u0442\u0430. \u0414\u0435\u043b\u0430\u0435\u0442\u0441\u044f \u044d\u0442\u043e \u0447\u0435\u0440\u0435\u0437 \u043c\u0435\u0442\u043e\u0434:<\/p>\n<pre><code>tg.sendData(\"\u043b\u044e\u0431\u0430\u044f \u0441\u0442\u0440\u043e\u043a\u0430\");<\/code><\/pre>\n<p>\u041e\u0431\u044b\u0447\u043d\u043e \u044d\u0442\u043e \u0441\u0442\u0440\u043e\u043a\u0430 \u0432 \u0444\u043e\u0440\u043c\u0430\u0442\u0435 JSON. \u0411\u043e\u0442 \u043f\u043e\u043b\u0443\u0447\u0430\u0435\u0442 \u0435\u0451 \u0432 \u0441\u043e\u0431\u044b\u0442\u0438\u0438 WEB_APP_DATA.<\/p>\n<p><strong>\u041d\u043e! \u0415\u0441\u0442\u044c \u0432\u0430\u0436\u043d\u043e\u0435 \u043e\u0433\u0440\u0430\u043d\u0438\u0447\u0435\u043d\u0438\u0435:<\/strong><\/p>\n<p><code>tg.sendData()<\/code> \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 <strong>\u0422\u041e\u041b\u042c\u041a\u041e<\/strong>, \u0435\u0441\u043b\u0438 Mini App \u043e\u0442\u043a\u0440\u044b\u0442 <strong>\u043f\u043e \u043a\u043d\u043e\u043f\u043a\u0435 \u0441 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u043e\u043c <\/strong><code><strong>web_app<\/strong><\/code>, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440:<\/p>\n<pre><code class=\"python\">KeyboardButton(text=\"\u041e\u0442\u043a\u0440\u044b\u0442\u044c\", web_app=WebAppInfo(url=\"https:\/\/...\"))<\/code><\/pre>\n<p><strong>\u0415\u0441\u043b\u0438 \u043e\u0442\u043a\u0440\u044b\u0442\u044c Web App \u043f\u043e inline-\u043a\u043d\u043e\u043f\u043a\u0435<\/strong>, <code>sendData()<\/code> \u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u043d\u0435 \u0431\u0443\u0434\u0435\u0442 <\/p>\n<h4>\u041f\u0440\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0430\u044f \u0447\u0430\u0441\u0442\u044c:  \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0430 Web App<\/h4>\n<p>\u041a\u0430\u043a \u0432\u0441\u0435\u0433\u0434\u0430 \u043d\u0430\u0447\u043d\u0451\u043c \u0441 \u043c\u0430\u043b\u043e\u0433\u043e: \u043f\u0440\u043e\u0432\u0435\u0440\u0438\u043c, \u0437\u0430\u043f\u0443\u0449\u0435\u043d \u043b\u0438 Web App \u0438\u0437 Telegram, \u0438 \u0435\u0441\u043b\u0438 \u043d\u0435\u0442 &#8212; \u043e\u0442\u043f\u0440\u0430\u0432\u0438\u043c \u043f\u0440\u0435\u0434\u0443\u043f\u0440\u0435\u0436\u0434\u0435\u043d\u0438\u0435.<\/p>\n<p>\u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u043d\u0430\u043f\u0438\u0448\u0435\u043c \u043f\u0440\u043e\u0441\u0442\u0435\u043d\u044c\u043a\u0438\u0439 <code>index.html<\/code>:<\/p>\n<pre><code>   &lt;title&gt;Mini App&lt;\/title&gt;   &lt;style&gt;     :root {       --bg-color: var(--tg-theme-bg-color, #ffffff);       --text-color: var(--tg-theme-text-color, #000000);       --accent-color: var(--tg-theme-button-color, #0088cc);     }      * {       margin: 0;       padding: 0;       box-sizing: border-box;     }      body {       background: var(--bg-color);       color: var(--text-color);       font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;       text-align: center;     }      .warn {       background: var(--bg-color);       color: var(--text-color);       padding: 40px 20px;       display: none;       height: 100vh;       width: 100vw;       flex-direction: column;       align-items: center;       justify-content: center;     }      .warn img {       width: 120px;       height: 120px;       margin-bottom: 20px;       animation: float 2s ease-in-out infinite;     }      @keyframes float {       0% { transform: translateY(0px); }       50% { transform: translateY(-10px); }       100% { transform: translateY(0px); }     }      .warn p {       font-size: 18px;       margin: 8px 0;     }      .main {       display: none;       padding: 20px;     }      .btn {       padding: 12px 24px;       font-size: 16px;       border: none;       border-radius: 5px;       background: var(--accent-color);       color: var(--tg-theme-button-text-color, #ffffff);       cursor: pointer;       margin-top: 20px;     }   &lt;\/style&gt;     &lt;div id=\"notInTelegram\" class=\"warn\"&gt;     &lt;img alt=\"TLogo\" src=\"https:\/\/telegram.org\/img\/t_logo.png\"&gt;     &lt;p&gt;&lt;strong&gt;\u0423\u043f\u0441!&lt;\/strong&gt;&lt;\/p&gt;     &lt;p&gt;\u042d\u0442\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0434\u043e\u043b\u0436\u043d\u043e \u0431\u044b\u0442\u044c \u0437\u0430\u043f\u0443\u0449\u0435\u043d\u043e &lt;strong&gt;\u0432\u043d\u0443\u0442\u0440\u0438 Telegram!&lt;\/strong&gt;&lt;\/p&gt;   &lt;\/div&gt;    &lt;div id=\"mainApp\" class=\"main\"&gt;     &lt;h1&gt;\u041f\u0440\u0438\u0432\u0435\u0442 \u0438\u0437 Mini App \ud83d\udc4b&lt;\/h1&gt;     &lt;p&gt;MiniApp \u0443\u0441\u043f\u0435\u0448\u043d\u043e \u043e\u0442\u043a\u0440\u044b\u0442 \u0432 Telegram!&lt;\/p&gt;     &lt;button id=\"actionBtn\" class=\"btn\"&gt;\u041f\u0440\u043e\u0434\u043e\u043b\u0436\u0438\u0442\u044c&lt;\/button&gt;   &lt;\/div&gt; <\/code><\/pre>\n<p>\u0422\u0430\u043a\u043e\u0439 \u0448\u0430\u0431\u043b\u043e\u043d \u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0432 \u043a\u0430\u0436\u0434\u043e\u043c Mini App, \u0447\u0442\u043e\u0431\u044b \u0438\u0441\u043a\u043b\u044e\u0447\u0438\u0442\u044c \u043e\u0448\u0438\u0431\u043a\u0438 \u043f\u0440\u0438 \u043e\u0442\u043a\u0440\u044b\u0442\u0438\u0438 \u0447\u0435\u0440\u0435\u0437 \u0431\u0440\u0430\u0443\u0437\u0435\u0440. Telegram \u043d\u0435 \u043f\u0435\u0440\u0435\u0434\u0430\u0451\u0442 \u0434\u0430\u043d\u043d\u044b\u0435, \u0435\u0441\u043b\u0438 Web App \u043d\u0435 \u0431\u044b\u043b \u043e\u0442\u043a\u0440\u044b\u0442 \u043f\u043e \u043a\u043d\u043e\u043f\u043a\u0435.  \u041c\u044b \u0441\u0440\u0430\u0437\u0443 \u043f\u043e\u043a\u0430\u0436\u0435\u043c \u043e\u0431 \u044d\u0442\u043e\u043c \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0435.<\/p>\n<h4>\u0427\u0442\u043e \u0442\u0443\u0442 \u0432\u0430\u0436\u043d\u043e:<\/h4>\n<ul>\n<li>\n<p><code>!tg ||<\/code><\/p>\n<\/li>\n<\/ul>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[],"tags":[],"class_list":["post-470176","post","type-post","status-publish","format-standard","hentry"],"_links":{"self":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/470176","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=470176"}],"version-history":[{"count":0,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/470176\/revisions"}],"wp:attachment":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=470176"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=470176"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=470176"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}