Installation

# Yarn
yarn add vue-telegram-plugin

# Npm
npm install vue-telegram-plugin

Usage

Prepare tdweb library

This plugin using tdweb (Telegram Data Libraty - TDLib in browser), so after installing you have to make all tdweb's files loadable from your server. For example you can copy all file in vue-telegram-plugin/lib folder into the server's public folder.

cp -r node_modules/vue-telegram-plugin/lib/* public/

Create your Telegram Application

For using telegram API you must register an application. You could easily create application at https://my.telegram.org/apps

Loading the plugin

import Vue from 'vue'
import VueTelegram from 'vue-telegram-plugin'

Vue.use(VueTelgram, options)

Available options

Name | Data Type | Descroption --------------------- | ----------- | ----------- useTestDC | Boolean | If set to true, the Telegram test environment will be used instead of the production environment. Default: true logVerbosityLevel | Number | The initial verbosity level for the TDLib internal logging (0-1023). Default: 1 jsLogVerbosityLevel | Number | The initial verbosity level of the JavaScript part of the code. Default: 3 useDatabase | Boolean | Default: false. If set to true, the library will maintain a cache of users, basic groups, supergroups, channels and secret chats. apiId | String(required) | Application identifier for Telegram API access, which can be obtained at https://my.telegram.org. apiHash | String(required) | Application identifier hash for Telegram API access, which can be obtained at https://my.telegram.org. system_language_code| String | IETF language tag of the user's operating system language. Default en database_directory | String | The path to the directory for the persistent database. Default: /telegramdb

Available methods

Methods that are register on vue $vTelegram instance. For first, call init method to initialize telegram service.

Vue.$vTelegram.init()

Method | Params | Descroption ------------------------- | ----------------------------------- | ----------- init | | Initialize telegram service login | phoneNumber(String) | Login with phone number confirmVerificationCode | verificationCode(String) | Confirm the verification code getMe | | Get logged user information searchChats | {   query(String),   limit(Number)} | Search chat's title match query with limit results sendMessage | {   chatId(String),   message(String) } | Send message to chat with chatId logout | | Logout user

Available events

Events that are emmited on the vue $vTelegramBus instance (Event Bus).

// Listening an event.
Vue.$vTelegramBus.on(event, () => {})

// Remove one or move event.
Vue.$vTelegramBus.off(event, () => {})

// Listen for the given event once.
Vue.$vTelegramBus.once(event, () => {})

// Emit an event.
Vue.$vTelegramBus.once(event, ...args)

Event | Argurments | Descroption ----------------------------------- | ----------------------------------- | ----------- authorizationStateWaitPhoneNumber | | Telegram need the user's phone number to authorize. Call $vTelegram.login method to provice the phone number. authorizationStateWaitCode | | Telegram need the the user's authentication code to authorize. Call $vTelegram.confirmVerificationCode method to provice the authenticateion code. authorizationStateReady | | The user has been successfully authorized. VueTelegram is now ready to use such as $vTelegram.getMe() ...

Auth component

If you don't want to create your auth component you can use VueTelegramAuth that registered global. This component is a dialog contain phone and verification code submit's form to authenticate user. Simple to use no parameters required. To use the component, you have to install ElementUI

<VueTelegramAuth />