Варианты отправки запросов
Общаться с REST API, т.е. отправлять к нему запросы и получать ответы, можно разными способами. Собственно, этим он и удобен и для этого создан. По сути тут нет никаких ограничений: любая программа, которая умеет отправлять запросы, может управлять сайтом удаленно. Или это можно делать из самого сайта, в этом случае будут создаваться AJAX запросы к REST API.
В этом разделе мы приведем несколько разных примеров кода, как можно отправлять запросы к REST API.
Тут сразу нужно разделить запросы сайта к самому себе и запросы одного сайта или приложение к другому сайту. Во многом эти запросы похожи, пожалуй, самое главное отличие в них это авторизация: когда запрос отправляет самому себе, то авторизация, как правило, не нужна, а когда удаленно к сайту, то авторизацию нужно проходить отдельно, подробнее об этом читайте в разделе Аутентификация в REST API.
Как сделать внутренний запрос к REST API из плагина?
Это можно сделать с помощью функции rest_do_request(). Она создает запрос к API внутри WordPress, т.е. технически запроса не происходит:
$request = new WP_REST_Request( 'GET', '/wp/v2/posts' ); // Установим параметры запроса $request->set_param( 'per_page', 20 ); $response = rest_do_request( $request );
Запрос с помощью Fetch в JavaScript
Fetch - это веб-api, который призван заменить оригинальный метод XMLHTTPRequests для работы с AJAX и HTTP запросами. Fetch поддерживается в последних версиях современных браузеров: см. полифилл по этой ссылке, если он нужен.
var apiURL = 'http://demo.wp-api.org/wp-json'; // Получим последние записи fetch( apiURL + '/wp/v2/posts/' ) .then( response => { if ( response.status !== 200 ) { throw new Error( 'Problem! Status Code: ' + response.status ); } response.json().then( posts => { console.log( posts ); // выведем в консоль }); }) .catch(function(err) { console.log( 'Error: ', err ); }); // Получим запись с ID=1 fetch( apiURL + '/wp/v2/posts/1' ) .then( response => { if ( response.status !== 200 ) { throw new Error('Problem! Status Code: ' + response.status); } response.json().then( post => { console.log( post ); }); }) .catch(function( err ) { console.error( err ); });
Сначала мы устанавливаем переменную apiURL, где содержится путь до корня REST API, чтобы использовать её дальше в коде.
В обоих примерах сначала выбрасываем ошибку (throw), если статус ответа не 200. Если ошибки нет, то превращаем ответ в json и обрабатываем его.
В конце ловим с помощью .catch() любые выброшенные нами ошибки.
Запрос с помощью jQuery AJAX
Пример JS кода на основе jQuery.
(function($) { var apiURL = 'http://demo.wp-api.org/wp-json'; // Получим последние записи $.ajax( { url: apiURL + '/wp/v2/posts/', success: function ( posts ) { console.log( 'Array of posts', posts ); }, error: function( err ) { console.log( 'Error: ', err ); } } ); // Получим запись с ID=1 $.ajax( { url: apiURL + '/wp/v2/posts/1', success: function ( post ) { console.log( 'Array of posts', post ); }, error: function( err ) { console.log( 'Error: ', err ); } }); })( jQuery );
Сначала мы устанавливаем переменную apiURL, где содержится путь до корня REST API, чтобы использовать её дальше в коде.
$.ajax автоматически преобразует JSON ответ в массив или объект JavaScript. Поэтому тут не нужны дополнительные преобразования, можно сразу работать с ответом, как будто это объект или массив JavaScript.