Бипуим: Документация
8-800-505-24-05Сайт Бипиум
  • 😎Отвечаем на ваши вопросы
  • 🎂Версии и обновления
  • ❗Обновление до версии 2.0
  • Документация
    • 🆕С чего начать
      • Регистрация и вход
      • Создаем каталоги и записи
      • Формируем отчёты
      • Настраиваем правовую политику
      • Применяем автоматизации
    • ⚙️Конструктор данных
      • Отделы
      • Каталоги
        • Редактирование структуры
        • Настройка отображения
        • Поиск и фильтрация
        • Импорт записей
          • 📗Импорт из Excel
        • Экспорт записей
        • Активность
      • Системные каталоги
        • Сотрудники
        • События
        • Внешние запросы
        • Сценарии
        • Процессы
        • Доступ к сервисам
        • Вебхуки
      • Виды
      • Записи
    • 📊Отчеты
      • Графики
    • 🔑Права
      • Правила
      • Привилегии
      • Правовые группы
      • Правовые виды
      • Права на поля
      • Комбинация прав
    • 🤖Автоматизации
      • События
        • Изменение данных
        • Внешние запросы
      • Сценарии
        • Компоненты
          • Начало процесса
          • Конец процесса
          • Таймер
          • Ошибка
          • Шлюз «ИЛИ» (условное ветвление)
          • Шлюз «И» (распараллеливание)
          • Получить запись
          • Найти записи
          • Изменить запись
          • Создать запись
          • Удалить запись
          • Структура каталога
          • Загрузить файл
          • Сгенерировать документ
          • Назначение переменных
          • Код (Javascript)
          • Веб-запрос
          • SQL-запрос
          • Конвертер
          • Парсер
          • Запуск процесса
          • Получение почты
          • Отправка почты
          • Соединяющая линия
          • Отправить сообщение
        • Переменные
        • Выражения
        • Входные и выходные параметры компонентов
        • Примеры настройки
          • Условие
          • Цикл
      • Ограничения
  • Лицензии
    • 🌐Тип лицензирования
  • Примеры
    • 🔑Права доступа к данным
    • 🤖Автоматизации
      • Выгрузка файлов на Яндекс Диск
      • Отправка на больничный
      • Автоматизация оплаты счетов
      • Создание наименований записей
      • Расчет скидок для клиентов
      • Запрет на создание дубликатов в каталоге
      • Автозаполнение данных по ИНН
      • Переброс данных между связанными каталогами
      • Очередь сценариев
      • Отслеживание заявок с сайта помощью UTM-меток
      • Просрочка задач по дедлайну
      • Реализация механизма согласования записей
      • Массовое изменение записей
      • Создание каталога для рассылки почты
      • Перенос данных между системами Бипиума
      • Импорт данных из Excel
      • Генерация счет-фактуры
      • Генерация excel-отчетов
      • Планировщик задач
      • Импорт банковских выписок
      • Производственный календарь
      • Складской учет
  • Интеграции
    • 🥂Методы интеграции
      • Интеграция данных
        • API
        • Вебхуки (webhooks)
      • Интеграция интерфейса
        • Веб-формы
        • Веб-расширения
      • Примеры интеграций
        • Тильда
          • Прием данных с формы Tilda
          • Интеграция веб-интерфейса в Tilda
        • Интеграция с сервисом «DaData»
        • Интеграция c «Единой информационной системой в сфере закупок»
        • Мессенджеры
          • Интеграция с Telegram-ботом
        • Почтовые сервисы
          • UniSender
          • MailChimp
        • Сервисы Google
          • Google Calendar
        • Телефония
          • Oktell
            • Панель телефонии Oktell
            • Компонент Bpium в Oktell
        • 1C
    • 🔌API
      • Данные
        • Каталоги (Catalogs)
        • Записи (Records)
        • Связи (Relations)
        • Истории (Histories)
        • Файлы (Files)
        • Отделы (Sections)
        • Виды (Views)
        • Сообщения (Messages)
      • Агрегация
        • Разложения (Values)
        • Сводка (Totals)
      • Отчеты
        • Дашборды (Boards)
        • Графики (Widgets)
      • Поисковые выборки
        • Доступные связи (AvailableRecords)
        • Доступные условия фильтра (AvailableFilterRecords)
        • Сотрудники (Users)
        • Контакты (Contacts)
      • Права (Rights)
      • Профиль (Profile/me)
  • Установка на сервер
    • 🧱Архитектура
      • Варианты разворачивания
    • 🖥️Требования
    • 📂Установка как служба
    • 🛳️Установка через Docker
    • 🎛️Мультидоменная среда
    • 🆘Материалы
      • TLS/SSL Сертификат
      • Параметры config.env
        • Для Bpium
        • Для Bpium S3
        • Для Bpium BPM
      • Запуск
      • Обсуживание
        • Активация
        • Обновление
        • Бэкап и восстановление базы
        • Брендирование (Whitelabel)
        • Удаление
      • Перенос базы из облака
      • Возможные проблемы в ходе установки и работы
  • Обучение
    • Базовый курс
      • Урок 1. Отделы
      • Урок 2. Каталоги с данными
      • Урок 3. Карточки записей
      • Урок 4. Связи между данными
      • Урок 5. Фильтры и виды
      • Урок 6. Приглашение сотрудников
      • Урок 7. Права доступа к данным
      • Урок 8. Графические отчеты
      • Урок 9. Бизнес-процессы
      • Урок 10. Интеграции
    • Технический курс
      • Урок 1. Принцип работы автоматизаций
      • Урок 2. Первая автоматизация изнутри
      • Урок 3. Валидация данных
      • Урок 4. Простые вычисления
      • Урок 5. Расчет суммы заказа
      • Урок 6. Генерация счетов/документов
      • Урок 7. Рассылка почтовых сообщений
      • Урок 8. Прием внешних данных
      • Урок 9. Отправка данных на сторонние сервисы
    • Паттерны проектирования ИС
      • Унификация
      • Упорядоченность
      • Разделение
      • Актуализация
      • Вынос параметров
      • Выделение позиций
      • Слияние
      • Дублирование
      • Типизация
      • Информирование
