Как сделать отслеживание пользователей в WordPress с помощью AJAX

Отслеживание активности пользователей на сайте WordPress — важная задача для анализа поведения, улучшения интерфейса и персонализации контента. В этой статье мы разберём, как реализовать простое, но эффективное отслеживание пользователей с помощью AJAX-запросов. Такой подход позволит собирать данные без перезагрузки страницы, что улучшит пользовательский опыт и снизит нагрузку на сервер.

Зачем нужно отслеживание пользователей в WordPress и какие данные собирать

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

• ID пользователя или IP (если гость);
• URL посещённой страницы;
• Время посещения;
• Тип действия (например, просмотр страницы, клик по кнопке);
• Дополнительные параметры (например, UTM-метки, реферер).

Для реализации базового отслеживания достаточно записывать идентификатор пользователя, URL и время. Это позволит создавать отчёты и анализировать поведение.

Подключение AJAX в WordPress: базовые понятия и настройка

WordPress имеет встроенный механизм AJAX, который работает через файл admin-ajax.php. Чтобы использовать AJAX, нужно зарегистрировать обработчик на сервере и настроить JavaScript на клиенте для отправки запросов.

Для начала подключим JavaScript-файл и передадим ему адрес AJAX:

function wporg_enqueue_scripts() {
    wp_enqueue_script('wporg-tracking', get_template_directory_uri() . '/js/tracking.js', ['jquery'], null, true);
    wp_localize_script('wporg-tracking', 'wporg_ajax_obj', [
        'ajax_url' => admin_url('admin-ajax.php'),
        'nonce' => wp_create_nonce('wporg_nonce')
    ]);
}
add_action('wp_enqueue_scripts', 'wporg_enqueue_scripts');

В этом примере мы подключаем скрипт tracking.js из папки темы и передаём ему AJAX URL и nonce для безопасности.

Обработка AJAX-запроса на сервере

Далее регистрируем PHP-функцию, которая будет обрабатывать AJAX-запросы. В WordPress есть два действия: для авторизованных пользователей и для гостей.

function wporg_handle_user_tracking() {
    check_ajax_referer('wporg_nonce', 'security');

    $user_id = get_current_user_id();
    $page_url = isset($_POST['page_url']) ? sanitize_text_field($_POST['page_url']) : '';
    $timestamp = current_time('mysql');

    global $wpdb;
    $table = $wpdb->prefix . 'wporg_user_tracking';

    $wpdb->insert($table, [
        'user_id' => $user_id,
        'page_url' => $page_url,
        'visited_at' => $timestamp
    ]);

    wp_send_json_success('Tracking saved');
}
add_action('wp_ajax_wporg_track_user', 'wporg_handle_user_tracking');
add_action('wp_ajax_nopriv_wporg_track_user', 'wporg_handle_user_tracking');

Здесь происходит проверка nonce, получение ID пользователя, URL страницы и запись в базу данных. Если пользователь не авторизован, ID будет 0.

Создание собственной таблицы в базе данных для хранения данных отслеживания

Для хранения данных создадим отдельную таблицу. Это позволит оптимизировать запросы и не нагружать стандартные таблицы WordPress.

Добавим функцию для создания таблицы при активации темы или плагина:

function wporg_create_tracking_table() {
    global $wpdb;
    $table_name = $wpdb->prefix . 'wporg_user_tracking';
    $charset_collate = $wpdb->get_charset_collate();

    $sql = "CREATE TABLE $table_name (
        id bigint(20) unsigned NOT NULL AUTO_INCREMENT,
        user_id bigint(20) unsigned NOT NULL DEFAULT 0,
        page_url varchar(255) NOT NULL,
        visited_at datetime NOT NULL,
        PRIMARY KEY  (id),
        KEY user_id (user_id),
        KEY visited_at (visited_at)
    ) $charset_collate;";

    require_once(ABSPATH . 'wp-admin/includes/upgrade.php');
    dbDelta($sql);
}
register_activation_hook(__FILE__, 'wporg_create_tracking_table');

Эта таблица хранит ID записи, ID пользователя, URL посещённой страницы и время посещения. Индексы по user_id и visited_at ускоряют выборки.

Клиентский JavaScript: отправка данных с помощью AJAX

Создадим скрипт tracking.js, который будет отправлять AJAX-запрос при загрузке страницы:

jQuery(document).ready(function($) {
    var data = {
        action: 'wporg_track_user',
        security: wporg_ajax_obj.nonce,
        page_url: window.location.href
    };

    $.post(wporg_ajax_obj.ajax_url, data, function(response) {
        if(response.success) {
            console.log('Пользователь отслежен');
        } else {
            console.log('Ошибка отслеживания');
        }
    });
});

При загрузке страницы скрипт отправляет URL на сервер, где данные сохраняются. Вы можете расширить этот код для отслеживания других событий — кликов, прокрутки и т.д.

Дополнительные рекомендации и улучшения для отслеживания в WordPress

Чтобы сделать отслеживание более полезным и безопасным, рекомендуем:

• Добавить обработку ошибок и логирование для отладки.
• Фильтровать и валидировать входящие данные.
• Внедрить ограничение частоты запросов (throttling) для снижения нагрузки.
• Использовать пользовательские куки или localStorage для более точного определения сессий.
• Оптимизировать запросы и периодически очищать устаревшие данные из таблицы.

Если хотите собирать более сложные метрики (например, время на странице, глубина прокрутки), можно расширить JavaScript и серверный код, добавляя дополнительные AJAX-запросы при определённых событиях.

Пример расширения: отслеживание кликов на кнопки

Добавим пример, как отслеживать клики на определённые кнопки:

jQuery(document).ready(function($) {
    $('.track-click').on('click', function() {
        var data = {
            action: 'wporg_track_user',
            security: wporg_ajax_obj.nonce,
            page_url: window.location.href + ' #button_click',
        };

        $.post(wporg_ajax_obj.ajax_url, data);
    });
});

Кнопкам, которые нужно отслеживать, добавьте класс track-click. При клике будет отправлен AJAX-запрос с пометкой о действии. На сервере можно расширить логику для сохранения типа действия.