Running Telegram Mini app (web app) on localhost [closed]

Question

I a building an application that is to function as a webapp and also as a telegram Miniapp. Telegram miniapp has certain special functionalities or features like the initData ,ie the window.Telegram.WebApp.initData and all available within it. To access these the webapp should be hosted a telegram miniapp, which requires the webapp to be live.

This is not convenient for development and testing purposes.

Is there a way in which i can maybe give my localhost link as the telegram miniapp and run that.

Or what's the best way for testing and development of Telegram miniapps.

Answer 1

This can be done using Ngrok

Reference Video : https://www.youtube.com/live/HewVC6tUC1w?feature=shared&t=466

Steps :

1. Goto ngrok.com and signup.

2. Install and configure ngrok using the steps provided at ngrok dashboard after signup.

3. Install ngrok npm package in your project.

4. Add this to your package.json under scripts

   "ngrok":"ngrok http http://localhost:port-number"

NOTE : Use the port number your application is running on localhost of your system. If your application runs on localhost:3000 use port 3000

5. Start your application on local server npm run dev or npm run start or whatever.
6. Open new terminal in project and Start ngrok npm run ngrok
7. In the ngrok terminal you will see an URL like - https://ee44-103-153-36-62.ngrok-free.app
8. Your localhost is now being forwarded to this url and you can use this url to provide as a Mini App URL in telegram.