Mini App Tester

Giả lập
VI
Thuộc tính
version
—
platform
—
colorScheme
—
isActive
—
isExpanded
—
isFullscreen
—
isOrientationLocked
—
isClosingConfirmation
—
isVerticalSwipes
—
viewportHeight
—
viewportStableH
—
headerColor
—
backgroundColor
—
bottomBarColor
—
initData
initDataUnsafe
Tham số giao diện
bg_color
text_color
hint_color
link_color
button_color
button_text_color
secondary_bg_color
header_bg_color
bottom_bar_bg_color
accent_text_color
section_bg_color
section_header_text_color
section_separator_color
subtitle_text_color
destructive_text_color
WebApp 18
ready()
expand()
close()
sendData()
switchInlineQuery()
setHeaderColor()
setBackgroundColor()
setBottomBarColor()
enableClosingConfirmation()
disableClosingConfirmation()
enableVerticalSwipes()
disableVerticalSwipes()
requestFullscreen()
exitFullscreen()
lockOrientation()
unlockOrientation()
openLink()
openTelegramLink()
isVersionAtLeast()
hideKeyboard()
Nút 4
MainButton
Nhấn nút sẽ kích hoạt sự kiện mainButtonClicked
SecondaryButton
BackButton
BackButton
Nhấn nút sẽ kích hoạt sự kiện backButtonClicked
SettingsButton
SettingsButton
Nhấn nút sẽ kích hoạt sự kiện settingsButtonClicked
Popup & cảnh báo 5
showAlert()
showConfirm()
showPopup()
showScanQrPopup()
readTextFromClipboard()
Phản hồi rung 3
impactOccurred()
notificationOccurred()
selectionChanged()
Lưu trữ đám mây 6
setItem()
getItem()
getKeys()
removeItem()
Lưu trữ thiết bị 4
setItem()
getItem()
removeItem()
clear()
Lưu trữ bảo mật 5
setItem()
getItem()
restoreItem()
removeItem()
clear()
Cảm biến 3
Accelerometer
DeviceOrientation
Gyroscope
Sinh trắc học 5
init()
requestAccess()
authenticate()
updateBiometricToken()
openSettings()
Vị trí 3
LocationManager.init()
LocationManager.getLocation()
LocationManager.openSettings()
Hóa đơn & Story 3
openInvoice()
shareMessage()
Quyền & xác thực 3
requestWriteAccess()
requestContact()
requestChat()
Emoji, màn hình, tệp 5
Home Screen
addToHomeScreen()
checkHomeScreenStatus()
Emoji Status
File Download
Nhật ký sự kiện 0
Đang lắng nghe 45 sự kiện
Chưa có sự kiện nào. Hãy gọi các phương thức ở trên để tạo sự kiện.

Mini App Tester giúp bạn test Telegram Mini App, cụ thể là JavaScript API Telegram.WebApp, mà không cần viết code. Trong trình duyệt thông thường, công cụ chạy ở chế độ mock và giả lập API; khi mở bên trong Telegram, nó dùng API thật của ứng dụng. Hãy thử từng tính năng trước khi tạo Mini App Telegram của riêng bạn.

Cách test Telegram Mini App bằng Mini App Tester

  1. Mở trang này trong bất kỳ trình duyệt nào. Chế độ mock tự khởi động và giả lập Telegram.WebApp.
  2. Mở một trong 13 nhóm phương thức, gọi phương thức và theo dõi kết quả trong nhật ký sự kiện và bảng thuộc tính trực tiếp.
  3. Để test bên trong Telegram, đặt https://telegram-bot-api.info/telegram-mini-app-tester.html làm URL Mini App của một bot trong @BotFather (/newapp hoặc cài đặt menu button). Không cần hosting; giao diện tự đổi theo ngôn ngữ của người dùng.
  4. Mở trên iOS, Android và desktop rồi so sánh version, platform, colorScheme, initData, themeParams và safe area.

