Диагностика проблем с кнопками «Заказ в 1 клик» и «Обратный звонок» в интернет-магазине на Битрикс24

Введение

Кнопка не нажимается с первого раза. Пользователь жмёт — ничего. Жмёт второй раз — срабатывает. Или того хуже: нажимает, страница перезагружается, а заказа нет. Это не гипотетический сценарий, а реальная ситуация, с которой столкнулись интернет-магазины hyperfit.ru и Dykemann на Битрикс24.

Кнопки «Заказ в 1 клик» и «Обратный звонок» — это не просто вёрстка. Под капотом там AJAX-запросы, которые отправляют данные в CRM, создают лид или сделку и возвращают пользователю подтверждение. Когда в этой цепочке что-то ломается, кнопка либо зависает, либо не реагирует, либо выдаёт ошибку.

В этой статье разберём, как устроены AJAX-кнопки в Битрикс24, почему они перестают работать и — главное — как найти и устранить причину. Без догадок, по конкретным шагам.

Как работают AJAX-кнопки в Битрикс24

Кнопка «Заказ в 1 клик» в типовом интернет-магазине на Битрикс24 делает три вещи:

Собирает данные формы (телефон, товар, количество).
Отправляет AJAX-запрос к серверу — обычно через компонент sale.ajax.locations или кастомный обработчик.
Сервер создаёт заказ/лид, возвращает ответ, и кнопка показывает результат пользователю.

Между нажатием и результатом — цепочка из фронтенда, сети и бэкенда. Обрыв на любом звене даёт «кнопка не работает». Чаще всего проблема на фронтенде — в JavaScript.

Битрикс24 использует свою JS-библиотеку (BX), и кнопки обычно завязаны на BX.ajax.runAction() или BX.ajax.runComponentAction(). Если вызов не уходит или падает с ошибкой, кнопка молчит.

Диагностика через консоль браузера

Шаг 1. Открываем консоль

В Chrome/Edge: F12 → вкладка Console. В Firefox: F12 → Console. В Safari: Develop → Show JavaScript Console.

Шаг 2. Смотрим ошибки

Нажимаем проблемную кнопку и смотрим, что появилось в консоли. Красные строки — это ошибки JavaScript. Вот типичные:

Uncaught TypeError: Cannot read properties of null — скрипт пытается обратиться к элементу, которого нет на странице.
BX is not defined — не загрузилось ядро Битрикс24. Причина: конфликт скриптов или кеширование.
Failed to load resource: the server responded with a status of 500 — ошибка на сервере, AJAX-запрос упал.
Mixed Content: The page was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint — страница на HTTPS, а запрос уходит на HTTP.

Шаг 3. Смотрим вкладку Network

Переключаемся на вкладку Network (Сеть), нажимаем кнопку и ищем XHR/Fetch-запросы. Кликаем на запрос — видим:

Status Code: 200 — ок, 500 — ошибка сервера, 403 — нет прав, 404 — не найден обработчик.
Response: что вернул сервер. Если HTML вместо JSON — скорее всего, запрос попал на страницу авторизации или 404.
Timing: если запрос висит больше 30 секунд — таймаут.

Шаг 4. Проверяем консоль на других страницах

Если ошибка только на одной странице (например, в корзине), а на других кнопки работают — проблема локализована. Сравните, какие скрипты загружаются на проблемной странице и на работающей.

Конфликты скриптов: поиск и устранение

Самая частая причина — конфликт между скриптами Битрикс24 и сторонними скриптами: счётчиками, чатами, пикселями, виджетами.

Как конфликт выглядит

Кнопка работает только после перезагрузки страницы.
Кнопка работает в Chrome, но не работает в Firefox (или наоборот).
В консоли ошибка: $ is not a function или jQuery is not defined — сторонний скрипт переопределил $.
Ошибка: BX is not defined — скрипт заблокировал загрузку ядра.

Как найти виновника

Откройте страницу в режиме инкогнито (Ctrl+Shift+N). Если кнопка работает — проблема в расширениях браузера или кеше.
Временно отключите все сторонние скрипты: закомментируйте их в шаблоне сайта (обычно header.php) и проверьте кнопку.
Включайте скрипты по одному, каждый раз проверяя кнопку. Так вы найдёте, какой именно вызывает конфликт.

Типичные виновники

JivoSite, LiveChat, Bitrix24 Chat — подгружают свою версию jQuery и ломают родную.
Google Tag Manager — если внутри GTM есть кастомные скрипты с ошибками.
Метрика и Analytics — редко, но бывает: счётчик с кривым кодом стопорит выполнение остальных скриптов.
Сторонние темы и шаблоны — многие темы для Битрикс24 несут свой JS, который конфликтует с компонентами магазина.

Решение

Используйте BX.loadScript() вместо прямого подключения jQuery.
Оборачивайте сторонние скрипты в document.addEventListener('DOMContentLoaded', ...), чтобы они не мешали загрузке BX.
Если конфликт из-за $, используйте jQuery.noConflict() или перепишите скрипт на BX вместо $.

