AngularJSの$httpサービスの概要、サーバーからJSONデータ取得

angular.module('MyApp', [])
.controller('MainCtrl', function($scope,$http) {
  var svrURL = "../../wp-content/themes/wp/friends.json";
  var config = {};
  $http.get(svrURL, config)
    .then(function onSuccess(response) {
　　　　：
    }, function onError(response) {
　　　　：
    });
});

　
１）引数に依存するサービスを指定
　
コントローラのファクトリ関数の引数に$httpを指定します。
　
２）$httpサービスの構文
　
①簡易的な構文
　
データを送信するPOST、PUT、PATCHのHTTPメソッドは、urlとconfig、送信データを引数に指定し、それ以外のHTTPメソッドは、urlとconfigのみ引数に指定します。
　
post(url, data, [config]);
put(url, data, [config]);
patch(url, data, [config]);
get(url, [config]);
delete(url, [config]);
head(url, [config]);
jsonp(url, [config]);
　
②完全版の構文
　
configオブジェクトのみ引数に指定します。メソッド名と簡易版で指定した引数url、dataはconfigオブジェクト内に指定します。
　
$http(config)
　
③configオブジェクトのメンバ
　
○method
　
○url
　
○params
・URLクエリパラメータ。キーと値のペアのJavaScriptオブジェクト。
・paramsで{key1: ‘value1’, key2: ‘value2’}下記のように指定すると”?key1=value1&key2=value2″のようにURLクエリパラメータとしてURLに追加されてリクエストされる。
キーと値のペアの値が文字列ではなくオブジェクトを指定した場合はJSON形式に変換される。
　
○data
・POSTメソッドなどで送信されるデータ。文字列またはオブジェクト。
　
○headers
・{‘Content-Type’: ‘text/csv’}のようにHTTPヘッダーをオブジェクトを使って指定。
　
○xsrfHeaderName
・XSRF攻撃を防ぐための設定をしているサーバー用にXSRFヘッダーをセット。
　
○xsrfCookieName
・XSRF対策用のクッキーの名前
　
○transformRequest、transformResponse
・送受信するデータとHTTPヘッダーを引数とする関数を定義し、送受信データを変換する事が出来る。
　
○cache
・アプリケーションレベルでキャッシュを行うか指定。真偽値またはキャッシュオブジェクトを指定。
・trueを指定した場合は、デフォルトのキャッシュが使用される。
・$cacheFactoryを使ってカスタムのキャッシュオブジェクトを使用する事が出来る。
　
○timeout
・リクエストが処理されるまでの待機時間（ミリ秒）を指定、またはpromiseオブジェクトを指定して、サーバーリクエストの取消しを制御できる。
　
３）$httpサービスのリターン
　
$httpサービスはプロミスオブジェクトをリターンし、サーバーから応答がリターンされると応答結果に応じて実行するハンドラー関数を定義する事が出来る。
　
※プロミスオブジェクトについてはこちらも参照。
　
・プロミスオブジェクトを使用する事によってノンブロッキングでイベントドリブンにでき、サーバーからのレスポンスを待っている間もブラウザの操作が出来る。
　
①$httpサービスのプロミスオブジェクトで定義されているメソッド
　
・then(fn1,fn2)のメソッドが定義されていて、引数に応答後に実行するハンドラー関数を指定する。
　
・応答結果が成功（レスポンスコードが200）の場合は、fn1メソッド、応答結果が失敗（レスポンスコードが200以外）の場合は、fn1メソッドが実行される。
　
②then(fn1,fn2)メソッドのハンドラー関数に渡される属性
　
○headers
・レスポンスのHTTPヘッダー
　
○status
・レスポンスのステータスコード
　
○config
・リクエスト時に指定したconfigオブジェクト
　
○data
・サーバーからのレスポンスのボディ
　
③プロミスオブジェクトについて
　
・thenメソッドはプロミスオブジェクトをリターンし、複数の呼出しをチェーンできる。
　
・それぞれのハンドラー関数は値をリターンする事が出来、プロミスチェーンの次の関数に渡す事が出来る。
　
・ハンドラー関数がプロミスをリターンするとそのリクエストが終了後にその次のハンドラーが呼び出される。
　
・プロミスをチェーンする例

$http.get('/api/config').then(function(config) {
  return $http.get('/api/' + config.data.USER);
}).then(function(userResponse) {
  return $http.get('/api/' + userResponse.data.id + '/items');
}).then(function(itemResponse) {
//
}, function(error) {
//