Что такое AJAX и как его использовать в WordPress (пошаговое руководство)

AJAX — это популярная технология, используемая при разработке веб-сайтов, которая позволяет извлекать данные из серверной части и обновлять представление без необходимости перезагрузки веб-страницы. Следовательно, это поможет вам улучшить интерактивность, скорость и удобство использования вашего сайта. AJAX работает каждый раз, когда вы выполняете такие действия, как оставление комментария или публикация твита.

В этой статье я расскажу вам, что такое AJAX и как использовать AJAX в WordPress (также известный как WP AJAX). Давайте читать дальше!

Что такое АЯКС?

AJAX означает асинхронный JavaScript и XML, технологию, которая позволяет вам асинхронно отправлять запросы на сервер и вносить изменения в наши страницы без необходимости их перезагрузки. Сценарий AJAX запрашивает у сервера некоторые данные, а затем изменяет веб-страницы с полученными данными.

Например , представьте себе одно раскрывающееся меню, в котором вы выбираете дату встречи, а другой раскрывающийся список динамически показывает вам часы, доступные для резервирования. С помощью скрипта у сервера запрашивается количество часов, доступных для выбора лечения в раскрывающемся списке.

Как работает AJAX?

Миссия AJAX — служить мостом между вашим сайтом и сервером. Ядром этой асинхронной технологии является объект XMLHttpRequest, который обеспечивает обмен данными. Вот основные шаги для выполнения вызова AJAX:

– Источник: W3Schools

• Укажите информацию для отправки
• Настроить вызов
• Используйте объект XMLHttpRequest для отправки данных
• Получить и обработать ответ от сервера

Хорошо, что этот процесс можно упростить с помощью библиотеки jQuery.

Как использовать AJAX в WordPress?

WordPress изначально поддерживает AJAX. Вы можете увидеть «admin-ajax.php» внутри папки wp-admin.

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

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

Еще в 2013 году WordPress представил WordPress Heartbeat API, который предоставлял несколько важных функций, таких как функция автосохранения, истечение срока действия входа и предупреждение о блокировке публикации, когда другой пользователь пишет или редактирует запись WordPress.

Две очень важные функции Heartbeat API:

1. Автосохранение

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

– Автосохранение в WordPress

2. Почтовый замок

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

— Почтовая блокировка в WordPress

Вышеупомянутые функции стали возможными благодаря WordPress Heartbeat API, который создает соединение между сервером и браузером для соответствующей связи и ответов.

WordPress Heartbeat API формирует запросы на связь с сервером и запускает события при получении данных/ответа. Обычно это увеличивает нагрузку на сервер и в конечном итоге замедляет работу администратора WordPress.

Живой пример

Я захожу в панель управления WordPress и начинаю писать пост. Затем я оставляю вкладку открытой на несколько минут и начинаю просматривать другие вкладки. Панель управления все еще находится в системе, и вы можете видеть, что admin-ajax постоянно отправляет запросы.

– admin-ajax.php Отправка запросов на сервер

Согласно упомянутому выше билету, admin-ajax.php в WordPress генерирует запросы каждые 15 секунд. Запрос может быть любой связью с сервером.

Как плагины перегружают admin-ajax.php?

Большинство проблем в admin-ajax.php в WordPress можно отнести к запросам установленных плагинов. Эти плагины замедляют администратора WordPress, отправляя запросы на получение определенных функций, таких как запуск всплывающего окна или обновление счетчика социальных сетей.

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

Как диагностировать плагин в WordPress?

Важно правильно диагностировать плагин, чтобы определить его влияние на файл admin-ajax.php, который может замедлить работу администратора WordPress. Для этого мы будем использовать два инструмента: GTmetrix и WebPageTest.

В случае с GTmetrix перейдите на вкладку Waterfall, чтобы просмотреть полный список запросов. Присмотревшись к списку, вы увидите запросы POST, сделанные файлом admin-ajax.php.

– Диагностика плагинов в WordPress

В моем случае эти запросы в основном были сделаны плагином для обмена в социальных сетях. Этот конкретный плагин отправляет ajax-запрос учетным записям социальных сетей через API каждые 15 секунд, чтобы получить обновленный счетчик общего доступа.

Разверните вкладку для получения подробной информации. На вкладке ответа показано точное место, которое вызывает эти запросы.

