Как использовать REST API WordPress для автоматического обновления контента

Диагностика задачи: зачем нужно автоматическое обновление контента через REST API

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

Пошаговое решение: создание автоматического обновления через REST API

1. Убедитесь, что REST API активен и доступен

По умолчанию REST API включен в WordPress. Для проверки откройте https://ваш-сайт/wp-json/wp/v2/posts — должен вернуть JSON с последними публикациями.

2. Создайте JavaScript для периодического запроса новых данных

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

function fetchLatestPosts() {
  fetch('/wp-json/wp/v2/posts?per_page=5')
    .then(response => response.json())
    .then(posts => {
      const container = document.getElementById('latest-posts');
      container.innerHTML = '';
      posts.forEach(post => {
        const postEl = document.createElement('div');
        postEl.innerHTML = `<h3>${post.title.rendered}</h3><p>${post.excerpt.rendered}</p>`;
        container.appendChild(postEl);
      });
    })
    .catch(console.error);
}

// Запуск обновления каждые 60 секунд
setInterval(fetchLatestPosts, 60000);

// Инициализация при загрузке страницы
window.addEventListener('DOMContentLoaded', fetchLatestPosts);

3. Добавьте контейнер для вывода в шаблон темы

<div id="latest-posts"></div>

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

Откройте страницу с контейнером latest-posts. Вы должны увидеть 5 последних постов, которые автоматически обновляются каждую минуту. Можно проверить работу через консоль браузера: ошибок быть не должно, а запросы должны уходить каждые 60 секунд.

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

• Ошибка 404 на запрос REST API: проверьте наличие файла .htaccess и правильность правил перезаписи. В админке перейдите в «Настройки» → «Постоянные ссылки» и сохраните настройки заново.
• Проблемы с CORS: если фронтенд на другом домене, настройте заголовки CORS в WordPress или на сервере.
• Неправильный ID контейнера: убедитесь, что в шаблоне есть элемент с id="latest-posts".
• Проблемы с безопасностью: если планируется отправка данных, используйте nonce и авторизацию для REST API.

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

• Используйте per_page с разумным числом, чтобы не нагружать сервер.
• Кэшируйте ответы REST API через серверные механизмы или плагины, чтобы снизить нагрузку.
• Для аутентификации используйте OAuth или JWT, если делаете POST/PUT запросы.
• Включите проверку nonce при изменении данных через REST API.

Сравнение вариантов обновления контента в WordPress