エンジニアの関です。
4月でいよいよ社会人3年目です。最近、時代の流れの速さに怯えています。
私は普段WordPressで開発をしているのですが、よくこんな言葉を耳にします。
「PHPの知識がないからカスタムができない」
WordPressには初心者でも使いやすいようにプラグインやテーマなどを数多く取り揃えているのですが、自由にカスタムしたいとなると、やはりPHPの知識が必要になってきます。
そこで今回は、PHPを一切使わずにWordPressから動的にデータを取得・表示する方法をご紹介したいと思います。
制作物は以下に置いてありますのでよかったらどうぞ。
https://github.com/hseki-luckey/getposts_rest-api
目次
はじめに
今回は「WP REST API」を使用していきます。
これは4.7系から標準で使えるようになった機能で、WordPress界隈では今アツいとされています。
要はアクセスするだけで投稿の取得から編集・削除などが出来ちゃう超便利な機能です。
お使いのWordPressでサポートされているかは、以下のURIにアクセスして確認してみてください。
/wp-json/wp/v2/
サポートされている場合、こんな画面が表示されるはずです。
見て分かる通りデータが全てjson形式で返ってきます。
実際に作ってみる
今回の目標
今回は投稿の一覧ページを作っていきたいと思います。仕様は以下の通りです。
- 投稿日が最新の記事から5件取得
- ステータスは「公開済み」
- 「タイトル」「著者」「公開日」「概要(100文字程度)」「カテゴリ」を表示
- 「カテゴリ」には各カテゴリ一覧へのリンクを付ける
うまくいくとこんな画面が表示されます。
実装方法
表題でも挙げている通り今回はPHPを一切使いません。
(断固とした気持ちを表すべく、ファイル形式も「.php」ではなく「.html」にしてみました。)
基本的にはWP REST APIを使ってデータを取得し、JQueryで解析・表示を行っていきます。
ただ、非同期通信だとデータを完全に取得する前に入れ子になっている次のデータを取得しようとしてしまい、上手くデータを取得・表示できなくなってしまうため(泣く泣く)同期通信にしています。
1.投稿情報を取得
投稿を取得するためのURIは以下の通りです。
/wp-json/wp/v2/posts/
さらに取得したい情報に合わせて、以下のようなパラメータをつけてあげます。
- per_page=5・・・5件取得
- status=publish・・・ステータスが「公開済み」のみ
- orderby=date・・・日付順に取得
- order=desc・・・降順
他のパラメータも含めて詳しくはこことか見てみると幸せになれると思います。
2.著者情報を取得
上記で取得したものの中に、こんなjsonが入っているはずです。
"_links": { "author": [{ "embeddable": true, "href": "サイトURL/wp-json/wp/v2/users/1" }] }
「”href”: “サイトURL/wp-json/wp/v2/users/1″」は著者情報を取得するのに必要なURLを表しているので、これを使っていきましょう。
(※ユーザ情報は基本的には「/wp-josn/wp/v2/users/ユーザID」で取得できます。)
3.カテゴリ情報を取得
カテゴリ情報を取得するためのURIは以下の通りです。
/wp-json/wp/v2/categories/カテゴリID
上記の通り記事に付けられているカテゴリIDが必要になるのですが、1で取得したものの中に以下のようなjsonが含まれているはずなのでそれを使っていきましょう。
(※カテゴリIDで値が返ってきています。)
"categories": [17, 1]
4.JQueryでjsonを取得
以下とか参照してみてください。基本的には取得は「$.getJSON」を使っています。
http://qiita.com/miiitaka/items/f77cb83b9dfcd05aea82
で、最終的に出来たものは、コチラです。
https://github.com/hseki-luckey/getposts_rest-api/blob/master/getposts-ver2.html
おわりに
他サイトとの連携やAjaxでのやり取りなどでWP REST APIはまだまだ活用できそうだと思いました。
「余計な設定なし」というところが気に入ったので、機会があればもっと使ってみたいです。
(ただ次使うとしたらJQueryではなくPHPでだろうな・・・。)
最後に、WP REST APIを使用されない場合は以下のようなコードをfunctions.phpに追加・停止してしまうことを推奨します。
(そういえば少し前に「WordPress史上最悪のバグ」として有名になりましたね・・・orz)
使用される場合も使用範囲を狭めるなど十分な対策が必要です。
// REST APIにアクセスすると403エラーを返す function not_allow_access_in_rest_access($access){ return new WP_Error( 'rest_cannot_access', __('Can not access the REST API.', 'disable-json-api'), array('status' => rest_authorization_required_code()) ); } add_filter('rest_authentication_errors', 'not_allow_access_in_rest_access');
リスクを踏まえて正しく使えば超便利な機能です。
ぜひ快適なREST APIライフを!
☆.。:・★.。:・☆.。:☆.。:・★.。:・☆.。:・★.。:・☆☆.。:・★.。:・☆.。:☆.。:・★.。:*・☆☆
株式会社リンクバルでは一緒に働くエンジニアを募集中です!
気になった方はコチラまで!
☆.。:・★.。:・☆.。:☆.。:・★.。:・☆.。:・★.。:・☆☆.。:・★.。:・☆.。:☆.。:・★.。:*・☆☆