WordPress REST APIをセットアップして使用する方法：基本認証

このシリーズの前回の記事では、WordPress RESTAPIの紹介とWordPressRESTAPIでの投稿の取得について説明しました。

WordPress REST APIに関するシリーズの今回の記事では、サーバーで基本認証プロトコルを設定して、REST APIを設定し、さまざまなエンティティやチャネルとの安全な通信を維持する方法について説明します。

ただし、このチュートリアルは、認証の定義に関する理論的な説明から始めます。

認証とは何ですか？

情報通信技術（ICT）のコンテキストでは、認証は、特定のシステムへのアクセスを要求する個人またはエンティティの資格情報を検証するアイデアとプロセスです。

認証は承認とは異なることを理解することが重要です。 特定のWordPressWebホスティングサーバーで認証されると、システムへの一般レベルのアクセスが許可されます。 対照的に、人が許可されると、システムの一部または完全なリソースにアクセスして利用することができます。 つまり、認証はIDを確認し、承認はシステムのリソースへのアクセスを識別して許可します。

WordPress REST APIの特定のコンテキストでは、認証されたユーザーがCRUDタスクを実行できます。 ただし、ユーザーはすべてのステップで認証特権を証明する必要があります。

WordPress RESTAPIを使用した認証

WordPress REST APIは、認証のためのいくつかのオプションを提供し、それぞれが特定の目的を目的としています。

• 基本認証
• OAuth認証
• クッキー認証

現時点では、ユーザーとそのアクティビティのネイティブWordPress認証方法は、Cookieによる検証です。

WordPress REST APIでOAuth認証と基本認証を使用するには、GitHub WordPress RESTAPIグループで利用可能な特定のプラグインをインストールする必要があります。 これらの2つのメソッドが、WordPress RESTAPIの次のバージョンでネイティブサポートを受けることを願っています。

基本認証

基本認証とは、ログイン認証情報がリクエストのヘッダーとともに送信される基本タイプのHTTP認証を指します。

基本認証はどのように機能しますか？

基本認証では、クライアントは検証が必要なURLを要求します。 次に、サーバーは、401 Not Authorizedコードを送信することにより、クライアントに自身を識別するように要求します。 応答として、クライアントは、base64でエンコードされた文字列として追加された資格情報（ユーザー名とパスワードのペア）を使用して同じリクエストを送信します。 この文字列は、Authorizationヘッダーフィールドで次のように送信されます。

承認：基本b3dhaXMuYWxhbUBjbG91ZHdheXMuY29tOmVKNWtuU24zNVc =

base64文字列は手間をかけずにデコードできるため、この認証方法はあまり安全ではありません。 したがって、これらの方法は、サーバーとクライアントの間に絶対的な信頼があるシナリオでのみ使用する必要があります。 この方法のもう1つの重要なアプリケーションは、安全なシステム内でのトラブルシューティングです。

WordPress RESTAPIプラグインをインストールします

WordPress REST APIプラグインを使用すると、WordPressサイトに基本認証を追加できます。

注： 「SSLを使用しない場合は、本番環境でOAuth1.0a認証ハンドラーを使用することを強くお勧めします。」

WordPress REST APIプラグインは、GitHub WordPress RESTAPIグループから入手できます。 プラグインを利用するには、WordPressプラグインディレクトリにプラグインを複製し、WordPress管理者からアクティブ化します。

Postmanを使用して認証されたリクエストを送信する

認証リクエストの送信を開始するには、PostmanChrome拡張機能をインストールします。 これにより、API開発がより簡単に、より速く、よりスマートに、より良くなります。 Firefoxユーザーの場合、フル機能のRESTクライアントをブラウザーに提供するRESTEasyアドオンをインストールします。

ほとんどのHTTPクライアントと同様に、Postman for Chromeは、基本認証方法をネイティブに使用したリクエストの送信をサポートしています。

認証されたリクエストを送信するには、アドレスバーの下にある[認証]タブに移動します。

次に、ドロップダウンメニューから[基本認証]を選択します。 ユーザー名とパスワードの入力を求められます。 次に、[リクエストの更新]ボタンをクリックします。

認証オプションを更新すると、[ヘッダー]タブに変更が表示されます。 タブには、エンコードされたユーザー名/パスワード文字列のヘッダーフィールドが含まれるようになります。

これで、Postmanによる基本認証のセットアップが完了しました。 次に、認証を必要とするテストリクエストを送信します（投稿を削除してみてください）。

例– DELETE http://wordpressmu-19393-42425-140587.cloudwaysapps.com/wp-json/wp/v2/posts/50

wordpressmu-19393-42425-140587.cloudwaysapps.comは、開発サーバーのパスに置き換えることができます。

すべてがうまくいけば、サーバーは200 OKステータスを返し、 ID50の投稿が削除されたことを示します。

