Этот код можно вставить в файл functions.php темы. Он будет работать для любой темы, единственное, что нужно — изменить название основного скрипта темы, который загружается после jQuery.

ЗАПРОС ЧЕРЕЗ FETCH()

Если jQuery не используется в проекте, запрос можно выполнить с помощью функции fetch().

Внимание: fetch() отправляет данные через body, а не как параметры POST, что может привести к проблемам с распознаванием действия AJAX.

Пример 1:

Используйте URLSearchParams() для отправки данных в body и установите заголовок Content-Type как application/x-www-form-urlencoded:

const requestData = {
    action : 'add_application',
    info : 'some info'
}

const queryData = new URLSearchParams();
for ( const key in requestData ) {
    queryData.set( key, requestData[key] )
}

fetch( myajax.url, {
    method: "POST",
    body: queryData,
    headers: {
        'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8'
    },
})
.then(response => response.text())
.then(response => {
    console.log(response);
});

Пример 2:

Используйте FormData() для передачи данных в body:

const form = document.querySelector('form.my-form');

let formData = new FormData(form);
formData.set('action', 'add_application');

fetch( myajax.url, {
    method: "POST",
    body: formData,
})
.then(response => response.text())
.then(response => {
    console.log(response);
});

ЛОГИЧЕСКОЕ ПОДКЛЮЧЕНИЕ AJAX ХУКОВ

Я не углублялся в объяснение того, как правильно подключать AJAX через хуки в коде. Тем не менее, вот простая рекомендация:

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

Пример правильного подключения:

if (wp_doing_ajax()) {
    add_action( 'wp_ajax_myaction', 'ajax_handler' );
    add_action( 'wp_ajax_nopriv_myaction', 'ajax_handler' );
}

БЕЗОПАСНОСТЬ: ИСПОЛЬЗУЙТЕ NONCES И ПРОВЕРКУ ПРАВ

Необходимо проверять AJAX-запросы, особенно если они могут изменять данные.

1. Код Nonce

Nonce — это уникальная строка, используемая только один раз, чтобы убедиться, что запрос пришёл из правильного источника. В WordPress есть функции wp_create_nonce() и check_ajax_referer(), позволяющие работать с nonce.

Создайте код nonce:

add_action( 'wp_enqueue_scripts', 'myajax_data', 99 );
function myajax_data() {
    wp_localize_script( 'theme-script', 'myajax', [
        'url' => admin_url('admin-ajax.php'),
        'nonce' => wp_create_nonce('myajax-nonce')
    ]);
}

При обработке запроса проверьте nonce:

add_action( 'wp_ajax_myajax-submit', 'myajax_submit' );
function myajax_submit() {
    check_ajax_referer('myajax-nonce', 'nonce_code');

    echo 'Возвращённые данные';
    wp_die();
}

2. Проверка прав доступа

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

if (!current_user_can('publish_posts')) {
    die('Этот запрос доступен пользователям с правами автора и выше.');
}

ВКЛЮЧЕНИЕ КЭШИРОВАНИЯ ДЛЯ AJAX ЗАПРОСОВ

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

Чтобы включить кэширование для определённых AJAX-запросов, посмотрите на функцию nocache_headers().

ПОИСК ОШИБОК И УВЕДОМЛЕНИЙ

При выполнении AJAX-запросов могут возникать ошибки и нежелательные уведомления. Что касается отладки, вы можете использовать функции print_r() или var_dump() для проверки содержимого нужных переменных.

ОТЛАДКА (ВЫВОД ОШИБОК НА ЭКРАН)

WordPress не отображает ошибки запросов AJAX даже при включённом режиме отладки WP_DEBUG. Чтобы включить отображение ошибок, добавьте следующий код:

if (WP_DEBUG && WP_DEBUG_DISPLAY && (defined('DOING_AJAX') && DOING_AJAX)) {
    @ ini_set( 'display_errors', 1 );
}

ОШИБКА ПРИ ВОЗВРАТЕ ДАННЫХ

Если AJAX-запрос к файлу wp-admin/admin-ajax.php не удался, то он вернёт ответ -1 или 0:

• -1 — ошибка в проверке запроса.
• 0 — возвращается пустой результат.

ПЛАГИНЫ

Плагин AJAX Simply — добавляет класс, который позволяет удобно и быстро писать AJAX-запросы на клиентской стороне и обрабатывать ответы на серверной стороне.

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