Разработка встраиваемых приложений Битрикс24 под ключ

Представьте: вы открываете карточку сделки в Битрикс24, а там — пустая вкладка. Данные из вашей WMS не подтягиваются, менеджеру приходится переключаться между системами. Это снижает скорость обработки заказов на 40%. Для логистической компании мы решили эту проблему: разработали приложение, которое встраивается в карточку сделки и в реальном времени подгружает статус доставки из WMS. Результат — сокращение времени на обработку заказа с 15 до 3 минут. Экономия составила сотни тысяч рублей в год.

Почему встраиваемое приложение Битрикс24 быстрее виджета?

Стандартные виджеты работают в изоляции: они отображают данные, но не могут менять интерфейс или подписываться на события. Встраиваемые приложения снимают эти ограничения. Они дают двустороннее взаимодействие с CRM: читают и обновляют поля карточки без перезагрузки, вызывают диалоги и уведомления, синхронизируются с внешними системами.

Согласно документации BX24 SDK, встраиваемые приложения (Embedded Apps) — это приложения с типом IFRAME, которые регистрируют плейсменты и работают внутри интерфейса портала. В отличие от внешних (серверных) приложений, они имеют прямой доступ к JS SDK BX24 и могут:

• читать и изменять поля открытой карточки CRM в реальном времени без перезагрузки
• вызывать диалоги, слайдеры и уведомления Битрикс24 (BX24.openPath, BX24.showMessagePopup)
• подписываться на события интерфейса через BX24.placement.call('getInterface', ...)

Как встраиваемое приложение ускоряет работу с CRM?

Самая ценная возможность — чтение и запись полей карточки без перезагрузки страницы. Подписка на обновление сущности и программное изменение поля выполняются через BX24.placement:

// Подписка на обновление сущности
BX24.placement.call('bindEvent', {
    event: 'onCrmBindEntityUpdated'
}, (eventData) => {
    const entityId = eventData.ENTITY_ID;
    refreshWidgetData(entityId);
});

// Изменение поля визуально
BX24.placement.call('setFieldValue', {
    FIELD: 'UF_CRM_CUSTOM_STATUS',
    VALUE: 'shipped'
}, () => {
    console.log('Поле обновлено в интерфейсе');
});

Полный список событий зависит от типа карточки (CRM_DEAL, CRM_LEAD и др.) — у каждой своя документация.

Получение интерфейса плейсмента — разработка встраиваемых приложений

Для CRM_DEAL_DETAIL_TAB можно получить интерфейс текущего плейсмента:

BX24.placement.call('getInterface', {}, (interfaceData) => {
    /*
    interfaceData содержит:
    {
        ID: "42",           // ID сделки
        ENTITY_TYPE: "CRM_TYPE_DEAL",
        FIELDS: { ... },   // Текущие значения полей
        BUTTONS: [ ... ]   // Доступные кнопки
    }
    */
});

Как работает авторизация и жизненный цикл?

При открытии вкладки с приложением Битрикс24 формирует iframe-запрос к вашему handler URL с параметрами:

GET https://your-app.com/handler?
    DOMAIN=company.bitrix24.ru&
    PROTOCOL=1&
    AUTH_ID=abc123&
    AUTH_EXPIRES=3600&
    REFRESH_ID=xyz789&
    member_id=a1b2c3&
    PLACEMENT=CRM_DEAL_DETAIL_TAB&
    PLACEMENT_OPTIONS={"ID":"42","SECTION":""}

AUTH_ID живёт 1 час. Для долгоживущих сессий (пользователь оставил вкладку открытой) нужен refresh:

BX24.init(() => {
    // Автоматически обновляет токен если он истёк
    BX24.getAuth((auth) => {
        // auth.access_token — актуальный токен
        fetch('/api/data', {
            headers: { 'X-Bitrix-Auth': auth.access_token }
        });
    });
});

На вашем сервере проверяйте токен через REST-метод rest/profile.

Сравнение встраиваемого приложения и обычного виджета

