WP-API Javascript клієнт

У REST API є JavaScript клієнт, який дозволяє зручно спілкуватися із сайтом. Бібліотека містить Моделі та Колекції на всі кінцеві точки WP, описані в розділі Маршрути WP з коробки , а також на всі ендпоінти, створені вручну.




Використання

Щоб увімкнути бібліотеку WP API, потрібно підключити скрипт wp-api.

Зробити це можна безпосередньо:

wp_enqueue_script( 'wp-api');

або через залежність від нашого скрипта, наприклад, my_script :

wp_enqueue_script( 'my_script', 'path/to/my/script', array('wp-api') );

Скрипт wp-api підключає із собою (залежить від наступних скриптів):
‘jquery’, ‘backbone’, ‘underscore’, ‘wp-api-request’

Бібліотека аналізує кореневу кінцеву точку (схему REST API) та створює за нею Backbone моделі та колекції. Таким чином, у нас з’являються два основних об’єкти: wp.api.models і wp.api.collections , які містять наступні JS методи:

// Моделі:
wp.api.models.Category
wp.api.models.Comment
wp.api.models.Media
wp.api.models.Page
wp.api.models.PageMeta
wp.api.models.PageRevision
wp.api.models.Post
wp.api.models.PostMeta
wp.api.models.PostRevision
wp.api.models.Schema
wp.api.models.Status
wp.api.models.Tag
wp.api.models.Taxonomy
wp.api.models.Type
wp.api.models.User

// Колекції:
wp.api.collections.Categories
wp.api.collections.Comments
wp.api.collections.Media
wp.api.collections.PageMeta
wp.api.collections.PageRevisions
wp.api.collections.Pages
wp.api.collections.Posts
wp.api.collections.Statuses
wp.api.collections.Tags
wp.api.collections.Taxonomies
wp.api.collections.Types
wp.api.collections.Users

Ми можемо використовувати ці об’єкти (кінцеві точки) для читання/оновлення/створення/видалення елементів за допомогою стандартних методів ( fetch , sync , save та destroy для models, sync для collections).

Повний список методів та властивостей дивіться у коді скрипта wp-includes/js/wp-api.js .




Значення за замовчуванням

Кожна Модель та Колекція містить посилання на значення за замовчуванням, наприклад:

wp.api.models.Post.prototype.args

author : null
comment_status : null
content : null
date : null
date_gmt : null
excerpt: null
featured_image : null
format : null
modified : null
modified_gmt : null
password : null
ping_status : null
slug : null
status : null
sticky: null
title : null




Доступні методи

Кожна Модель та Колекція містить перелік методів, які підтримує відповідна кінцева точка. Наприклад, модель wp.api.models.Post має такі методи:

["GET", "POST", "PUT", "PATCH", "DELETE"]




Параметри, що приймаються

Кожна Модель та Колекція містить список параметрів, які приймає відповідна кінцева точка (зверніть увагу, що параметри передаються як другий аргумент при створенні моделей або колекцій), наприклад:

wp.api.collections.Posts.prototype.options

// містить:
author
context
filter
order
orderby
page
per_page
search
status




Приклади використання моделей

Щоб створити/змінити запис (пост), переконайтеся, що ви авторизовані і ви маєте достатні для цього права.

// Створюємо новий пост
var post = new wp.api.models.Post( { title: 'Це пробний пост' } );
post.save();

Приклад роботи із записом (постом):

// Отримаємо пост ID=1
var post = new wp.api.models.Post( { id: 1 } );
post.fetch();

// Отримаємо колекцію категорій посту (поверне promise).
// Використовує _embedded дані (якщо можна), у цьому випадку promise спрацьовує негайно.
post.getCategories().done( function( postCategories ) {
	// ... робимо щось із рубриками
	// Новий пост має лише одну рубрику: Uncategorized
	console.log(postCategories[0].name); // виведе "Uncategorized"
} );

// Отримаємо автора посту (User модель)
post.getAuthorUser().done( function( user ){
	// ... робимо щось із користувачами
	console.log(user.get("name"));
} );

// Отримаємо картинку посту (Media модель).
post.getFeaturedMedia().done( function( image ){
	// ... робимо щось з картинкою
	console.log(image);
} );

// Встановимо рубрики посту
post.setCategories(["apples", "oranges"]);

Приклад роботи з рубриками:

// Отримаємо всі рубрики
var allCategories = новий wp.api.collections.Categories()
allCategories.fetch();

// Знайдемо рубрику apples
var appleCategory = allCategories.findWhere( { slug: "apples"} );

// Додамо отриманий вище пост у рубрику "apples" (встановимо рубрику для посту)
appleCategory.set("parent_post", post.get("id"));




Приклади використання Колекцій

Отримаємо 10 останніх постів:

var postsCollection = новий wp.api.collections.Posts();
postsCollection.fetch();

Отримаємо 25 останніх постів:

postsCollection.fetch( { data: { per_page: 25 } } );

Використовуємо фільтр, щоб змінити параметри сортування (order та orderby):

postsCollection.fetch( { data: { 'filter': { 'orderby': 'title', 'order': 'ASC' } } } );

Всі колекції підтримують пагінацію автоматично, і наступний пакет результатів можна отримати за допомогою more() :

postsCollection.more();

Отримаємо сторінку 5 з колекції:

posts.fetch ({data: {page: 5}});

Перевіримо чи є в колекції ще записи (пости):

posts.hasMore();




Очікування завантаження wp-api клієнта (скрипт)

Backbone.js завантажується асинхронно. Якщо схема api локалізована і не потрібно робити запит AJAX на отримання схеми, то клієнт починає роботу відразу ж. Однак, коли потрібно почекати повної готовності клієнта до роботи, потрібно використовувати loadPromise.done :

wp.api.loadPromise.done( function() {
	// Тут можна використовувати клієнт
} )




Робота з ревізіями

Через колекції PostRevisions або PageRevisions можна отримати всі ревізії постів/сторінок. Або ревізії можна отримати з колекцій Post або Page .

Наприклад, отримаємо всі ревізії посту 1:

var revisions = new wp.api.collections.PostRevisions({}, { parent: 1 });

Колекції редакцій можуть бути доступні через батьківську колекцію. У цьому прикладі виконується 2 HTTP-запиту замість одного, але тепер доступний вихідний запис та його редакції:

var post = new wp.api.models.Post( { id: 1 } );
post.fetch();
post.getRevisions().done( function( revisions ){
  console.log(revisions);
});

Якщо були додані свої кінцеві точки в API, вони також стають доступними як моделі/колекції. Наприклад, ви отримаєте нові моделі та колекції при додаванні підтримки rest API до користувача Тип запису .

Примітка: оскільки схема зберігається в кеші сеансу користувача, щоб уникнути повторного завантаження, може знадобитися відкрити нову вкладку, щоб отримати нове читання схеми.

Залишити відповідь

Ваша e-mail адреса не оприлюднюватиметься. Обов’язкові поля позначені *