REST APIの使用 - Backbone JavaScriptクライアント（Backbone JavaScript Client）

使用

使用

WP-API プラグインを有効にします。スクリプトを直接エンキューします:

wp_enqueue_script( 'wp-api' );

または、スクリプトの依存関係として:

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

ライブラリはルートエンドポイント（「スキーマ」）を解析し、一致する Backbone モデルとコレクションを作成します。これで、wp.api.models と wp.api.collections の 2 つのルートオブジェクトが利用可能になります。

モデルとコレクションには次のものが含まれます:

モデル:

カテゴリー
コメント
メディア
ページ
ページメタ
ページリビジョン
投稿
投稿メタ
投稿リビジョン
スキーマ
ステータス
タグ
タクソノミー
タイプ
ユーザー

コレクション:

カテゴリー
コメント
メディア
ページメタ
ページリビジョン
ページ
投稿
ステータス
タグ
タクソノミー
タイプ
ユーザー

これらのエンドポイントをそのまま使用して、標準の Backbone メソッド（モデル用の fetch、sync、save & destroy、コレクション用の sync）を使用してアイテムを読み取り、更新し、作成し、削除できます。また、これらのオブジェクトを拡張して独自のものにし、それらの上にビューを構築することもできます。

デフォルト値

各モデルとコレクションには、そのデフォルト値への参照が含まれています。例えば:


- 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
 <a name="available-methods"></a>
### 利用可能なメソッド
各モデルとコレクションには、対応するエンドポイントがサポートするメソッドのリストが含まれています。例えば、`````wp.api.models.Post````` から作成されたモデルには、次のメソッドの配列があります:  
``````bash
["GET", "POST", "PUT", "PATCH", "DELETE"]
`

受け入れられるオプション

各モデルとコレクションには、対応するエンドポイントが受け入れるオプションのリストが含まれています（オプションはモデルやコレクションを作成する際に第二引数として渡されることに注意してください）。例えば:


- author 
- context 
- filter 
- order 
- orderby 
- page 
- per_page 
- search 
- status
 <a name="localizing-the-api-schema"></a>
### API スキーマのローカライズ
クライアントは、`````wpApiSettings````` オブジェクトの一部としてローカライズされたスキーマを受け入れ、使用します。スキーマは現在デフォルトで渡されません。代わりに、クライアントはスキーマをロードするために API に AJAX リクエストを行い、その後ブラウザのセッションストレージにキャッシュします（利用可能な場合）。`````SCRIPT_DEBUG````` を有効にした client-js プラグインをアクティブにすると、ローカライズされたスキーマが使用されます。[client-js の例](https://github.com/WP-API/client-js/blob/master/client-js.php) または、[クライアントごとにスキーマを一度だけローカライズしようとするこのブランチ](https://github.com/WP-API/client-js/compare/features/only-localize-schma-once?expand=1)を確認してください。  
 <a name="waiting-for-the-client-to-load"></a>
### クライアントの読み込みを待つ
クライアントの起動は非同期です。API スキーマがローカライズされている場合、クライアントはすぐに起動できます。そうでない場合、クライアントはスキーマをロードするために AJAX リクエストを行います。クライアントは、クライアントが準備が整うのを待つための信頼できる待機を提供するロードプロミスを公開します:  
``````bash
wp.api.loadPromise.done( function() {
//... use the client here
} )
`

モデルの例:

投稿を作成し、そのカテゴリを編集するには、ログインしていることを確認し、次に:

// Create a new post
var post = new wp.api.models.Post( { title: 'This is a test post' } );
post.save();
// Load an existing post
var post = new wp.api.models.Post( { id: 1 } );
post.fetch();
// Get a collection of the post's categories (returns a promise)
// Uses _embedded data if available, in which case promise resolves immediately.
post.getCategories().done( function( postCategories ) {
  // ... do something with the categories.
  // The new post has an single Category: Uncategorized
  console.log( postCategories[0].name );
  // response -> "Uncategorized"
} );
// Get a posts author User model.
post.getAuthorUser().done( function( user ){
  // ... do something with user
  console.log( user.get( "name" ) );
} );
// Get a posts featured image Media model.
post.getFeaturedMedia().done( function( image ){
  // ... do something with image
  console.log( image );
} );
// Set the post categories.
post.setCategories( [ "apples", "oranges" ] );
// Get all the categories
var allCategories = new wp.api.collections.Categories()
allCategories.fetch();
var appleCategory = allCategories.findWhere( { slug: "apples" } );
// Add the category to the postCategories collection we previously fetched.
appleCategory.set( "parent_post", post.get( "id" ) );
// Use the POST method so Backbone will not PUT it even though it has an id.
postCategories.create( appleCategory.toJSON(), { type: "POST" } );
// Remove the Uncategorized category
postCategories.at( 0 ).destroy();
// Check the results - re-fetch
postCategories = post.getCategories();
postCategories.at( 0 ).get( "name" );
// response -> "apples"

コレクションの例:

最後の 10 件の投稿を取得するには:

var postsCollection = new 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();

リビジョンの操作

投稿またはページのリビジョンには、PostRevisions または PageRevisions コレクションを使用するか、Post または Page コレクションを通じてアクセスできます。

例えば、投稿 ID 1 のすべてのリビジョンのコレクションを取得するには:

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

リビジョンコレクションは、その親のコレクションを介してもアクセスできます。この例では、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 サポートを追加すると、新しいモデルとコレクションが得られます。作成したカスタムエンドポイントにアクセスするには、アイテムの JSON エンドポイント名を CamelCase で使用します。例えば、アイテムが /wp-json/wp/v2/my-custom-post の JSON パスにある場合、wp.api.collections.MyCustomPost で API にアクセスできます。注意: スキーマは再取得を避けるためにユーザーのセッションキャッシュに保存されるため、新しいスキーマの読み取りを取得するには新しいタブを開く必要があるかもしれません。

// Extend wp.api.models.Post and wp.api.collections.Posts to load a custom post type
const CustomPost = wp.api.models.Post.extend( {
  urlRoot: wpApiSettings.root + 'wp/v2/custom_post_slug',
  defaults: {
   type: 'custom_post_slug',
  },
} );
const CustomPosts = wp.api.collections.Posts.extend( {
  url: wpApiSettings.root + 'wp/v2/custom_post_slug',
  model: BLProduct,
} );
const someCustomPosts = new CustomPosts();
someCustomPosts.fetch().then( ( posts ) => {
  // do something with the custom posts
} );