Встраиваемое приложение работает в 10 раз быстрее, так как использует JS SDK для прямого управления элементами CRM. Оно также может подписываться на события в реальном времени, что важно для синхронизации с внешними системами.

Как проходит разработка встраиваемого приложения: 5 этапов

1. Анализ — выявляем, какие плейсменты нужны, какие внешние API будут задействованы, фиксируем сроки.
2. Проектирование — создаём схему авторизации, определяем структуру handler и серверной части.
3. Реализация — пишем клиентский код на JS (React/Vue/Vanilla) с BX24 SDK, серверный компонент на Express/Fastify.
4. Тестирование — отладка на dev-портале через ngrok с mock-параметрами, проверка refresh токенов.
5. Деплой и поддержка — разворачиваем на production, подключаем мониторинг, обучаем сотрудников.

Структура проекта

Минимальная структура:

• /public/index.html — точка входа (handler URL)
• /public/app.js — клиентский код с BX24 SDK
• /src/api/bitrix.js — обёртка над BX24.callMethod
• /src/api/external.js — запросы к внешнему API
• /src/components/DealTab.jsx — React/Vue/Vanilla
• server.js — Express/Fastify для OAuth callback и API proxy

Серверный компонент необходим, потому что OAuth callback (/oauth/callback) должен обрабатываться на сервере, client_secret нельзя выносить в браузер, проксирование запросов к внешним API избегает CORS-проблем.

Что входит в разработку встраиваемого приложения

Сроки разработки

Критичный момент: перед стартом согласуйте список плейсментов — добавление нового после публикации тиражного приложения требует повторной модерации.

Типичные ошибки и как их избежать

• Отладка внутри iframe: используйте прямое открытие handler URL с mock-параметрами.
• Забывают про refresh токенов: всегда реализуйте автоматическое обновление через BX24.init().
• Не учитывают CORS: проксируйте запросы к внешним API через свой сервер.

Почему стоит заказать разработку встраиваемого приложения у нас

Мы на рынке более 7 лет, разработали 50+ встраиваемых приложений. Гарантируем качество: каждый проект проходит трёхэтапное тестирование на dev-портале с ngrok. Средний проект окупается за 3-6 месяцев за счёт сокращения операционных расходов. Свяжитесь с нами для консультации и оценки вашего проекта. Закажите разработку встраиваемого приложения, которое идеально впишется в бизнес-процессы вашей компании. Получите предварительную оценку сроков и бюджета — мы всегда рассчитываем стоимость индивидуально.

Подробнее об OAuth 2.0 читайте на Wikipedia. Документация по BX24 SDK — dev.1c-bitrix.ru.

Разработка и настройка модулей 1С-Битрикс

Главная ловушка Битрикса — init.php. Сунул туда обработчик OnBeforeIBlockElementUpdate, потом ещё один — через год файл на 2000 строк, и при каждом хите весь этот ком выполняется. Мы переносим бизнес-логику в полноценные модули с D7 ORM, собственными таблицами и административным интерфейсом. Модуль можно отключить, перенести на другой проект, покрыть тестами — с init.php ничего из этого не получится. Опыт команды — 10+ лет в Битрикс, сертифицированные специалисты, гарантия на код 6 месяцев. Закажите консультацию — расскажем, как перевести legacy-код в модульную архитектуру.

Почему init.php — худшее место для бизнес-логики?

Init.php не поддерживает автозагрузку классов, не имеет изолированного пространства имён, не поддаётся модульному тестированию и не отключается без правки самого файла. Каждый обработчик, написанный там, срабатывает на каждом запросе, даже если он не нужен. В модуле вы регистрируете обработчика через EventManager, и он выполняется только при наступлении события. Разница в производительности — до 3 раз при 10+ обработчиках.

Стандартные модули: типовые проблемы и решения

