Как написать Телеграм-бота на JavaScript
- 27 апреля 2020
Сегодня будем делать бота — это отличное (и быстрое) занятие, которое развивает уставший мозг и даёт возможность отправить друзьям ссылочку со словами «Смотри, это моё».
Вторая часть: загружаем бота на сервер и запускаем его
Для работы понадобятся
- Редактор кода, чтобы писать код. Если не знаете, какой выбрать — мы уже рассказывали. Если не умеете писать код, то вот инструкция, как его написать и запустить.
- Node.js любой версии, выше 0.12. Нужно, чтобы библиотека для ботов заработала. Как установить Node.js.
- Консоль. Или встроенный в систему вариант, или какой-нибудь другой.
- VPN. Возможно, но не факт, потому что Телеграм работает не везде.
Шаг 1. Регистрируем бота
Находим в поиске Телеграма бота @botFather — это главный инструмент для создания ботов. Набираем в нём /newbot
.
Придумываем название и имя боту. Название — то, как он будет подписан в списке контактов. Имя — строка, по которой его можно будет найти. Обратите внимание, что имя должно оканчиваться на bot
. В ответ мы получим токен — длинную последовательность символов, которая пригодится нам в будущем. Мы назвали бота echoKeksBot
, но вам придётся придумать другое название, потому что это уже занято. Извините.
Шаг 2. Создаём проект
Создаем папку в любом месте и открываем её в консоли. Там пишем npm init -y
— эта команда создаст файл package.json
, который выглядит примерно так:
Теперь установим node-telegram-bot-api — это библиотека для создания телеграм-ботов на Node.js. Введём команду:
npm install --save --save-exact node-telegram-bot-api
Создадим пустой файл index.js
и напишем там самого простого бота, который будет отвечать на любое сообщение:
bot.on('message', (msg) => {
const chatId = msg.chat.id;
bot.sendMessage(chatId, 'Привет, Друг!');
});
Шаг 3. Запускаем бота
Тут всё просто, в консоли пишем node index.js
, заходим к нашему боту в телеграм и начинаем с ним общаться. Не закрывайте консоль — бот работает только на вашем компьютере, и без консоли он не станет отвечать.
Как видим, бот успешно отвечает. Но бот-повторяха — не интересно, усложним задачу. Пусть бот присылает нам картинку.
Шаг 4. Отсылаем картинку
Добавим картинку с Кексом в папку с проектом. Для отправки изображения используем метод .sendPhoto()
— передадим в него id
чата и путь до картинки. Получится такой код:
bot.on('message', (msg) => {
const chatId = msg.chat.id;
bot.sendPhoto(chatId, 'keks.png');
});
Запускаем бота, проверяем, работает:
Шаг 5. Добавим клавиатуру. И пёсика
Добавим фотографию милого пёсика в корень проекта. Теперь там две картинки.
Создадим конфигурацию для клавиатуры в боте, пусть у нас будет 3 кнопки: «Хочу кота», «Хочу пёсика» и «Пойти учиться».
// Конфиг клавиатуры
const keyboard = [
[
{
text: 'Хочу кота', // текст на кнопке
callback_data: 'moreKeks' // данные для обработчика событий
}
],
[
{
text: 'Хочу песика',
callback_data: 'morePes'
}
],
[
{
text: 'Хочу проходить курсы',
url: 'https://htmlacademy.ru/courses' //внешняя ссылка
}
]
];
На нажатия первых двух кнопок мы ответим соответствующим сообщением в Телеграме, а последняя уведёт на внешний ресурс.
Чтобы отличить первые 2 кнопки, воспользуемся полем callback_data
, где будем передавать тип кнопки. Для обработки нажатий добавим слушателя на событие callback_query
, и в зависимости от значения query.data
отправим нужную картинку к пользователю.
// Обработчик нажатий на клавиатуру
bot.on('callback_query', (query) => {
const chatId = query.message.chat.id;
let img = '';
if (query.data === 'moreKeks') { // если кот
img = 'keks.png';
}
if (query.data === 'morePes') { // если пёс
img = 'pes.png';
}
if (img) {
bot.sendPhoto(chatId, img, { // прикрутим клаву
reply_markup: {
inline_keyboard: keyboard
}
});
} else {
bot.sendMessage(chatId, 'Непонятно, давай попробуем ещё раз?', {
// прикрутим клаву
reply_markup: {
inline_keyboard: keyboard
}
});
}
});
Не забудем про возможные ошибки и предложим пользователю попробовать снова, если он ввёл что-то не то. Перезапустим бота и проверим — всё работает. Главное — не закрывать консоль, иначе бот перестанет отвечать.
Полный файл с кодом: index.js.
В следующей части как раз разберёмся, как загрузить и запустить бота на сервере, чтобы он работал, даже если ваш компьютер выключен.
«Доктайп» — журнал о фронтенде. Читайте, слушайте и учитесь с нами.
Читать дальше
Ошибка JavaScript «Uncaught TypeError: Cannot read property of undefined». Что делать?
Описание проблемы
Эта ошибка возникает, когда вы пытаетесь получить доступ к свойству объекта, который в данный момент имеет значение undefined
. Например:
let obj = undefined;
console.log(obj.property); // Uncaught TypeError: Cannot read property 'property' of undefined
Возможные причины
- Объект не был инициализирован. Возможно, переменная еще не была объявлена или ей не присвоено значение.
- Неправильный путь к данным. Вы пытаетесь обратиться к свойству объекта, но объект отсутствует в цепочке.
- Асинхронность. Данные могли еще не загрузиться или быть доступны в момент обращения.
- Опечатка в названии свойства. Вы могли неверно написать имя свойства объекта.
Шаги по исправлению
1. Проверка объекта перед доступом к свойствам
Убедитесь, что объект существует, прежде чем пытаться получить его свойства.
if (obj !== undefined && obj !== null) {
console.log(obj.property);
}
// Или современный способ:
console.log(obj?.property); // Вернет undefined, если obj равен null или undefined
2. Инициализация объекта перед использованием
Если переменная должна содержать объект, убедитесь, что он инициализирован.
Неверный код:
let data;
console.log(data.user.name); // Ошибка
Исправление:
let data = { user: { name: "Иван" } };
console.log(data.user.name); // "Иван"
3. Проверка API или данных с сервера
Если данные загружаются с сервера, добавьте проверку, что ответ корректен.
fetch('https://api.example.com/data')
.then(response => response.json())
.then(data => {
if (data?.user?.name) {
console.log(data.user.name);
} else {
console.error('Данные пользователя отсутствуют');
}
});
4. Использование значений по умолчанию
Для предотвращения ошибок можно задавать значения по умолчанию.
let user = undefined;
let userName = user?.name || "Гость";
console.log(userName); // "Гость"
5. Отладка с помощью console.log
Проверяйте промежуточные значения переменных в консоли браузера.
console.log(obj); // Убедитесь, что объект определен
Пример из жизни
Вы пишете код для отображения имени пользователя из объекта user
:
let user = null; // Данные еще не загружены
console.log(user.name); // Uncaught TypeError: Cannot read property 'name' of null
Исправление:
let user = null;
console.log(user?.name || "Имя пользователя не найдено"); // "Имя пользователя не найдено"
Итог
Следуя этим рекомендациям, вы сможете избежать ошибок, связанных с доступом к свойствам undefined
или null
. Если ошибка продолжает появляться, убедитесь, что данные корректно загружаются, и используйте инструменты отладки.
- 15 ноября 2024
Как исправить ошибку JavaScript «Uncaught ReferenceError: variable is not defined»
Эта ошибка возникает, когда вы пытаетесь обратиться к переменной, которая не была объявлена в текущей области видимости. Например:
console.log(myVariable); // Uncaught ReferenceError: myVariable is not defined
Возможные причины
- Вы пытаетесь обратиться к переменной до ее объявления.
- Переменная объявлена внутри функции и недоступна за ее пределами.
- Ошибка в написании имени переменной (опечатка).
Шаги по исправлению
1. Проверка объявления переменной
Убедитесь, что переменная объявлена перед ее использованием.
Неверный код:
console.log(myVariable); // Ошибка
Исправление:
let myVariable = 10;
console.log(myVariable); // 10
2. Правильное определение области видимости переменной
Если переменная объявлена внутри функции, она недоступна за ее пределами.
Неверный код:
function myFunction() {
let localVariable = "Привет";
}
console.log(localVariable); // Ошибка
Исправление:
function myFunction() {
let localVariable = "Привет";
console.log(localVariable); // "Привет"
}
myFunction();
3. Использование глобальных переменных
Если переменная должна быть доступна везде, объявляйте ее глобально (но избегайте этого, если возможно).
let globalVariable = "Глобальная переменная";
function showVariable() {
console.log(globalVariable);
}
showVariable(); // "Глобальная переменная"
4. Проверка имени переменной на ошибки
Проверьте, нет ли опечаток в имени переменной.
Неверный код:
let myVariable = "Данные";
console.log(myVarible); // Ошибка
Исправление:
let myVariable = "Данные";
console.log(myVariable); // "Данные"
5. Использование typeof
для проверки существования переменной
Вы можете использовать оператор typeof
, чтобы проверить, объявлена ли переменная.
if (typeof myVariable !== "undefined") {
console.log(myVariable);
} else {
console.log("Переменная не определена");
}
Пример из жизни
Вы пишете функцию для проверки данных пользователя:
function checkUser() {
if (userName) {
console.log(`Добро пожаловать, ${userName}!`);
}
}
checkUser(); // Ошибка: userName не определен
Исправление:
let userName = "Иван";
function checkUser() {
if (userName) {
console.log(`Добро пожаловать, ${userName}!`);
}
}
checkUser(); // "Добро пожаловать, Иван!"
Итог
Эта ошибка часто возникает из-за опечаток или неверной области видимости. Убедитесь, что переменные объявлены и доступны в нужных местах. Если необходимо, используйте typeof
для проверки их существования.
- 15 ноября 2024
Как исправить ошибку JavaScript «Uncaught TypeError: Cannot set property of undefined»
Эта ошибка возникает, когда вы пытаетесь присвоить значение свойству объекта, который не существует (имеет значение undefined
или null
). Например:
let obj;
obj.property = "value"; // Uncaught TypeError: Cannot set property 'property' of undefined
Возможные причины
- Объект не был инициализирован.
- Вы обращаетесь к объекту, который уже удален или еще не создан.
- Ошибка в цепочке данных, например, промежуточное свойство объекта равно
undefined
.
Шаги по исправлению
1. Инициализация объекта перед использованием
Убедитесь, что объект объявлен и инициализирован перед тем, как вы присваиваете его свойствам значения. Неверный код:
let obj;
obj.property = "value"; // Ошибка
Исправление:
let obj = {};
obj.property = "value"; // Работает
2. Проверка существования объекта перед доступом
Проверяйте объект на null
или undefined
, чтобы избежать ошибок. Пример:
let obj;
if (obj) {
obj.property = "value";
} else {
console.log("Объект не определен");
}
3. Использование опциональной цепочки
Если ошибка возникает в глубоко вложенных объектах, используйте опциональную цепочку. Пример:
let obj;
obj?.nestedProperty?.subProperty = "value"; // Не вызовет ошибку
4. Проверка асинхронных данных
Если объект формируется после загрузки данных, убедитесь, что данные доступны перед их использованием.
let obj;
setTimeout(() => {
obj = { property: "value" };
console.log(obj.property); // Работает
}, 1000);
// Нельзя обращаться к obj до инициализации:
console.log(obj.property); // Ошибка
Пример из жизни
Вы загружаете данные пользователя с сервера и пытаетесь установить свойство объекта:
let user;
user.name = "Иван"; // Ошибка
Исправление:
let user = {};
user.name = "Иван"; // Работает
Итог
Чтобы избежать ошибки «Cannot set property of undefined», убедитесь, что объект существует и инициализирован. Используйте проверки на null
, опциональную цепочку или инициализируйте объект перед работой с его свойствами.
- 15 ноября 2024
Как исправить ошибку JavaScript «Uncaught SyntaxError: Unexpected token»
Эта ошибка возникает, когда интерпретатор JavaScript сталкивается с неожиданным токеном (символом) в коде, который нарушает синтаксические правила. Например:
let obj = { key: "value", }; // Uncaught SyntaxError: Unexpected token }
Возможные причины
- Лишние или пропущенные символы, такие как запятые, точки с запятой, кавычки или скобки.
- Неправильное использование синтаксиса, например, забытые конструкции или операторы.
- Смешение разных типов кавычек (например, двойных и одинарных) без соблюдения правил их вложенности.
Шаги по исправлению
1. Проверка корректности синтаксиса
Убедитесь, что все запятые, точки с запятой и кавычки находятся на своих местах. Неверный код:
let obj = { key: "value", }; // Лишняя запятая
Исправление:
let obj = { key: "value" }; // Правильный синтаксис
2. Проверка закрытия скобок
Проверьте, закрыты ли все фигурные, круглые и квадратные скобки. Неверный код:
if (true {
console.log("Ошибка!");
}
Исправление:
if (true) {
console.log("Исправлено!");
}
3. Проверка типов кавычек
Не смешивайте одинарные и двойные кавычки. Неверный код:
let str = "Привет'; // Ошибка
Исправление:
let str = "Привет"; // Или let str = 'Привет';
4. Использование отладчика
Откройте консоль браузера или отладчик в вашей IDE, чтобы найти строку с ошибкой. Она будет указана в сообщении об ошибке.
// В консоли может быть указано:
Uncaught SyntaxError: Unexpected token } at script.js:10
Исправьте строку, где произошла ошибка.
5. Проверка работы кода в строгом режиме
Добавьте "use strict";
в начало вашего файла или функции, чтобы браузер проверял ваш код на соответствие строгому синтаксису.
"use strict";
let obj = { key: "value" };
console.log(obj);
Пример из жизни
Вы пытаетесь использовать стрелочную функцию, но забыли закрыть скобки:
const add = (a, b => {
return a + b;
};
Исправление:
const add = (a, b) => {
return a + b;
};
Итог
Чтобы избежать ошибок «Unexpected token», всегда проверяйте синтаксис вашего кода на наличие лишних или пропущенных символов, используйте инструменты отладки и следите за правильным использованием конструкций JavaScript.
- 15 ноября 2024
300кк в наносекунду
Игра, где нужно забрать своё и продержаться ещё один день.
- 7 марта 2024
9 книг по JavaScript для начинающих в 2024
Все вокруг говорят, что книги — прошлый век. Но вовремя прочитанная хорошая книжка может здорово помочь в изучении нового языка или технологии, а то и вообще целиком объяснить какую-нибудь важную штуку. Например, какие бывают алгоритмы, или зачем нужен рефакторинг. К тому же, хоть фреймворки меняются каждый год, основы обычно долго не меняются.
Мы опросили знакомых разработчиков, узнали, что читают они сами, и предлагаем вам подборку хороших книг по JavaScript.
- 6 марта 2024
Объект URL в JavaScript: полный разбор
Объект URL
в JavaScript представляет URL-адрес и предоставляет удобные методы для работы с ним. Он позволяет анализировать, конструировать и декодировать URL-адреса.
Создать объект URL
можно двумя способами:
Конструктор URL()
— самый распространённый способ, в котором вы передаёте любой URL в виде строки в качестве аргумента.
const url = new URL("https://www.example.com/path?query=123#hash");
Использование window.location
— это глобальный объект в браузерах, который содержит информацию о текущем URL.
const currentUrl = new URL(window.location.href);
- 23 января 2024
Генерация QR-кодов на JS в 4 шага. Node.js + qrcode
Давайте сделаем простой REST API на Node.js и Express, который будет генерировать QR-коды для любой ссылки. Если у вас ещё не установлены Node.js
и npm
, установите их с официального сайта.
- 22 ноября 2023
ChatGPT не справляется
Притворитесь нейросетью и решите 101 задачку по JavaScript как можно быстрее.
- 2 ноября 2023
Знакомство с JavaScript
Теперь, когда вы знаете, как создать структуру веб-страницы с помощью HTML и оформить ее стилями с помощью CSS, пришло время оживить её с помощью JavaScript (JS). JavaScript — это мощный язык программирования, который используется для создания интерактивных и динамических веб-сайтов.
Вы можете добавить JavaScript в ваш HTML-документ двумя способами:
Встроенный JavaScript: непосредственно в HTML-документ, в тегах <script>
:
<script>
alert("Привет, мир!");
</script>
Внешний JavaScript: подключение внешнего .js
файла к HTML-документу:
<script src="script.js"></script>
- 1 ноября 2023