Có thể test những gì

Nhật ký ghi lại hơn 45 sự kiện kèm thời gian, chẳng hạn themeChanged, viewportChanged, mainButtonClicked và fullscreenChanged, để bạn thấy chính xác handler của mình sẽ nhận được gì.

Test Telegram Mini App: chế độ mock và Telegram thật

Mini App ban đầu có tên Web App, nên đối tượng API vẫn là Telegram.WebApp. Chế độ mock dùng để test giao diện và luồng xử lý: bạn thấy có những lệnh gọi nào, chúng trả về gì, sự kiện nào phát ra; lưu trữ được giả lập bằng localStorage. Mock không tái hiện được popup gốc, rung hay dữ liệu người dùng thật, và initData chỉ là mẫu chưa được Telegram ký. Bên trong Telegram, tester dùng API thật nên initData là thật — hãy dùng nó để test bước kiểm tra chữ ký HMAC-SHA256 trên server.

Bảo mật

Tester chạy hoàn toàn trong trình duyệt, không cần token bot và không gọi Bot API. Dữ liệu lưu trữ ở chế độ mock nằm trong localStorage của trình duyệt.

Tạo Mini App Telegram: bước tiếp theo

Khi đã nắm rõ API, bạn có thể tạo Mini App Telegram của riêng mình: tạo bot Telegram qua @BotFather, lấy token bot, đưa trang web lên một địa chỉ HTTPS rồi gắn URL bằng /newapp hoặc nút menu. Để gắn nút menu qua API, gọi setChatMenuButton trong Bot API Tester; mọi phương thức đều có trong Swagger và tài liệu tham khảo phương thức. Nút mở Mini App cũng có thể gửi kèm tin nhắn qua bàn phím inline — xem bài API gửi tin nhắn Telegram.

Câu hỏi thường gặp

Làm sao test Telegram Mini App online mà không cần Telegram?

Mở Mini App Tester trong bất kỳ trình duyệt nào. Chế độ mock giả lập Telegram.WebApp, nên bạn có thể gọi phương thức, kích hoạt sự kiện và xem thuộc tính mà không cần bot hay ứng dụng Telegram.

Có thể dùng Mini App Tester làm Mini App cho bot của mình không?

Có. Đặt https://telegram-bot-api.info/telegram-mini-app-tester.html làm URL Mini App trong @BotFather, qua /newapp hoặc phần cài đặt menu button. Bên trong Telegram, tester dùng WebApp API thật và bạn không cần hosting.

Làm sao tạo Mini App Telegram?

Tạo bot qua @BotFather, đưa trang web của bạn lên một địa chỉ HTTPS, rồi gắn URL đó cho bot bằng /newapp (link trực tiếp dạng t.me/<bot>/<app>) hoặc bằng nút menu (trong cài đặt bot hoặc qua setChatMenuButton). Trong trang, hãy nhúng script https://telegram.org/js/telegram-web-app.js để dùng Telegram.WebApp.

Tester hỗ trợ những tính năng nào của Telegram WebApp API?

Các phương thức WebApp cơ bản, MainButton, SecondaryButton, BackButton và SettingsButton, popup, HapticFeedback, CloudStorage, DeviceStorage, SecureStorage, cảm biến, sinh trắc học, vị trí, quyền truy cập, hóa đơn và story, emoji status, toàn màn hình và tải tệp, cùng nhật ký cho hơn 45 sự kiện.

initData trong chế độ mock có hợp lệ không?

Không. Chế độ mock dùng dữ liệu mẫu chưa từng được Telegram ký, nên chắc chắn không vượt qua bước kiểm tra HMAC. Hãy mở tester bên trong Telegram để lấy initData thật khi test phần xác thực phía server.

Có cần token bot để dùng Mini App Tester không?

Không. Trang này hoàn toàn không gọi Bot API. Bạn chỉ cần một bot nếu muốn mở tester bên trong Telegram dưới dạng Mini App.