Tilda и n8n: заявки с формы в Telegram и таблицу за вечер

· 5 мин чтения · Редакция Skill Unit

Типичная ситуация: сайт на Tilda, заявки приходят на почту и теряются среди писем. Хочется, чтобы каждая заявка сразу падала в рабочий чат Telegram и строкой в таблицу, где видно, кто обработал. n8n делает это без программирования: Tilda отправляет данные формы на адрес вебхука, n8n принимает их и раскладывает по сервисам.

В статье — только то, что специфично для Tilda: где включается приёмщик, как Tilda проверяет адрес, в каком виде приходят поля и на чём ломаются первые сценарии. Общую схему приёма заявок с любого сайта мы разбирали отдельно.

Как это устроено

  • В n8n создаётся сценарий с узлом Webhook — у него есть адрес, на который можно отправить данные.
  • В Tilda этот адрес указывается как приёмщик данных Webhook, и форма на странице подключается к нему.
  • Посетитель отправляет форму — Tilda делает POST-запрос на адрес n8n с полями формы.
  • Дальше в n8n: проверка полей, сообщение в Telegram, строка в таблицу. Каждый шаг — отдельный узел.

Шаг 1. Подготовьте вебхук в n8n

Создайте новый сценарий и добавьте узел Webhook. Метод — POST. Путь можно задать понятный, например tilda-lead. Ответ оставьте «сразу» (Respond: Immediately): так n8n отвечает Tilda кодом 200, не дожидаясь, пока отработают Telegram и таблица.

У узла два адреса: тестовый (в нём есть webhook-test) и рабочий (webhook). Тестовый слушает только пока вы нажали «Listen for test event», рабочий — когда сценарий активирован. Самая частая ошибка новичков: в Tilda вставлен тестовый адрес, сценарий закрыт, и заявки уходят в пустоту.

Шаг 2. Включите Webhook в Tilda

  • Откройте «Настройки сайта» → «Формы» → «Webhook».
  • Вставьте адрес вебхука n8n и сохраните. Адрес должен быть на HTTPS — у облачного n8n и у самостоятельной установки с сертификатом это так.
  • Перейдите на страницу с формой, в меню «Контент» блока отметьте сервис приёма данных Webhook.
  • Сохраните и опубликуйте страницу. Без публикации форма продолжит работать по-старому.

Тестовый запрос test=test: не пугайтесь

Сразу после подключения Tilda отправляет на ваш адрес проверочный POST-запрос с единственным полем test=test и ждёт ответ 200 OK. Если в этот момент сценарий не слушает адрес, Tilda покажет ошибку подключения.

Отсюда два правила. Первое: перед подключением в Tilda нажмите в n8n «Listen for test event» или активируйте сценарий с рабочим адресом. Второе: в сценарии сразу после вебхука поставьте узел If, который отсекает запрос без настоящих полей (например, нет поля Phone и нет Email). Иначе в Telegram прилетит пустая «заявка» с текстом test.

Пять секунд и повторы

По справке Tilda адрес должен ответить в течение пяти секунд. Если не ответил, Tilda делает ещё две попытки, каждую через минуту. Поэтому и нужен режим «ответить сразу»: если n8n будет ждать, пока отработает запись в таблицу, медленный ответ может привести к повторной отправке и дублям.

Защита от дублей простая: у каждой заявки Tilda есть поле tranid — уникальный номер заявки (тот же, что в разделе «Заявки» в Tilda). Записывайте его в таблицу отдельным столбцом и перед добавлением строки проверяйте, нет ли уже такого номера.

В каком виде приходят поля

Tilda отправляет данные как обычную форму, а не JSON. В n8n они окажутся в body узла Webhook. Имена полей — те, что заданы в форме: если вы не меняли «имя переменной», они придут с заглавной буквы — Name, Phone, Email. Если задали своё имя переменной, придёт оно.

ПримерПример полей заявки (условные данные)
Name=Иван
Phone=+79990000000
Email=ivan@example.com
Comments=Нужна консультация
tranid=467251:8442970
formid=form48844953

Кроме полей формы приходят tranid (номер заявки) и formid (номер блока, из которого отправили форму). formid полезен, если форм на сайте несколько: по нему в n8n легко разделить «консультацию» и «запись на пробный урок» на разные ветки.

Если в настройках Webhook включена отправка Cookie, придёт ещё поле COOKIES. Когда посетитель пришёл по рекламе с UTM-метками в последние 30 дней, в нём будут и метки — значит, в таблицу можно писать источник заявки.

Шаг 3. Защитите адрес ключом

Адрес вебхука — по сути открытая дверь: любой, кто его узнал, может слать вам «заявки». В настройках приёмщика Tilda можно указать имя и значение ключа API и способ передачи — в заголовках или в теле запроса.

  • В Tilda выберите передачу в заголовках, задайте имя, например X-Tilda-Key, и длинное случайное значение.
  • В n8n в узле Webhook включите аутентификацию Header Auth и создайте учётные данные с тем же именем и значением.
  • Запросы без ключа n8n будет отклонять сам, до запуска сценария.

Шаг 4. Telegram и таблица

Сообщение в Telegram собирайте из полей выражениями, а не одной строкой «всё подряд»: имя, телефон, комментарий, с какой формы, номер заявки. Менеджеру так быстрее понять, кому звонить. Для бота понадобятся токен от @BotFather и id чата, куда он будет писать.

Для таблицы подойдут Google Таблицы или любая таблица, к которой у n8n есть узел. Заведите столбцы заранее: дата, имя, телефон, почта, форма, источник, номер заявки, статус. Статус менеджер меняет руками: «новая», «в работе», «закрыта».

Порядок узлов: Webhook → If (отсечь test и пустые) → проверка дубля по tranid → Telegram → таблица. Если Telegram недоступен, заявка всё равно должна попасть в таблицу: включите у узла Telegram продолжение при ошибке.

Частые ошибки

  • В Tilda стоит тестовый адрес n8n, а сценарий не активирован.
  • Форма на странице не отмечена галочкой Webhook или страница не переопубликована.
  • Сценарий отвечает дольше пяти секунд — появляются повторы и дубли.
  • В Telegram приходит «test» — нет фильтра после вебхука.
  • Поле не находится, потому что в форме имя переменной Phone, а в выражении написано phone.
  • Адрес вебхука не защищён и попал в открытый доступ.

Про персональные данные

Имя, телефон и почта из формы — персональные данные. На сайте нужна согласованная с ними политика и согласие посетителя, а если сценарий передаёт данные в сервисы с серверами за рубежом, это отдельный вопрос трансграничной передачи. Проверьте актуальную редакцию 152-ФЗ и при сомнениях обсудите схему с юристом.

Что дальше

Когда заявки идут стабильно, следующий шаг — обработка: ИИ сортирует заявки по теме, сценарий напоминает менеджеру о необработанных, раз в день приходит сводка. Всё это — те же узлы n8n, только больше. В курсе «Автоматизация без кода на n8n» мы собираем такой конвейер заявок по шагам, с проверкой каждого этапа.

Хотите пройти путь на практике?

Курс «Автоматизация без кода на n8n»: короткие уроки, практические задания и проверка ответов. Первый урок бесплатно.

Смотреть курс