Информационные блоки. Архитектура ИБ — первое, что мы ревьюим на любом проекте. Классическая ошибка: один инфоблок каталога с 80 свойствами, из которых 30 — множественные. Таблица b_iblock_element_property раздувается до миллионов строк, CIBlockElement::GetList на фильтрации по трём свойствам уходит в полное сканирование. Переносим справочники в Highload-блоки, убираем множественные свойства где можно, проектируем структуру с прицелом на то, что каталог вырастет в 5 раз.

Интернет-магазин (sale). Бизнес-правила корзины — отдельная история. Настраиваем приоритеты скидок, чтобы две акции не дали 60% вместо 30%, подключаем платёжные обработчики, прописываем кастомную валидацию через OnSaleOrderBeforeSaved.

Поиск. Встроенный модуль search с морфологией работает до 10–15 тысяч элементов. Дальше — Elasticsearch. Настраиваем через API модуля поиска Битрикс, индексируем через CSearchFullText или кастомные индексаторы.

Highload-блоки для справочников, логов, пользовательских данных — вместо раздутых ИБ. Прямые запросы через Bitrix\Highloadblock\HighloadBlockTable, собственные таблицы вместо EAV-структуры стандартных инфоблоков. Миллион записей — без деградации.

Почтовые события. Настройка — не только шаблоны в b_event_message. Главное — SPF, DKIM, DMARC на DNS, иначе транзакционные письма летят в спам. Проверяем доставляемость, настраиваем bounce-обработку.

Проектирование инфоблоков для производительности

Используем Highload-блоки для справочных данных (цвета, размеры, производители), которые не участвуют в сложных выборках. Для торговых предложений — отдельный инфоблок с привязкой через IBLOCK_ELEMENT_PROPERTY. Включаем INDEX_PROPERTY для часто фильтруемых свойств. Кэширование тегированное: при изменении элемента сбрасывается только связанный кеш. Highload-блоки обрабатывают до 10 раз быстрее, чем инфоблоки с множественными свойствами, на объёмах от 100 000 записей.

Разработка кастомных модулей

Каждый модуль — по структуре /local/modules/vendor.modulename/:

• install/index.php — класс установки, создание таблиц через $DB->RunSQLBatch()
• lib/ — классы D7 ORM, наследники Bitrix\Main\ORM\Data\DataManager
• admin/ — административные страницы через CAdminList, CAdminForm
• include.php — автозагрузка, регистрация обработчиков через EventManager::getInstance()->registerEventHandler()
• REST API endpoints через \Bitrix\Rest\RestManager

Модуль регистрируется в системе, появляется в списке «Установленные решения», имеет свои настройки в /bitrix/admin/settings.php?mid=vendor.modulename. Его можно включать, отключать, обновлять через UpdateSystem или свой механизм миграций.

Примеры реализованных задач:

• Управление акциями — визуальный конструктор условий через CAdminCalendar, таймеры через агенты (CAgent::AddAgent), аналитика эффективности в связке с модулем sale
• Калькулятор стоимости — React-виджет на фронте, REST API в модуле, формулы хранятся в Highload-блоке
• Система бронирования — real-time календарь, блокировка через $DB->StartTransaction() / $DB->Commit() при одновременных запросах, синхронизация с channel manager через webhook

Компоненты и композитный кэш

Кастомизация компонентов — через result_modifier.php и component_epilog.php, не через правку template.php стандартного шаблона. Так ядро обновляется безболезненно.

Композитный кэш (технология «Композитный сайт») — сервер отдаёт готовый HTML, минуя PHP-роутинг. Динамические зоны (корзина, авторизация) подгружаются через CBitrixComponent::setFrameMode(true) и AJAX. TTFB падает до 30–50 мс. Но есть нюансы: не все компоненты совместимы, $APPLICATION->ShowPanel() ломает композит, нужна аккуратная разметка <div id="bx-composite-...">.

Маркетплейс: аудит перед установкой

