Vue 3 Component for Telegram Login

Vue3 Telegram Login

Base on vue-telegram-login, thanks @vchaptsev


Install with yarn:

$ yarn add vue3-telegram-login

Install with npm:

$ npm i vue3-telegram-login --save


Import telegram-login-temp, pass it to the components and use in your template

  <!-- Callback mode -->
  <span v-if="!isLoaded">Loading...</span>

  <!-- Redirect mode -->

<script setup>
import { telegramLoginTemp } from 'vue3-telegram-login'
import { ref } from 'vue'

const isLoaded = ref(false)

function telegramLoadedCallbackFunc () {
  console.log('script is loaded')
  isLoaded.value = true

function yourCallbackFunction (user) {
  // gets user as an input
  // id, first_name, last_name, username,
  // photo_url, auth_date and hash


You can play around with options on the official widget page

mode'callback' or 'redirect'Truenull
telegramLoginYour telegram bot nameTruenull
@callbackYour callback function, it will be called after success if mode is 'callback'Falsetrue
@loadedTelegram script loaded callback functionFalsenull
redirectUrlYour redirect URL, user will be redirected if mode is 'redirect'Falsenull
requestAccess'write' if you want to get access to send messages from your botFalse'read'
size'large', 'medium' or 'small'False'large'
userpicShow user photo, true or falseFalsetrue
radiusButton corner radius (default depends on chosen size)False20\14\10


  1. You need to set domain to your bot if you want to user Telagram Login (/setdomain command to @BotFather)
  2. You need to verify the authentication and the integrity of the data received by comparing the received hash parameter with the hexadecimal representation of the HMAC-SHA-256 signature of the data-check-string with the SHA256 hash of the bot's token used as a secret key (source).
    You can find some code samples on this page.
  3. Don't disable third party cookies if you want to use Telegram Login as a User (thanks @robverhoef)

Download Details:
Author: cinob
Download Link: Download The Source Code
Official Website:
License: MIT

#vue #telegram 

Vue 3 Component for Telegram Login
1 Likes49.65 GEEK