Кеширование: как оно ломает кнопки

Битрикс24 агрессивно кеширует страницы. Композитный кеш, автокеш, кеш браузера — слоёв много, и каждый может сохранить «сломанное» состояние кнопки.

Симптомы кеш-проблемы

Кнопка не работает у части пользователей, у других работает.
После сброса кеша в админке кнопка временно чинится, но через день-два опять ломается.
В консоли старая версия скрипта — изменили JS-файл, а браузер грузит закешированную версию.

Что делать

Сбросить кеш в админке: Настройки → Производительность → Очистить кеш.
Отключить композитный кеш для страниц с кнопками: Настройки → Композитный сайт → исключить страницы корзины и товаров.
Добавить параметр версии к JS-файлам: вместо /script.js подключать /script.js?v=2 — браузер будет считать это новым файлом.
Настроить автокеш с умом: не кешировать страницы с формами на сутки — достаточно 5–10 минут.
Проверить CDN: если используется Cloudflare или другой CDN, он может кешировать HTML с ошибкой. Настройте правило: не кешировать страницы с query-параметрами или страницы корзины.

Кейсы из практики

Hyperfit.ru: обратный звонок не отправлялся с первого раза

Интернет-магазин спортивного питания hyperfit.ru. Проблема: кнопка «Обратный звонок» на странице товара срабатывала только после второго нажатия. Первое нажатие — тишина, второе — форма отправлялась.

Что нашли: в консоли при первом нажатии вылетала ошибка Uncaught TypeError: Cannot read properties of null (reading 'addEventListener'). Оказалось, что сторонний скрипт чата JivoSite загружался быстрее, чем DOM страницы, и пытался навесить обработчик на форму обратного звонка, которой ещё не было в DOM.

Решение: перенесли скрипт JivoSite в футер и обернули инициализацию чата в проверку if (document.readyState === 'complete'). После этого кнопка заработала с первого нажатия. Дополнительно настроили кеширование: исключили страницы товаров из композитного кеша — время загрузки выросло на 0,3 секунды, но кнопка перестала «отваливаться» после обновлений.

Dykemann: заказ в 1 клик висел по 15 секунд

Магазин мебели Dykemann. Проблема: кнопка «Заказ в 1 клик» после нажатия показывала прелоадер и висела 10–15 секунд, после чего либо срабатывала, либо вылетала ошибка.

Диагностика через вкладку Network показала: AJAX-запрос к /bitrix/services/main/ajax.php выполнялся 12 секунд, а затем обрывался по таймауту. На стороне сервера — в момент запроса запускался бизнес-процесс создания сделки, который дёргал внешний API для проверки адреса доставки. API иногда отвечал медленно, и бизнес-процесс зависал.

Решение: вынесли проверку адреса в фоновое задание — бизнес-процесс создаёт сделку сразу, а валидация адреса происходит асинхронно через робота. Кнопка стала отрабатывать за 1–2 секунды. Дополнительно настроили мониторинг: если AJAX-запрос к кнопке длится больше 3 секунд, администратор получает уведомление.

Типовой кейс: кнопка перестала работать после обновления шаблона

Магазин обновил тему на Битрикс24, и кнопки перестали нажиматься. В консоли — BX is not defined. Причина: разработчики темы подключили jQuery дважды — сначала родной из Битрикс24, потом свою версию. Второе подключение переопределило глобальный $, и ядро BX не смогло инициализироваться.

Решение: удалили второе подключение jQuery из шаблона. Битрикс24 сам загружает нужную версию.

Типовой кейс: кнопка не работает в Safari

Магазин одежды. Кнопка «Заказ в 1 клик» отлично работает в Chrome, Firefox и Edge, но в Safari на iPhone — нет. В консоли ошибка: ReferenceError: Can't find variable: Intl.

Причина: компонент использовал Intl.NumberFormat для форматирования цены, а Safari на старых iOS не поддерживает эту функцию без полифила.

Решение: добавили проверку if (typeof Intl !== 'undefined') и fallback на простое форматирование через toFixed(). Кнопка заработала на всех устройствах.

Типичные ошибки при диагностике

1. Смотреть консоль после перезагрузки, а не до

Нажали кнопку, страница перезагрузилась, консоль очистилась. Ошибка потеряна. В Chrome на вкладке Console есть галочка «Preserve log» (Сохранять лог) — включите её перед диагностикой.

2. Игнорировать вкладку Network

«Консоль пустая, значит ошибок нет» — нет. Если консоль чистая, а кнопка не работает, ошибка может быть в ответе сервера. Смотрите вкладку Network: какой статус у AJAX-запроса, что в ответе, сколько времени шёл запрос.

3. Проверять только в одном браузере

Кнопка работает в Chrome, и вы считаете, что проблема решена. А в Safari она не работает. Всегда проверяйте минимум в двух браузерах — Chrome и Safari (или Firefox).

4. Сбрасывать кеш и не разбираться в причине

