Как быстро сделать AJAX запрос в Bitrix без компонента

AJAX-запросы в Bitrix используются почти в каждом современном интерфейсе: формы, кнопки, подгрузка данных, фильтры, лайки и многое другое.

Обычно для этого создают компоненты битрикса, но для небольших задач это часто избыточно. Иногда нужно просто:

отправить данные на сервер
обработать их в PHP
получить JSON-ответ
обновить часть страницы

В таких случаях можно сделать простой AJAX-обработчик без компонента. Это быстрее в разработке и отлично подходит для небольших задач.

В статье разберём минимальный рабочий пример такого решения.

Когда стоит использовать AJAX без компонента

Такой подход хорошо подходит для небольших действий на странице.

Кнопки действий

Например:

добавить товар в избранное
поставить лайк
сохранить настройки

После нажатия кнопки отправляется AJAX-запрос и интерфейс обновляется.

Подгрузка данных

загрузка дополнительных элементов
кнопка «Показать ещё»
обновление статистики

Небольшие пользовательские действия

переключение режима интерфейса
сохранение фильтров
обновление блока страницы

Общая схема работы

Принцип работы:

JavaScript → AJAX запрос → PHP обработчик → JSON ответ → обновление страницы

Последовательность действий:

JavaScript отправляет запрос на сервер
PHP получает данные
выполняется обработка
сервер возвращает JSON
JavaScript обновляет интерфейс

Создаём PHP обработчик

Сначала создадим файл для обработки AJAX-запроса.

/ajax/example.php

Содержимое файла:

<?php

require($_SERVER["DOCUMENT_ROOT"]."/bitrix/modules/main/include/prolog_before.php");

$name = $_POST['name'] ?? 'Guest';

$result = [
    'status' => 'success',
    'message' => 'Hello ' . $name
];

header('Content-Type: application/json');
echo json_encode($result);

Разберем этот файл подробнее.

Подключение Bitrix

require($_SERVER["DOCUMENT_ROOT"]."/bitrix/modules/main/include/prolog_before.php");

Этот файл подключает ядро Bitrix, но без загрузки шаблона сайта. Это позволяет использовать классы и функции битрикса.

Получение данных из запроса

$name = $_POST['name'] ?? 'Guest';

Получаем значение из POST-запроса.

Формирование ответа

$result = [
    'status' => 'success',
    'message' => 'Hello ' . $name
];

Подготавливаем данные для отправки клиенту.

Отправка JSON

header('Content-Type: application/json');
echo json_encode($result);

Ответ возвращается в формате JSON.

Отправка AJAX запроса через JavaScript

Теперь отправим запрос на созданный обработчик.

fetch('/ajax/example.php', {
    method: 'POST',
    headers: {
        'Content-Type': 'application/x-www-form-urlencoded'
    },
    body: 'name=Alex'
})
.then(response => response.json())
.then(data => {
    console.log(data);
});

Что происходит:

отправляется POST-запрос
данные передаются в параметре body
сервер возвращает JSON
результат обрабатывается в JavaScript

Простой пример с кнопкой

Добавим кнопку и выведем результат на страницу.

HTML:

<button id="btn">Отправить AJAX запрос</button>
<div id="result"></div>

JavaScript:

document.getElementById('btn').addEventListener('click', function () {
    fetch('/ajax/example.php', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/x-www-form-urlencoded'
        },
        body: 'name=Alex'
    })
    .then(response => response.json())
    .then(data => {
        document.getElementById('result').innerText = data.message;
    });

});

Защита AJAX запроса через sessid

В Bitrix используется защита от CSRF-атак через sessid. Поэтому рекомендуется проверять его при обработке AJAX-запросов.

Проверка в PHP

if (!check_bitrix_sessid()) {
    die();
}

Полный пример обработчика:

<?php

require($_SERVER["DOCUMENT_ROOT"]."/bitrix/modules/main/include/prolog_before.php");

if (!check_bitrix_sessid()) {
    die();
}

$name = $_POST['name'] ?? 'Guest';

$result = [
    'status' => 'success',
    'message' => 'Hello ' . $name
];

header('Content-Type: application/json');
echo json_encode($result);

Передача sessid в JavaScript

body: 'name=Alex&sessid=' + BX.bitrix_sessid()

Полный пример запроса:

fetch('/ajax/example.php', {
    method: 'POST',
    headers: {
        'Content-Type': 'application/x-www-form-urlencoded'
    },
    body: 'name=Alex&sessid=' + BX.bitrix_sessid()
})
.then(response => response.json())
.then(data => {
    console.log(data);
});

Полезные функции Bitrix для AJAX

check_bitrix_sessid()

Php функция которая проверяет валидность сессии пользователя.

BX.bitrix_sessid()

JS метод который возвращает текущий sessid для AJAX-запросов.

RestartBuffer()

Php функция которая используется для очистки буфера вывода перед отправкой ответа.

Заключение

Использование AJAX без компонентов Bitrix — простой и быстрый способ реализовать небольшую серверную логику.

Для удобства разработки можно создать отдельную папку:

/ajax/

и размещать в ней все обработчики AJAX-запросов. Это упрощает поддержку проекта и делает код более структурированным.