Как использовать REST API в WordPress для создания страницы настроек

Автор: Николай Фомин | Опубликовано: 22.11.2025

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

Что такое REST API в WordPress и зачем он нужен для настроек

REST API — это набор эндпоинтов, через которые можно обращаться к данным сайта и управлять ими с помощью HTTP-запросов. В WordPress с версии 4.7 API встроен по умолчанию и позволяет работать с постами, пользователями, таксономиями и, что важно, создавать свои собственные маршруты и методы.

Использование REST API для страниц настроек позволяет создавать более удобный и отзывчивый интерфейс, например, на React или Vue. Вместо стандартных форм с перезагрузкой, можно сохранить настройки через AJAX-запросы, получая мгновенный отклик.

Также это значительно упрощает интеграцию настроек с внешними сервисами и расширение функционала.

Регистрация собственного REST API маршрута для сохранения настроек

Первый шаг — зарегистрировать новый маршрут, который будет принимать и сохранять данные настроек. Для этого добавим в файл плагина или functions.php темы следующий код:

add_action('rest_api_init', function () {
    register_rest_route('wpstuff/v1', '/settings', [
        'methods' => 'POST',
        'callback' => 'wpstuff_save_settings',
        'permission_callback' => function () {
            return current_user_can('manage_options');
        },
    ]);
});

function wpstuff_save_settings(WP_REST_Request $request) {
    $params = $request->get_json_params();

    if (!isset($params['option_name']) || !isset($params['option_value'])) {
        return new WP_Error('missing_params', 'Отсутствуют необходимые параметры', ['status' => 400]);
    }

    $option_name = sanitize_text_field($params['option_name']);
    $option_value = sanitize_text_field($params['option_value']);

    update_option($option_name, $option_value);

    return ['success' => true, 'message' => 'Настройки сохранены'];
}

Здесь мы создаём маршрут wpstuff/v1/settings, который принимает POST-запросы и вызывает функцию wpstuff_save_settings. В функции проверяется, что пользователь имеет права администратора, а также что переданы обязательные параметры. Затем данные сохраняются в базу через update_option.

Объяснение кода регистрации маршрута

Хук rest_api_init вызывается при инициализации REST API. Функция register_rest_route регистрирует новый маршрут, указывая пространство имён и путь. Параметр permission_callback гарантирует безопасность — только администраторы смогут менять настройки.

Функция обратного вызова получает объект запроса, откуда берёт данные в формате JSON, валидирует и сохраняет их в базу данных.

Создание интерфейса страницы настроек с использованием JavaScript и REST API

Теперь создадим страницу настроек в админке WordPress, которая будет использовать наш REST API маршрут для сохранения данных без перезагрузки.

Добавим меню и подключим скрипт:

add_action('admin_menu', function () {
    add_menu_page('Настройки WPStuff', 'WPStuff Settings', 'manage_options', 'wpstuff-settings', 'wpstuff_render_settings_page');
});

function wpstuff_render_settings_page() {
    ?>
    <div id="wpstuff-settings-app">
        <h2>Настройки WPStuff</h2>
        <label for="option_value">Значение опции:</label>
        <input type="text" id="option_value" />
        <button id="save_settings">Сохранить</button>
        <div id="status_message"></div>
    </div>
    <script>
        (function() {
            const button = document.getElementById('save_settings');
            const input = document.getElementById('option_value');
            const status = document.getElementById('status_message');

            button.addEventListener('click', () => {
                const value = input.value;
                fetch(ajaxurl.replace('admin-ajax.php', 'wp-json/wpstuff/v1/settings'), {
                    method: 'POST',
                    headers: {
                        'Content-Type': 'application/json',
                        'X-WP-Nonce': wpApiSettings.nonce
                    },
                    body: JSON.stringify({
                        option_name: 'wpstuff_custom_option',
                        option_value: value
                    })
                })
                .then(response => response.json())
                .then(data => {
                    if (data.success) {
                        status.textContent = data.message;
                        status.style.color = 'green';
                    } else {
                        status.textContent = 'Ошибка сохранения настроек';
                        status.style.color = 'red';
                    }
                })
                .catch(() => {
                    status.textContent = 'Ошибка сети';
                    status.style.color = 'red';
                });
            });
        })();
    </script>
    <?php
}

add_action('admin_enqueue_scripts', function () {
    wp_enqueue_script('wp-api');
    wp_localize_script('wp-api', 'wpApiSettings', ['nonce' => wp_create_nonce('wp_rest')]);
});

Здесь мы создаём страницу меню WPStuff Settings и выводим простую форму с полем ввода и кнопкой. При нажатии отправляется POST-запрос на наш REST API маршрут с данными из поля.

Для безопасности мы передаём nonce в заголовке X-WP-Nonce, чтобы WordPress мог проверить легитимность запроса.

Особенности реализации интерфейса

Используется глобальная переменная ajaxurl, которая автоматически присутствует в админке, и модифицируется для формирования URL нашего REST API. Скрипт обрабатывает успешный и неуспешный ответ, выводя сообщение пользователю.

Это базовый пример, который можно расширить добавлением валидации, загрузкой текущих настроек при загрузке страницы и использованием современных фреймворков.

Безопасность и валидация данных в REST API

Безопасность — ключевой момент при работе с REST API. В нашем примере мы:

Используем permission_callback для проверки прав пользователя;
Проверяем и очищаем входящие данные с помощью sanitize_text_field;
Используем nonce в заголовках для защиты от CSRF;
Возвращаем понятные ошибки с HTTP-кодами.

При расширении функционала стоит подумать о более строгой валидации в зависимости от типа данных (числа, email, URL) и логике приложения, а также логировать действия для аудита.

Примеры полезных плагинов для работы с REST API в WordPress

Если хотите упростить работу с REST API или расширить её, обратите внимание на следующие плагины:

WP REST API Controller — позволяет настраивать доступ к различным эндпоинтам без кода;
Advanced Custom Fields (ACF) to REST API — интегрирует поля ACF в REST ответы;
REST API Helper — добавляет удобные функции и фильтры для кастомизации API.

Эти расширения помогут вам быстрее внедрять REST API в свои проекты и не писать всё с нуля.

Итог: почему стоит использовать REST API для настроек в WordPress

REST API открывает новые возможности для создания современных и удобных интерфейсов админки. Вы можете создавать динамические страницы настроек, интегрировать внешний функционал, улучшать UX без перезагрузок и делать интерфейс более отзывчивым.

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

Используйте возможности WordPress REST API и делайте свои сайты и плагины лучше и удобнее для пользователей!