Перед установкой модуля с маркетплейса — обязательный аудит. Проверяем: SQL-запросы без подготовленных выражений (привет, SQL-инъекции), прямое обращение к $_REQUEST без фильтрации, использование устаревшего API старого ядра вместо D7, конфликты с модулем композитного кэширования. Модуль без обновлений больше года и с парой десятков установок — скорее всего, проблема на ближайшем обновлении PHP. Типичный случай: модуль вызывает CIBlockElement::GetList с несброшенным кешем — сайт падает при 5000 элементов.

Миграция на D7

При обновлении PHP или переходе на новую редакцию — рефакторинг устаревших вызовов:

• CIBlockElement::GetList() → Bitrix\Iblock\Elements\ElementTable::getList()
• CSaleOrder::GetList() → Bitrix\Sale\Order::getList()
• CModule::IncludeModule() → Bitrix\Main\Loader::includeModule() Тестирование на staging, откат через git при проблемах.

Согласно официальной документации 1С-Битрикс, D7 ORM является рекомендуемым средством для работы с данными, обеспечивая безопасность типов и автогенерацию запросов.

Сравнение подходов: Init.php vs Модуль

Стоимость и состав разработки модулей

Что входит в разработку модуля?

• Техническое задание и архитектурная схема
• Код с соблюдением PSR-4 и код-стайла Битрикс
• Unit-тесты (PHPUnit) на бизнес-логику
• Интеграционные тесты на события и REST API
• Документация по установке, настройке и API
• Передача доступов к репозиторию и документации
• Обучение администраторов работе с модулем
• Гарантийная поддержка 6 месяцев

Ориентировочные сроки и сложность:

Стоимость рассчитывается индивидуально — свяжитесь с нами для оценки вашего проекта.

Тестирование модулей

Unit-тесты через PHPUnit покрывают бизнес-логику: расчёт скидок, валидацию, формирование документов. Моки для Bitrix\Main\Application::getConnection() позволяют тестам не зависеть от БД. Интеграционные тесты проверяют обработчики событий на реальной базе — OnAfterIBlockElementAdd, OnSaleOrderSaved и другие. REST API endpoints тестируем через curl или PHPUnit HTTP-клиент. Критично для модулей, работающих с b_sale_order, b_catalog_price — где ошибка стоит денег.

Совместимость проверяется на PHP 7.4, 8.0, 8.1, 8.2 и редакциях: Стандарт, Малый бизнес, Бизнес. Проверяем конфликты с популярными модулями маркетплейса — они любят перехватывать те же события. Нагрузочное тестирование: замеры на 10K, 100K, 1M записей, профилирование через Xdebug на предмет утечек памяти и N+1 запросов.

Примеры из практики

Модуль акций для сети электроники. Штатные скидки модуля sale не покрывали сценарии «2+1», подарок при покупке от суммы, комбинированные условия. Собрали визуальный конструктор: маркетолог создаёт правила через drag-and-drop, без тикетов в разработку. Календарь акций, автодеактивация через агенты, аналитика в привязке к b_sale_order — конверсия, средний чек, количество применений. Время запуска новой акции упало с двух дней до получаса.

Калькулятор для строителей. Параметры (площадь, материалы, этажность) → формула → предварительная смета → заявка в CRM через CRest::call('crm.lead.add'). Региональные коэффициенты и сезонные наценки — из Highload-блока, цены материалов — из обмена с 1С. Количество целевых заявок выросло на треть: клиенты видят разбивку по статьям до звонка менеджеру.

Бронирование для сети отелей. Real-time доступность через AJAX-запросы к кастомной таблице vendor_booking_slots, расчёт тарифов по сезону, синхронизация с Booking.com через channel manager API. Блокировка номера при одновременном бронировании — через SELECT ... FOR UPDATE в транзакции. Таймзоны обрабатываются через \DateTimeZone — гость из Владивостока и менеджер из Москвы видят одну картину.

Оценим проект за 1 день. Пишите — расскажем, что входит в разработку под ключ. Свяжитесь с нами для консультации по вашему проекту. Закажите разработку модуля под ключ — получите готовое решение с документацией и поддержкой.