Powered by GitBook
On this page
  • 1. Введение
  • 2. Принцип работы
  • 3. Реализация
  • 3.1. Подготовка полей формы в Tilda
  • 3.2. Подготовка каталога для данных в Бипиум
  • 3.3. Подготовка инструмента приема данных
  • 3.4. Подключение вебхука на Tilda
  • 3.5. Подключение вебхука к форме
  • 4. Тестирование
  1. Интеграции
  2. Методы интеграции
  3. Примеры интеграций
  4. Тильда

Прием данных с формы Tilda

Tilda — конструктор сайтов, позволяющий онлайн собирать и публиковать сайты из готовых блоков. Данные из сайта можно отправлять на сторонние источники. Рассмотрим пример отправки данных в Бипиум.

PreviousТильдаNextИнтеграция веб-интерфейса в Tilda

Last updated 6 months ago

1. Введение

Бипиум позволяет принимать и обрабатывать данные из форм сайта на Tilda. Например, у нас есть сайт созданный на Tilda с формой обратной связи.

Мы хотим, чтобы при нажатии кнопки Отправить, введенные в форму данные сохранились в Бипиум.

2. Принцип работы

  • Ваш сайт отправляет введенные пользователем в форме данные в Бипиум

  • Бипиум принимает запрос и запускает сценарий обработки полученных данных

  • На основе полученных данных в Бипиум создается новая запись в соответствующем каталоге

3. Реализация

3.1. Подготовка полей формы в Tilda

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

Имя - name Эл. почта - email Телефон - phone Чем мы можем помочь? - comment

3.2. Подготовка каталога для данных в Бипиум

Для того, чтобы принимать данные из сайта, в Бипиум необходимо подготовить каталог, куда мы будем сохранять отправленные данные. Типы полей в Бипиум и Tilda отличаются, поэтому мы подготовили список соответствия популярных полей Tilda к полям в Бипиум:

  • Email = Контакт с выбранным значением Электронная почта

  • Телефон = Контакт с выбранным значением Телефон

  • Имя = Текст

  • Поле для ввода в одну строку = Текст

  • Поле для ввода в несколько строк = Текст с выбранным значением Многострочный текст

  • Выпадающий список = Выбор значения или Статус. Варианты ответа в Тильда - это элементы выбранного поля в Бипиум

  • Вопрос с вариантами ответа = если Вид ответа - Один вариант ответа (радиокнопки), то Выбор значения или Статус, если Вид ответа - Несколько вариантов ответа (галочки), то Набор галочек или Статус (с настройкой Можно выбрать несколько)