JavaScriptを使用して認証されたリクエストを送信する

JavaScriptは高レベルのインタプリタプログラミング言語であるため、最近ではJavaScriptがほぼすべての場所で見られるようになりました。 したがって、人気のあるJavaScriptフレームワークがWordPressと相互作用するのを見るのは非常に一般的です。 一般的なシナリオは、WordPressAPIと対話するjQueryの使用です。 このような場合、認証ヘッダーはAJAXリクエストで送信できます。

jQuery.ajax（）メソッドを介して送信された次のDELETEリクエストについて考えてみます。

 jQuery.ajax（{
   url： 'http：//wordpressmu-19393-42425-140587.cloudwaysapps.com/wp-json/wp/v2/posts/50'、
   メソッド： 'DELETE'、
   crossDomain：true、
   beforeSend：関数（xhr）{
       xhr.setRequestHeader（ '認証'、 '基本' + Base64.encode（ 'ユーザー名：パスワード'））;
   }、
   成功：function（data、txtStatus、xhr）{
       console.log（データ）;
       console.log（xhr.status）;
   }
}）;

ここで、Base64は、base64文字列のエンコードとデコードに使用されるオブジェクトです。 これは、jQuery.ajax（）メソッド呼び出しのすぐ上で次のように定義されています。

 var Base64 = {_ keyStr： "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789 + / ="、encode：function（e）{var t = ""; var n、r、i、s、o、u、a; var f = 0; e = Base64._utf8_encode （e）; while（f <e.length）{n = e.charCodeAt（f ++）; r = e.charCodeAt（f ++）; i = e.charCodeAt（f ++）; s = n >> 2; o =（ n＆3）<< 4 | r >> 4; u =（r＆15）<< 2 | i >> 6; a = i＆63; if（isNaN（r））{u = a = 64} else if（isNaN（i） ）{a = 64} t = t + this._keyStr.charAt（s）+ this._keyStr.charAt（o）+ this._keyStr.charAt（u）+ this._keyStr.charAt（a）} return t}、 decode：function（e）{var t = ""; var n、r、i; var s、o、u、a; var f = 0; e = e.replace（/ [^ A-Za-z0-9 \ + \ / \ =] / g、 ""）; while（f <e.length）{s = this._keyStr.indexOf（e.charAt（f ++））; o = this._keyStr.indexOf（e.charAt （f ++））; u = this._keyStr.indexOf（e.charAt（f ++））; a = this._keyStr.indexOf（e.charAt（f ++））; n = s << 2 | o >> 4; r =（o＆15）<< 4 | u >> 2; i =（u＆3）<< 6 | a; t = t + String.fromCharCode（n）; if（u！= 64）{t = t + String.fromCharCode （r）} if（a！= 64）{t = t + String.fromCharCode（i）}} t = Base64._utf8_decode（t）; return t}、_ utf8_encode：function（e）{e = e.replace（ / \ r \ n / g、 "\ n"）; var t = ""; for（var n = 0; n <e.length; n ++）{var r = e.charCodeAt（n）; if（r <128）{t + = String.fromCharCode（r）} else if（r> 127 && r <2048）{t + = String.fromCharCode（r >> 6 | 192）; t + = String.fromCharCode（r＆63 | 128）} else { t + = String.fromCharCode（r >> 12 | 224）; t + = String.fromCharCode（r >> 6＆63 | 128）; t + = String.fromCharCode（r＆63 | 128）}} return t}、_ utf8_decode：function（e） {var t = ""; var n = 0; var r = c1 = c2 = 0; while（n <e.length）{r = e.charCodeAt（n）; if（r <128）{t + = String。 fromCharCode（r）; n ++} else if（r> 191 && r <224）{c2 = e.charCodeAt（n + 1）; t + = String.fromCharCode（（r＆31）<< 6 | c2＆63）; n + = 2} else { c2 = e.charCodeAt（n + 1）; c3 = e.charCodeAt（n + 2）; t + = String.fromCharCode（（r＆15）<< 12 |（c2＆63）<< 6 | c3＆63）; n + = 3}} return t}};

上記のリクエストでは、 beforeSend（）メソッドに引数として渡されたxhrオブジェクトのsetRequestHeader（）を使用してAuthorizationヘッダーを設定しました。

上記の要求に加えて、 Access-Control-Allow-HeadersヘッダーはサーバーのAuthorizationフィールドを許可する必要があります。 これは、WordPressの.htaccessファイルに次の行を追加することで有効にできます。

 ヘッダーは常に設定されますAccess-Control-Allow-HeadersAuthorizationヘッダーは常に設定されます

上記のリクエストが完了すると、ブラウザのコンソールに応答がエコーアウトされます

サーバーから返された200ステータス応答コードは、IDが52の投稿が正常に削除されたことを示しています。

