WooCommerce: как исправить отсутствие обновления корзины при добавлении товара через AJAX

Диагностика проблемы с обновлением корзины в WooCommerce

Одна из частых проблем в WooCommerce — после добавления товара в корзину через AJAX визуальное обновление количества товаров или суммы не происходит, хотя товар добавляется на сервере. Пользователь видит старое значение в корзине, что ухудшает UX и ведёт к недоверию.

Причины могут быть разными:

• Отсутствие вызова стандартных WooCommerce скриптов, отвечающих за обновление корзины.
• Кастомные темы или плагины, которые нарушают правильную работу AJAX-обработчиков.
• Кэширование на стороне сервера или в браузере, мешающее обновлению данных.
• Неправильная реализация AJAX-логики вручную без использования хуков WooCommerce.

Пошаговое решение: корректное обновление корзины по AJAX

1. Использование стандартного события WooCommerce

WooCommerce при добавлении товара через AJAX триггерит событие added_to_cart, которое можно использовать для обновления фрагментов корзины.

jQuery( function($) {
  $('body').on('added_to_cart', function() {
    // Перезагрузить фрагменты корзины
    $.ajax({
      url: wc_add_to_cart_params.wc_ajax_url.toString().replace('%%endpoint%%', 'get_refreshed_fragments'),
      type: 'POST',
      success: function(data) {
        if (data && data.fragments) {
          $.each(data.fragments, function(key, value) {
            $(key).replaceWith(value);
          });
        }
      }
    });
  });
});

2. Проверка поддержки в теме

В теме должен быть вызов woocommerce_cart_fragments — скрипта, который отвечает за обновление корзины. Обычно он добавляется через wp_enqueue_scripts:

add_action('wp_enqueue_scripts', function() {
  if (function_exists('is_woocommerce') && is_woocommerce()) {
    wp_enqueue_script('wc-cart-fragments');
  }
});

Если тема отключает этот скрипт, то корзина не обновится автоматически.

3. Отключение кэширования для динамических фрагментов корзины

Кэширование страниц (например, через плагин кеша или на уровне сервера) блокирует обновление корзины. Необходимо исключить страницы WooCommerce и AJAX-запросы из кэша. Важные URL:

• cart
• checkout
• wp-admin/admin-ajax.php

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

• Добавьте товар в корзину на фронтенде без перезагрузки страницы.
• Проверьте, обновилось ли количество и сумма в иконке корзины.
• Откройте консоль браузера — ошибок JavaScript быть не должно.
• В Network проверьте успешность AJAX-запроса get_refreshed_fragments и корректность ответа.

Частые ошибки и как их исправить

1. Отсутствие события added_to_cart

Если тема или плагин используют кастомный AJAX без триггера этого события, скрипты WooCommerce не сработают. Решение — добавить вручную:

jQuery('body').trigger('added_to_cart');

2. Отключение скрипта wc-cart-fragments

Некоторые оптимизационные плагины отключают этот скрипт для уменьшения нагрузки. Это ломает обновление корзины. Проверьте, что скрипт подключён и не отключён.

3. Конфликты с другими плагинами

Деактивируйте по очереди плагины, чтобы выявить конфликт. Особенно обращайте внимание на плагины кеширования и кастомные AJAX-решения.

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

• Фильтруйте и валидируйте все данные, отправляемые через AJAX.
• Используйте wp_nonce_field и проверяйте nonce в обработчиках AJAX.
• Исключайте страницы корзины и оформления заказа из кэширования.
• Оптимизируйте запросы в обработчиках AJAX, чтобы избежать нагрузки на сервер.

Сравнение способов обновления корзины в WooCommerce