mini apps

connect telegram mini apps to a yaebal bot through web app buttons, backend validation, and bot api callbacks.

open a mini app

inline keyboards can open a web app url inside telegram. use https in production.

button.ts

await ctx.reply("open the app", {
  reply_markup: new InlineKeyboard().webApp("open", "https://app.example.com"),
});

send from your backend

a mini app usually talks to your web backend. after validating the request, that backend can use the bot api to message the user or update bot-side state.

backend.ts

// backend endpoint called by your mini app
export async function handleMiniAppAction(userId: number, action: string) {
  await bot.api.call("sendMessage", {
    chat_id: userId,
    text: "action received: " + action,
  });
}

web app data messages

if the mini app sends data back through telegram, it arrives as a message service field.

web-app-data.ts

bot.on("message", async (ctx) => {
  const data = ctx.message?.web_app_data;
  if (!data) return;

  await ctx.reply("mini app sent: " + data.data);
});

security checklist

validate telegram init data on your backend before trusting user identity.
do not put bot tokens in the mini app frontend.
treat web_app_data.data as untrusted input.
use short-lived server-side state for checkout or privileged actions.
log only safe user ids and action names, not full init data strings.