WordPress HTTPAPIを使用して認証済みリクエストを送信する

別のWordPressWebサイトにリモートで接続している場合、最も適切なアプローチは、WordPress HTTPAPIを介してHTTPリクエストを送信することです。

WordPress REST APIと基本認証が有効になっている別のWordPressインストールにDELETEリクエストを送信する次のコードについて考えてみます。

 $ wp_request_headers = array（
  '承認' => '基本'。 base64_encode（ 'ユーザー名：パスワード'）
）;

$ wp_request_url = 'http：//wordpressmu-19393-42425-140587.cloudwaysapps.com/wordpress-api/wp-json/wp/v2/posts/50';

$ wp_delete_post_response = wp_remote_request（
  $ wp_request_url、
  配列（
      'メソッド' => 'DELETE'、
      'ヘッダー' => $ wp_request_headers
  ）。
）;

echo wp_remote_retrieve_response_code（$ wp_delete_post_response）。 ''。 wp_remote_retrieve_response_message（$ wp_delete_post_response）;

ここでは、2つの引数を受け入れるwp_remote_request（）を使用しました。 $ url （リクエストのURL）と$ args （渡される追加の引数を含む配列）。

$ args配列で定義されている$ methodはDELETEです。 $ headers配列には、リクエストで渡されるすべてのヘッダーフィールドが含まれています。 base64でエンコードされたユーザー名とパスワードのキー文字列を使用して認証キーを渡しました。

応答は$ wp_delete_post_response変数に保存され、 wp_remote_retrieve_response_code（）およびwp_remote_retrieve_response_message（）関数で使用できます。 これらの2つの関数は、WordPress HTTP APIのヘルパー関数であり、応答からそれぞれステータスコードとステータスメッセージを抽出します。

上記のリクエストで投稿が正常に削除されると、次のテキストがエコーアウトされます。

200 OK

クッキー認証

Cookie認証は、WordPressで利用できる基本的な認証方法です。 WordPressダッシュボードに正常にログインすると、正しいCookieが設定されます。 したがって、開発者は認証のためにログインするだけで済みます。

ただし、REST APIには、CSRFの問題に対処するためのナンスと呼ばれるメソッドが組み込まれています。 これにより、Webサイト上のすべてのアクティビティが分離されたままになります。 ただし、これにはAPIの慎重な取り扱いも必要です。

Javascript APIの一部として機能するものを利用する開発者にとって、これは自然に処理されます。 これは、プラグインとテーマにAPIを利用するための規定されたアプローチです。 カスタムデータモデルは、wp.api.models.Baseを拡張して、カスタムリクエストに対してこれが正しく送信されることを保証できます。

手動でAJAX呼び出しを行う開発者は、すべてのリクエストでナンスを渡す必要があります。 APIは、アクティビティがwp_restに設定されたナンスを利用します。 これらは、 _wpnonceデータパラメータ（POSTデータまたはGETリクエストのクエリ）を介して、またはX-WP-Nonceヘッダーを使用してAPIに渡すことができます。

注：最近まで、多くのソフトウェアはDELETEリクエストを大雑把にサポートしていました。 たとえば、PHPはDELETEリクエストのリクエスト本文をスーパーグローバルに変換しません。 そのため、このシナリオでは、ナンスをヘッダーとして提供することが最も信頼性の高いアプローチです。

この確認戦略はWordPressのCookieに依存していることを覚えておくことが重要です。 したがって、この方法は、REST APIがワードプレス内で利用されている場合にのみ関連し、現在のユーザがログインしている。また、現在のユーザーが実行されるアクティビティに適した権限を有していなければなりません。

例として、これは組み込みのJavaScriptクライアントがnonceを作成する方法です。

 wp_localize_script（ 'wp-api'、 'wpApiSettings'、array（ 'root' => esc_url_raw（rest_url（））、 'nonce' => wp_create_nonce（ 'wp_rest'）））;

jQuery AJAXを使用して、投稿のタイトルを編集する例を次に示します。

 $ .ajax（{
   url：wpApiSettings.root + 'wp / v2 / posts / 50'、
   メソッド： 'POST'、
   beforeSend：関数（xhr）{
       xhr.setRequestHeader（ 'X-WP-Nonce'、wpApiSettings.nonce）;
   }、
   データ：{
       'タイトル'： 'ハロークラウドウェイズ'
   }
}）。done（function（response）{
   console.log（応答）;
}）;

結論

WordPress REST APIは、おそらく世界で最も人気があり、広く使用されているRESTAPIです。 オンラインストアやウェブアプリでWordPressを使用するすべての人が利用できます。

私がこの記事に書いたことをあなたが理解してくれたことを願っています。 それでもトピックについて質問がある場合、またはディスカッションに貢献したい場合は、以下にコメントを残してください。