Is there any way to pass parameter to the telegram web app direct link?

Question

I have registered a web app which is launched by the direct link, the link format is like this:

https://t.me/botusername/appname

This link can open a fixed url as configured using the bot father, but i want to pass some parameters to it, for example: https://t.me/botusername/appname?someId=id

In the documentation(ref), I can find this method, which lets you pass param and get it from start_param field : https://t.me/botusername/appname?startapp=command

But this works only for web apps launched via attachment menu. And normal web apps can not be launched via attachment menu, It says:

Attachment menu integration is currently only available for major advertisers on the Telegram Ad Platform. However, all bots can use it in the test server environment.

Can anyone help in this regard, I want to open a dynamic route of my web app, and i thought It is possible with start_param.

Rosalia

Answer 1

After spending some time on this, I found these solutions:

1. If you are not using direct link and your bot is not supposed to send links in a telegram group, i.e used only in its private chat, then you can use inline keyboard option and add a web_app: web_link_with_params. It will be opened as twa. Note: The link should be the website url not direct twa link.

2. If you are using direct link then you can pass startapp param, you can get this parameter in start_param field and in the GET parameter tgWebAppStartParam.

Eg: For web apps:

Web app direct link: https://t.me/botusername/appname?startapp=someParamValue

let startParam = window.Telegram.WebApp.initDataUnsafe.start_param

Note: You can pass only one param and the length of its value is limited to 64 Symbols as of now. So, if you want to handle redirect, you need to have your own logic using that value.

Rosalia

Answer 2

I also faced the same problem. So I decided to go the same way as the previous answer. However, since I am using React, I installed @telegram-apps/sdk-react.

Following the doc

Now you can import it like this:

import { useLaunchParams } from "@telegram-apps/sdk-react";

Then you can use this hook like this:

const lp = useLaunchParams();

Your start parameters and all others will be available in the lp object. You can access your start parameters here: lp.startParam.

BTW, in order to send a few parameters, I decided to split them with __, so my link now looks like this:

https://t.me/botusername/appname?startapp=param1value__param2value__param3value

Then I just split it using JavaScript:

const [param1, param2, param3] = lp.startParam.split("__");

Aphoristic