«Сбросил кеш — заработало, проблема решена». Через день кнопка опять ломается. Сброс кеша — это временное решение. Найдите, почему кеш сохраняет сломанное состояние.

5. Не проверять мобильную версию

На десктопе кнопка работает, на мобильной — нет. Мобильные браузеры иначе обрабатывают JavaScript, особенно touch-события. Если кнопка завязана на click, на мобильных устройствах может понадобиться touchend.

Сравнение методов диагностики

Метод	Что показывает	Сложность	Скорость
Консоль браузера (Console)	Ошибки JavaScript	Низкая	1 минута
Вкладка Network	Статус и время AJAX-запроса	Низкая	2 минуты
Отключение скриптов по одному	Конфликтующий скрипт	Средняя	10–15 минут
Режим инкогнито	Проблемы с расширениями и кешем	Низкая	1 минута
Логи сервера (error.log)	Ошибки PHP, таймауты	Средняя	5–10 минут
xDebug / отладка PHP	Пошагово: что делает сервер	Высокая	30+ минут

В большинстве случаев достаточно консоли и вкладки Network. К серверным логам стоит идти, только если фронтенд-диагностика не дала результата.

FAQ

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

Чаще всего скрипт пытается обратиться к DOM-элементу, которого ещё нет на странице (гонка загрузки). Первое нажатие падает с ошибкой, но к этому моменту DOM уже загрузился, и второе нажатие срабатывает. Решение: обернуть инициализацию кнопки в BX.ready() или DOMContentLoaded.

Как понять, проблема на фронтенде или на сервере?

Откройте вкладку Network и нажмите кнопку. Если запрос уходит и возвращается с ошибкой (4xx, 5xx) — проблема на сервере. Если запрос вообще не уходит — проблема на фронтенде (скрипт не выполнился или упал до отправки).

Можно ли просто переустановить компонент кнопки?

Иногда помогает, но это лотерея. Если проблема в конфликте скриптов или кешировании, переустановка компонента ничего не изменит. Сначала диагностика, потом решение.

Что делать, если ошибка возникает только у некоторых пользователей?

Скорее всего, проблема в кешировании или в конкретном браузере. Попросите пользователя прислать скриншот консоли (F12 → Console) и версию браузера. Также проверьте, не включён ли у пользователя блокировщик рекламы — некоторые блокировщики режут AJAX-запросы к Битрикс24.

Как часто нужно чистить кеш после обновления скриптов?

После каждого изменения JS/CSS-файлов — обязательно. Плюс настройте версионирование файлов (?v=...), чтобы браузеры пользователей автоматически подхватывали новую версию.

Влияет ли хостинг на работу кнопок?

Да, и сильно. Если сервер отвечает медленно (shared-хостинг, слабый VPS), AJAX-запросы могут упираться в таймаут. Для интернет-магазина на Битрикс24 критически важно, чтобы сервер отвечал за 1–3 секунды. Проверьте время ответа сайта через PageSpeed Insights или любой сервис мониторинга.

Как отключить композитный кеш только для страниц с кнопками?

В админке: Настройки → Композитный сайт → вкладка «Исключения». Добавьте URL-шаблоны: /catalog/*, /personal/cart/*, /order/*. Композитный кеш не будет применяться к этим страницам, но продолжит работать на остальных.

SEO-блок

Высокочастотные:

кнопка заказа не работает битрикс
обратный звонок не работает битрикс
заказ в 1 клик не нажимается

Среднечастотные:

ошибка ajax битрикс24 кнопка
кнопка не реагирует битрикс интернет магазин
консоль браузера ошибки битрикс
конфликт скриптов битрикс24

Длинный хвост:

почему кнопка заказа срабатывает со второго раза битрикс
композитный кеш битрикс ломает кнопки
jivosite конфликт с битрикс кнопками
bx is not defined интернет магазин
как проверить ajax запросы в битрикс24
кнопка не работает в safari битрикс
заказ в 1 клик висит долго битрикс

Коммерческие + информационные:

диагностика проблем битрикс24
настройка кнопок интернет магазин битрикс
исправление ошибок javascript битрикс

Заключение

Проблемы с AJAX-кнопками в Битрикс24 — это не чёрная магия. В 80% случаев причина находится за 5 минут: консоль браузера + вкладка Network. Остальные 20% — конфликты скриптов и кеширование, которые диагностируются методичным отключением скриптов и настройкой кеша.

Если кнопки «Заказ в 1 клик» и «Обратный звонок» глючат в вашем магазине, начните с трёх шагов:

Откройте консоль (F12) и посмотрите ошибки при нажатии.
Проверьте вкладку Network — уходит ли AJAX-запрос и какой статус возвращает.
Отключите на минуту все сторонние скрипты и проверьте кнопку.

Девять из десяти проблем решатся на одном из этих этапов. Если нет — копайте в кеширование и серверную часть.

Статья основана на реальных кейсах диагностики hyperfit.ru и Dykemann. На обоих проектах проблема была найдена и устранена без переписывания компонентов — только настройкой окружения и скриптов.