Варианты ответа для полей Выпадающий список и Вопрос с вариантами ответа в Tilda должны быть идентичными элементам соответствующих полей в Бипиум, включая регистр

  • Оценочная шкала = Число

  • Галочка = Переключатель

  • Дата = Дата

Tilda не передает информацию о выбранном формате для поля типа Дата, из-за чего мы не сможем отличить формат ДД-ММ-ГГГГ от формата ММ-ДД-ГГГГ и поэтому рекомендуем выбирать либо ДД-ММ-ГГГГ, либо ГГГГ-ММ-ДД

  • Время = Текст с выбранным значением Текст по маске и настройкой 11:11

  • Количество = Число

  • Ссылка = Контакт с выбранным значением Сайт/ссылка

  • Скрытое поле = Текст

  • Калькулятор = Число

Создадим в Бипиум новый каталог и добавим такие же поля, которые у нас есть на нашем сайте, в соответствии со списком соответствия выше:

В свойствах каждого поля в Служебных заметках укажите имя переменной соответствующего поля, который мы задали в шаге 3.1. Это позволит соотнести поля из Tilda с полями в Бипиум.

3.3. Подготовка инструмента приема данных

Появится окно создания записи сценария. Скачайте готовый файл сценария по ссылке ниже.

Нажмите кнопку Загрузить и выберите скачанный файл:

Нажмите на загруженный файл. У вас откроется схема сценария. В данной схеме нужно нажать на компонент УКАЖИТЕ ID КАТАЛОГА, указать в нем ID-каталога, который создали в предыдущем шаге и сохранить сам файл сценария:

Теперь сохраним запись сценария:

Также сохраним запись внешнего запроса:

Ссылка для приема данных подготовлена, она формируется следующим образом: [Домен]/api/webrequest/[URL-идентификатор], где: [Домен] - это Ваш домен системы Бипиум. Например: https://tilda-demo.bpium.ru/ [URL-идентификатор] - это значение, которое мы ввели в записи внешнего запроса в поле URL-идентификатор Для домена из примера полная ссылка будет следующая: https://tilda-demo.bpium.ru/api/webrequest/getRequest

3.4. Подключение вебхука на Tilda

Перейдем в настройки нашего сайта на Tilda. Нужно перейти в блок Формы и найти раздел Webhook:

Укажем адрес, созданный в предыдущем шаге и добавим этот Webhook:

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

3.5. Подключение вебхука к форме

Осталось только подключить созданный в Tilda Webhook к нужной нам форме. Для этого переходим к настройке блока с формой на нужной странице и включаем галочку: WEBHOOK: [НАШ АДРЕС]

Сохраняем изменения и публикуем страницу.

4. Тестирование

Перейдем на наш сайт, заполняем форму ввода данных и нажимаем кнопку Отправить

Заходим в Бипиум, открываем созданный нами каталог и проверяем, что создана новая запись с нашими введенными на сайте данными:

Когда все поля добавлены, сохраните каталог, нажав соответствующую кнопку в правом верхнем углу. Посмотрите ID созданного каталога: он будет указан в адресной строке после /catalog/ Например, если адрес выглядит так: значит ID-каталога 16. Запомните этот ID - он понадобится нам в следующем шаге.

В Бипиум есть возможность создания специальных ссылок для приема данных из сторонних сервисов. Этот инструмент называется . Создать внешний запрос для приема данных можно в каталоге Внешние запросы. По умолчанию этот каталог находится в отделе Управление. Переходим в этот каталог и нажимаем кнопку Добавить:

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

После создания Webhook'а в Tilda, будет отправлен тестовый запрос на указанный адрес. Проверить, что все действия выше проделаны правильно можно в каталоге . В данном каталоге должна быть одна запись со статусом Завершен:

🥂
https://tilda-demo.bpium.ru/#/section/2/catalog/16/view/0/records
Внешние запросы
сценарий
Процессы
15KB
GetRequest.bpmn
пример для поля Имя