Webの4分の1以上がWordPressで実行されています 。それが周りにあったことを考えると、それはかなり注目に値する偉業です 10年以上 、それは技術の年ではかなり古いものになります。
WordPressの秘密のソースは何ですか?簡単–コンテンツを管理するための最もシンプルでありながら最も拡張可能な方法です。しかし、しばらくの間、WordPressは遅れをとっているようでした。
Webが没入型のインタラクティブなエクスペリエンスを作成するためにJavaScriptに依存するようになるにつれて、WordPressがユーザーと開発者がコンテンツを操作するための新しい方法を提供する必要があることがますます明らかになりました。
WordPressはPHP上に構築されており、今後も構築され続けますが、 WP REST API は、PHP WordPressコアのレガシーと、JavaScript Webアプリケーション、およびネイティブのモバイルアプリケーションとデスクトップアプリケーションの可能性と能力の間に橋を架ける試みです。
WordPress REST APIは、WordPress Webサイトのコンテンツを簡単に使用できるAPIに取り込み、WordPressがWeb上でコンテンツを公開するためのストレージおよび取得システムとして機能できるようにします。
WP REST APIがどこからともなく現れたと思うなら、あなたは間違っています。
完全に新しい機能をWordPressに追加するのは簡単な作業ではありません。オープンソースソフトウェアであるという性質上、WordPressの開発は、進歩を遂げるためにコミュニティ全体に依存しています。
APIの開発は、開発者が制御された環境でプロジェクトを実験し、貢献できるようにする別個の機能プラグインとして数年前に開始されました。
多くの反復と機能拡張、および2つの完全に別個のバージョンを通じて、REST APIの背後にある貢献者は、数千万のWebサイト上のデータへのオープンAPIアクセスを提供することの利点と計り知れない結果をテストおよび評価する必要がありました。
WordPress 4.4 、コードネーム「Clifford」は、プロジェクトの初期インフラストラクチャをWordPressコアに導入しましたが、エンドポイントは WordPress 4.7 、「ヴォーン」。
基本的に、これにより、開発者は実際にデータ自体を公開することなく、APIを強化する機能をテストする時間を確保できました。
初期のコンテンツエンドポイントがWordPressの現在のすべてのバージョンにマージされたので、プラグイン開発者とテーマ作成者は、従来のwp-adminエクスペリエンスの外でデータを取得、表示、および変更するための刺激的な新しい方法を試すことができます。
WP REST APIの重要性を理解するには、データをオンラインで共有する方法の基礎と、インターネットの方向性を理解することが役立つ場合があります。
HTTPは、私たちが毎日扱うほとんどのWebトラフィックの基盤です。ブラウザにURLを入力すると、 リクエスト 。対応するサーバーがリクエストを受信し、 応答 。この取引は、私たちがオンラインで行うほぼすべての基盤です。ブラウザが要求を行い、サーバーが応答を提供します。
リクエストの種類は、受け取る応答の種類に影響を与える可能性があります。ほとんどの場合、私たちはシンプルなものを作っています 取得する リクエスト:「ねぇGoogle、ランディングページをゲットして」 Googleが対応します。
Webがよりインタラクティブになるにつれて、私たちは他のHTTPリクエストを利用し始めました。 プット 、 役職 、および 削除 。
たとえば、ウェブサイトの検索バーに「ねぇGoogle、メールアドレスとパスワードをログインページに投稿して」と入力します。 Googleは私たちのために新しいセッションを開始し、異なる応答を提供します。
このプロトコルは、WordPressサイトを構築するための基本的な基盤です。
フォームとPHPを使用して、データベースにデータをGETおよびPOSTします。に反して 人気 意見 、WordPressのこの基盤となる基盤はすぐに変わることはありません。 WordPressが現在行っているのは、RESTfulAPIを介してWordPressデータを操作する新しい方法を開発者に提供することだけです。
資金調達のための標準的な投資銀行手数料はいくらですか
WordPress開発者 次のようなAPI全般に精通している必要があります。 ショートコードAPI そしてその オプションAPI 。これらのAPIは、WordPressを構成するコンポーネントの機能を定義するため、テーマとプラグインの作成者はWordPressのコア機能を拡張できます。ただし、WP RESTAPIは少し異なります。
に 残り 、またはRESTful APIは、外部ソースからのHTTPリクエストにデータを安全に公開することを目的としています。また、これらのリクエストに応答するための共通のアーキテクチャと一連のプロトコルを設定することも重要です。このタイプのサービスの背後には、より高度なアイデアと原則がありますが、それらはこの記事の範囲を超えています。
特にWordPress4.7以降のWPREST APIの存在は、投稿、ページ、コメント、公開投稿メタなど、サイトのすべてのコンテンツに生データとして直接アクセスできるようになったことを意味します。また、必要に応じて、モバイルアプリやデスクトップアプリを使用して、従来のwp-adminの外部からこのデータに変更を加えることができることも意味します。
データをデータベース内の単なる行と考える代わりに、JSONの形式でデータにシリアルアクセスできるようになりました。
WordPressの獣医は、サイト間でコンテンツを共有するための一般的な形式であるXMLについて多くの経験を持っています。
XMLと同様に、JSONは、データを特定の構文にバンドルすることでデータを簡単に転送できるようにするメカニズムにすぎません。 JSONは実際には文字列であり、JavaScriptオブジェクトのテキスト表現であり、キーと値のペアのセットにデータを格納します。 WordPress投稿の一般的なJSON表現は次のようになります。
{ “id”: 1, “title”: { “rendered”: “Hello World” }, “content”: { “rendered”: “Welcome to WordPress. This is your first post. Edit or delete it, then start blogging!” } }
(あなたは使用することができます JSONフォーマッターツール 必要に応じてJSON応答をきれいにします。)
WP REST APIを介した完全なJSON応答には、メタデータなど、投稿に関する追加情報が含まれます。このデータをJSON形式に便利にバンドルすることで、WordPressコンテンツを新しくエキサイティングな方法で操作できます。
JSONがJavaScriptと最適にペアになっているのは偶然ではありません。より多くのWordPress開発者が「 JavaScriptを深く学ぶ 」、バックエンドとしてのWordPressの使用がますます高度になるでしょう。
REST APIを介してすべてのサイトデータにアクセスするのは、URLを作成するのと同じくらい簡単です。
バージョン4.7以降を実行しているWordPressサイトの場合は、サイトのURLの末尾に次の文字列を追加します。/wp-json/wp/v2
(例:http://example.com/wp-json/wp/v2
)。そのURLをブラウザに入力して、何が表示されるかを確認します。
ブラウザをインストールしていない限り、結果はおそらくデータの大きな混乱のように見えます 拡張 JSONをクリーンアップします。その大きなデータの混乱は、JSON形式の特定のWordPressサイトのコンテンツとメタ情報です。
そのコンテンツをロードすることで、 ルート そしてあなたのブラウザにあなたのためにそれを手に入れるように頼んだ。
ルートは、特定のメソッドにマッピングされたURLです。 WordPressコアはそのルートを読み取り、すべてのスラッシュ「/」は特定のルートを表します 道 、またはパラメータ、従う必要があります。
javascriptは日付をタイムスタンプに変換します
パスはで終わります 終点 、WordPressコアの奥深くにある機能が、提供するデータと提供されたデータの処理について決定を下すことができます。
エンドポイントの例は「/ wp-json / wp / v2 / posts / 1」で、パス「/ posts」と「/ 1」を追加しました。この特定のエンドポイントは、データを調べ、投稿をプルアップし、IDが1の投稿をプルアップするようにサイトに指示します。
REST APIを非常に便利なものにしているのは、REST APIが拡張可能であるという事実です。つまり、Webサイト内の任意のデータを取得し、それをエンドポイントとして追加できます。現在、WordPressのコア機能のほとんどがサポートされています(または間もなくサポートされる予定です)。
ただし、テーマとプラグインの開発者は、カスタムコンテンツと設定をエンドポイントとして追加し始めることができるため、ユーザーは新しい方法でWebサイトを操作できます。
WordPressサイトで現在利用可能なエンドポイントについて知りたい場合は、次のようなブラウザアプリケーションを使用してください。 郵便配達員 APIを探索するためのGUIを提供します。
ブラウザにURLエンドポイントを入力するのは簡単に見えますが、実際にはデフォルトのセットが含まれています ヘッダー リクエストと一緒に。次に、ヘッダーのセットも応答とともに返送されます。これらのヘッダーには多くの有用な情報が含まれていますが、私たちの目的にとって最も重要なものは、私たちが行っている要求のタイプと、私たちが認証されているかどうかに関係しています。
ブラウザの「開発者ツール」にジャンプすると、HTMLファイル、CSSスタイルシート、画像など、ブラウザウィンドウに読み込まれるアセットのHTTPヘッダーを調べることができます。
考慮すべき最初のヘッダーは リクエスト方法 、これは、前に学習したHTTPリクエストに直接対応します。ここでは、おそらくGET
が表示されます。単にページを表示している場合は、リクエストメソッドとして。
REST APIを呼び出すアプリケーションは、ヘッダーのリクエストメソッドをPOSTに変更することを選択する場合があります。
POSTメソッドは、WordPressデータベースに新しいデータを入力するか既存のデータを変更するようにWebサイトに指示します。 POSTメソッドを介して情報を送信することにより、他のアプリケーションはwp-adminにログインせずにデータを変更することができます。
ただし、適切な資格情報を提供するヘッダーも含まれていない限り、心配する必要はありません。 認証 、あなたのウェブサイトはそれらを拒否します。
注意: ただし、REST APIへの呼び出しを認証するためのメソッドはまだ完成していません。そのため、 認証 RESTAPIを使用してデータを追加または変更したい開発者にとっての最大の参入障壁。
今のところ、以下を含む利用可能なオプションがあります プラグイン RESTAPIの背後にいる開発者から。認証を取り巻く標準的な手順がコアに組み込まれるにつれて、WP RESTAPIを広く使用するための最後のハードルが明らかになります。
WP REST APIを非常に強力なものにしているのは、一貫性があるという事実です。そのため、WordPress4.7以降を実行しているすべてのサイトで同じ基本的な結果を期待できます。ただし、WordPressは分散APIであるため、すべてのデータを取得できる場所は1つだけではありません。
WordPressを実行している各Webサイトは、固有のユーザーと認証を備えた固有のアプリケーションです。 REST APIを介してコンテンツを編集するには、個別の承認手法が必要になる場合がありますが、実際には、WordPressが実行するほとんどのブログの投稿に非常に簡単にアクセスできます。
実演するために、いくつかの人気のあるWordPress関連のブログからの最新の投稿の抜粋をロードする簡単なcodepenデモを作成します。もちろん、すべてWordPressで実行されます。その間、検索フォームを含めるので、実際にこれらすべてのサイトを一度に検索して、それぞれから関連する記事を引き出すことができます。
最後に、元のウェブサイトの記事全文を読むためのリンクを必ず含めます。
簡単な設定から始めましょう 見る インスタンスとそれを要素にマウントします。含まれます ブートストラップ そのため、後で追加するフォーム要素にグリッドと基本的なスタイルを設定できます。
データを定義するときは、サイトの名前(デフォルトの応答には含まれていません)、URL、および取得した投稿を保存する場所が必要になります。次に例を示します。
{ “name”: “wordpress.org”, “url”: “https://wordpress.org/news/wp-json/wp/v2/posts?per_page=3”, “posts”: [] }
URLの最後に最初のパラメータper_page
も含まれていることに気付くでしょう。通常、WP REST APIは、通常のWP_Queryループをページ分割するのと同じルールに従って結果をページ分割します。クエリは最初の3つの投稿に限定します。
次に、を定義します 方法 loadPosts()
は、ソースのリストをループし、次の結果を取得します。 ビュー-リソース 、空のposts
を入力します結果を含む各ソースの配列。
loadPosts : function(){ var self = this; self.sources.forEach(function(source, index){ self.$delete(source, 'posts'); // Get API with vue-resource self.$http.get(source.url).then(function(response) { self.$set(source, 'posts', response.data); }, function(response) { console.log('Error'); }); }); }
loadPosts()
への最初の呼び出しも含まれますVueインスタンスが正常にマウントされたとき。
mounted : function(){ this.$nextTick(function(){ // Load posts on initial page load this.loadPosts(); }); }
維持するloadPosts()
将来的には、APIを複数回呼び出し始めるときに、別のメソッドが役立ちます。 HTMLでは、Vueのシンプルなものを使用します リストレンダリング ディレクティブと テンプレート構文 すべての投稿を出力します。
動作するデモについては、埋め込まれたペンを参照してください。
ペンを見る WP REST API検索の例(フェーズ1) ブライアン・コーズ( @bacoords ) オン CodePen 。
サイドバーを追加し、さまざまなソースを表示/非表示にするためのフィルターをいくつか作成しましょう。これを行うには、sources
に新しいプロパティを追加しますオブジェクト、名前を付けるブール値 オン 。
フィルタを追加しているときに、日付を正しく表示できるようにVueフィルタを生成しましょう。 WordPressは、投稿の日付と時刻をUnixタイムスタンプとして保存します。
クレジットカード情報を無料でハッキング
サードパーティのライブラリを使用します Moment.js 日付をより読みやすい形式に変換します。
filters: { // Using Moment.js to convert post date to a readable format prettyDate: function(value){ // Return if date is empty if(!value) return ''; // Convert date to Moment.js var date = moment.utc(value); // Return formatted date return date.format('MMM DD, YYYY,'); } },
動作するデモについては、埋め込みペンを参照してください。
ペンを見る WP REST API検索の例(フェーズ1) ブライアン・コーズ( @bacoords ) オン CodePen 。
ここでは、APIリクエストに新しいパラメータを追加します。すでにper_page=3
を追加しました各サイトから取得する結果の数を制限するパラメーター。検索バーに何か書かれている場合は、追加のパラメータとして追加します。
これにより、各サイトに組み込まれている検索機能を、まるで私たちがそうであるかのように使用できるようになります。 検索バーのクエリ そのウェブサイトで。
検索バーを追加し、Vueを使用して変数に関連付けます vモデル 指令。
ユーザーが入力を開始すると、すべてのAPIをすぐに呼び出すのではなく、ボタンを追加して、フォーム送信にイベントをバインドします。次に、検索パラメーター(もちろん、URLエンコードされたURL)をURLに追加するメソッドをVueインスタンスに追加します。
generateUrl : function(source){ var self = this; // Add search parameters. if(self.searchQuery){ return source.url + '&search=' + encodeURI(self.searchQuery); }else{ return source.url; } }
動作するデモについては、埋め込みペンを参照してください。
ペンを見る WP REST API検索の例(フェーズ1) ブライアン・コーズ( @bacoords ) オン CodePen 。
これはWPREST APIの簡単な例ですが、WordPress自体の中でこのようなものの潜在的なアプリケーションを想像することができます。たとえば、「WordPressNews」メタボックスはすでに存在します。
このデモを簡単に変換できます WordPressプラグイン 、WordPressダッシュボードに表示します。これで、独自のWebサイトから直接WordPressおよびWebデザインのトップチュートリアルサイトのいくつかからヘルプを検索する機能が統合されました。
上記の例は、WP REST APIの機能のほんの一部にすぎませんが、データを操作し始めると明らかになり始める可能性のいくつかを伝える必要があります。ウェブサイト自体のユーザーエクスペリエンスを向上させるために使用する場合でも、外部ソースからデータを収集して操作するために使用する場合でも、強力なツールです。
一部の業界専門家は、コンテンツが「スクレイピング」されて他の場所に表示される可能性について懸念を表明していますが、この機能はRSSフィードに類似していることを覚えておくことが重要です。また、サイトの管理者がデータとは何かを明確に制御することが重要です。公開されていません。
WP REST APIがWordPressのファブリックに深く浸透するにつれて、おそらく気付かないうちに、その効果がわかり始めます。 例 シンプルなものから(Chris Coyier’s デザインに関する引用 )、複雑なシングルページアプリケーション( グッゲンハイムサイト )。
クレジットカードのハッキングにお金を追加する
WP REST APIのもう1つの一般的な使用例は、モバイルアプリケーションの開発です。
コンテンツはRESTからアクセスできるため 火 、開発者はiOSおよびAndroid用のネイティブアプリを作成でき、重複するデータソースを作成する必要がありません。
ユーザーがこれらのモバイルアプリを操作すると、開発者がこれをサポートするための複雑なインフラストラクチャを作成しなくても、元のウェブサイトのデータを取得して直接変換できるようになります。
ただし、REST APIのこれらの訪問者向けアプリケーションは、実際の影響がはるかに深いため、ほんの始まりに過ぎません。コア開発チームの目標の1つは、wp-adminインターフェース全体でそれを使い始めることです。
今後のWordPressのアップデートで、admin-ajaxが表示されるようになります 交換済み APIを支持して、メニューの編集や投稿の公開などの基本的な機能の速度を上げることができれば幸いです。
これは、WordPressと密接に関連している可能性があります。 焦点の増加 WordPress初心者のためのユーザーフレンドリーな出発点としてカスタマイザーとエディターで。
WP REST APIはそのままでも非常に便利ですが、まだやるべきことがあります。 APIは完全ではありません。追加する機能とエンドポイントはまだまだあります。
最終的には、WordPressサイトにアクセスしなくても操作できるようになります。現在、多くのサービスがカスタムAPIを使用してWordPressとやり取りしていますが、1つの標準WordPress REST APIに移行することで、同じ言語を話す、より多くのサイトとサービスを相互接続できるようになります。
WordPressは、ブロガーがつながり、考えやアイデアを共有するための方法であるブログプラットフォームとして始まりました。 WordPress REST APIの開発により、舞台裏で新しいレベルの接続と共有が見られるようになります。これにより、ユーザーはこれまで考えられなかった方法で自分の考えやアイデアを構築し、WordPressとそのユーザーをまったく新しいフロンティアに導くことができます。