Как связать форму с сайта с телеграмм

Вначале необходимо создать своего бота в telegramm. Делается это достаточно просто. В поиске наберите @botfather, откройте родительского бота и нажмите «Start»:

Далее:

• Пишем команду /newbot, для создания нового бота.
• Вначале придумываем уникальное имя для бота. Пример: «example_bot_for_me».
• После вводим ник бота. Можно просто добавить слово «bot» в конец уникального имени( которое вы писали в предыдущем пункте). Пример: «example_bot_for_me_bot».

Если все прошло успешно, то увидите сообщение поздравление, содержащее токен бота (он понадобится нам позже), в моем случае это:

«1988194324:AAF9fRZYC-A_1FLYeQa-ZZ-7KZTaXntIgRU«

Затем ищем своего бота в поиске, указав его ник и нажать кнопку «Запустить» или «Start» для активации нашего бота. В моем случае ник @example_bot_for_me_bot.

Далее нам необходимо создать чат и добавить в него нашего бота. В данный чат будут приходить письма с формы сайта, либо добавляем бота в уже имеющуюся группу.

Для создания группы слева вверху жмем на бургер и в открывшемся меню выбираем пункт Создать группу. В появившемся окне придумываем название для группы. Например: «Заявки с сайта example.сайт».

Жмем кнопку далее и в появившемся списку в поиске вводим название нашего бота. Выбираем бота и жмем создать группу.

После создания группы необходимо узнать ее id.

Способ 1 (в случае если добавляете в уже существующую группу).

Через бота @myidbot.

Добавляем в чат этого бота. И пишем команду: /getgroupid

Подробнее о боте https://ru.botostore.com/c/myidbot/

Способ 2 (если добавляете бота в новую группу).

В браузере набираем адрес:

https://api.telegram.org/botXXXXXXXXXXXXXXXXXXXXXXX/getUpdates

Заменяем X на id нашего бота который мы получили при создании бота (в нашем случае это «1988194324:AAF9fRZYC-A_1FLYeQa-ZZ-7KZTaXntIgRU» ).

Полный адрес получился:

https://api.telegram.org/bot1988194324:AAF9fRZYC-A_1FLYeQa-ZZ-7KZTaXntIgRU /getUpdates

На странице появится текст из которого нам необходимо взять id группы, который начинается со знака минус. В нашем случае это: «-544489534». Данный id нам понадобится в обработчике формы php.

Создание простой формы для сайта.

В файле index.html добавим форму:

<form class="consultation__form">
    <input type="text" name="name" placeholder="Ваше имя*" required>
    <input type="tel" name="phone" placeholder="Ваш телефон*" required>
    <textarea name="question" placeholder="Сообщение" required></textarea>
    <input type="submit" value="Получить консультацию">
</form>

Затем добавим script для обработки формы (либо в index.html либо в js файл, но без тега script):

<script>
    const siteForm = document.querySelector('.consultation__form');
    siteForm.addEventListener('submit',async (e) => {
        e.preventDefault();
        const item = e.target;
        const submitBtn =  item.querySelector('input[type=submit]');
        submitBtn.setAttribute('disabled', 'true');

        let response = await fetch('/send.php', {
            method: 'POST',
            body: new FormData(item)
        })
            .then(data => {
                item.reset();
            })
            .catch((error) => console.log("ошибка!", error))
            .finally(() => {
                submitBtn.removeAttribute('disabled');
            });
    })
</script>

Затем добавим php обработчик формы. Для этого создадим в корне сайта файл send.php и добавим следующий код:

<?php
if ($_SERVER['REQUEST_METHOD'] != 'POST') {
    exit();
}

// Ваш сайт
$site = 'example.сайт';
// Тема письма
$subject = 'Заявка с сайта '.$site.'!';
// От кого
$from = 'form@'.$site;
// Кому
$to = 'info@'.$site;

//В переменную $token нужно вставить id вашего бота
$token = "1988194324:AAF9fRZYC-A_1FLYeQa-ZZ-7KZTaXntIgRU";
//В chat_id вставляем id группы
$chat_id = "-544489534";

var_dump($_POST);
if ( ! empty( $_POST ) ) {
    $name  = htmlspecialchars($_POST['name']);
    $phone  = htmlspecialchars($_POST['phone']);
    $question  = htmlspecialchars($_POST['question']);

    // Тело сообщения для отправки по почте
    $message = "Имя клиента: $name \r\n";
    $message .= "Телефон клиента: $phone \r\n";
    $message .= "Сообщение: $question";

    //Тело сообщения для отправки в телеграмм
    $txt = "Имя клиента: $name %0A";
    $txt .= "Телефон клиента: $phone %0A";
    $txt .= "Сообщение: $question";

    try {
        $headers = 'From: form@'.$site."\r\n".
                'X-Mailer: PHP/' . phpversion();

        //Передаем сообщение по почте
		$mail = mail( $to, $subject, $message, $headers );

        //Передаем сообщение в телеграмм
        $sendToTelegram = fopen("https://api.telegram.org/bot{$token}/sendMessage?chat_id={$chat_id}&parse_mode=html&text={$txt}","r");

        if ( $mail && $sendToTelegram ) {
            echo json_encode('Спасибо! Ваша заявка принята. Мы свяжемся с вами в ближайшее время.');
        } else {
            echo json_encode('Ошибка отправки!');
        }

        die();

    } catch (Exception $e) {
        echo json_encode("Ошибка: $e->getMessage()");
    }
} else {
    echo json_encode("Тело сообщения пустое");
}
?>

Данный файл send.php отправляет письмо на почту и в телеграмм (не забудьте заменить данные на свои).

В результате в телеграмм приходит следующее сообщение:

Ошибки

{«ok»:true,»result»:[]}

Если после ввода в строку бразера https://api.telegram.org/bot<token>/getUpdates вы получаете ответ {«ok»:true,»result»:[]} — это значит что бот работает и сообщения бот получает, но результат пустой.

Решение

1. Заходите в telegram в ваш бот и отключаете его, пишите /stop
2. Затем повторяете запрос https://api.telegram.org/bot/getUpdates
3. Получаете id группы
4. Включаете снова бота /start