Chrome поставляется с инструментами разработчика, которые могут помочь анализировать запросы, сделанные различными плагинами. Чтобы проверить это, откройте веб-сайт в Chrome, нажмите CTRL + Shift + I и перейдите на вкладку «Сеть».

– Запросы admix-ajax.php в Chrome

Перезагрузите страницу и увидите, что список заполняется обновленными запросами. В поле фильтра введите ajax или admin-ajax, чтобы отфильтровать нужные файлы. Это дает вам представление о количестве запросов, а также об их частоте и источнике запроса.

Затем нажмите на файл, чтобы увидеть дополнительную информацию. На вкладке ответа это дает вам некоторый намек на плагин, вызывающий этот запрос. В моем случае на этот раз это было вызвано плагином WP Popular (WPP), плагином, который выделяет самые популярные посты за определенный период времени.

Чтобы этого избежать, убедитесь, что используемый вами плагин обновлен. Если это не так, попробуйте создать тикет в службу поддержки, чтобы разработчики могли решить проблему. Если возможно, вы также можете заменить его другим плагином, который обновлен и не перегружает файл admin-ajax.php.

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

В следующем разделе мы увидим, как мы можем уменьшить эти запросы и предотвратить перегрузку файла admin-ajax.php.

Ускорьте панель управления WordPress

Чтобы ускорить серверную часть WordPress, лучше всего отключить Heartbeat API или, по крайней мере, установить более длительный временной интервал, чтобы он не попадал на сервер каждые несколько секунд.

Установить плагин Heartbeat API

Войдите в панель администратора WordPress. Перейдите к Плагины → Добавить новый → найдите Breeze → Установите и активируйте его.

- Установите Бриз в WordPress

Настроить плагин Breeze

Перейдите в «Настройки» → «Бриз» → «API Heartbeat». Там вы найдете 4 различных варианта настройки Heartbeat.

1. Control Heartbeat: вы можете переключить кнопку, чтобы включить или выключить Heartbeat API для вашего бэкэнда, редактора сообщений и внешнего интерфейса.
2. Heartbeat Frontend: это позволит вам изменить поведение вашего Front-end или полностью отключить его.
3. Редактор сообщений Heartbeat: это позволит вам изменить поведение вашего редактора сообщений WP или полностью отключить его.
4. Heartbeat Backend: это позволит вам изменить поведение вашего Backend или полностью отключить его.

– Настройки API сердцебиения в Breeze

Создать несколько правил

По умолчанию вы получаете частоту WordPress Heartbeat API по умолчанию, но вы можете создать несколько правил в зависимости от ваших требований. Например, вы можете захотеть, чтобы WordPress Backend (Dashboard) запускался через 2 минуты (120 секунд), а Post Editor — через 3 минуты (180 секунд). Для этого вам нужно создать два правила: одно для панели управления WordPress, а другое — для редактора сообщений. Установите их частоты на 2 и 3 минуты соответственно.

Обнаружение плагинов, использующих Heartbeat API

Теперь, когда вы все настроили, пришло время проверить, какие плагины используют файл admin-ajax.php и замедляют работу сайта.

Перейдите в GTmetrix и введите URL своего сайта. Анализ сайта займет несколько минут. После этого перейдите на вкладку Waterfall, и вы увидите, сколько времени требуется файлу для подключения и ответа. Прокрутите немного вниз и посмотрите, есть ли запись для POST admin-ajax.php. Если да, разверните его и перейдите на вкладку Post. Отсюда вы можете определить плагин-виновник.

В моем случае плагин «переключатель рабочего стола» использует файл admin-ajax.php и постоянно отправляет запросы на сервер. Это время для принятия решения; либо замените его другим плагином, либо скрестите пальцы.

– ПОСТ admin-ajax.php

Резюме

Учитывая набор функций, Heartbeat API очень полезен на вашем веб-сайте WordPress. Однако при неправильном использовании он может увеличить время загрузки бэкэнда и внешнего интерфейса WordPress, отправляя туда и обратно запросы WordPress Ajax.

Есть только два решения этой проблемы. Вы можете отключить/включить Heartbeat API только в нескольких местах или перейти на управляемый хостинг, который может справиться с нагрузкой запросов, а также сократить время отклика сервера.

Часто задаваемые вопросы