web-dev-qa-db-ja.com

anglejsの応答ヘッダーを読み取る方法は?

私のサーバーは次の種類のヘッダーを返します:Content-Range:0-10/0

enter image description here

angularにあるこのヘッダーを、運よく読んでみました:

var promise = $http.get(url, {
    params: query
}).then(function(response) {
  console.log(response.headers());
  return response.data;
});

ただ印刷する

Object {content-type: "application/json; charset=utf-8"}

コンテンツ範囲ヘッダーにアクセスする方法はありますか?

31
Upvote

成功およびエラーコールバックでheaders変数を使用する

ドキュメントから

$http.get('/someUrl').
  success(function(data, status, headers, config) {
    // this callback will be called asynchronously
    // when the response is available
  })
  .error(function(data, status, headers, config) {
    // called asynchronously if an error occurs
    // or server returns response with an error status.
  });

同じドメインにいる場合は、応答ヘッダーを取得することができます。クロスドメインの場合、サーバーに Access-Control-Expose-Headers ヘッダーを追加する必要があります。

Access-Control-Expose-Headers: content-type, cache, ...
39
Muhammad Reda

単純にこれを試してみませんか:

var promise = $http.get(url, {
    params: query
}).then(function(response) {
  console.log('Content-Range: ' + response.headers('Content-Range'));
  return response.data;
});

特に、promiseを返したい場合は、Promiseチェーンの一部になる可能性があります。

31
Eugene Retunsky

Muhammadの回答に基づいて更新...

$http.get('/someUrl').
  success(function(data, status, headers, config) {
    // this callback will be called asynchronously
    // when the response is available
    console.log(headers()['Content-Range']);
  })
  .error(function(data, status, headers, config) {
    // called asynchronously if an error occurs
    // or server returns response with an error status.
  });
11
medoix

Eugene Retunskyの回答に加えて、応答に関する $ http ドキュメントから引用:

応答オブジェクトには次のプロパティがあります。

  • data{string|Object} –変換関数で変換された応答本文。

  • status{number} –応答のHTTPステータスコード。

  • headers{function([headerName])} –ヘッダーゲッター関数。

  • config{Object} –要求の生成に使用された構成オブジェクト。

  • statusText{string} –応答のHTTPステータステキスト。

$ resource (v1.6)の引数コールバックの順序は上記と同じではないことに注意してください

成功コールバックは、(value (Object|Array), responseHeaders (Function), status (number), statusText (string))引数で呼び出されます。値は、投入されたリソースインスタンスまたはコレクションオブジェクトです。エラーコールバックは、(httpResponse)引数で呼び出されます。

7
Wtower

MDNによると、カスタムヘッダーはデフォルトでは公開されていません。サーバー管理者は、「access-control-allow-origin」を扱うのと同じ方法で「Access-Control-Expose-Headers」を使用してそれらを公開する必要があります

確認については、このMDNリンクを参照してください[ https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Access-Control-Expose-Headers]

1
cnngraphics

Corsの場合の応答ヘッダーは非表示のままです。応答ヘッダーを追加して、AngularにヘッダーをJavaScriptに公開するよう指示する必要があります。

// From server response headers :
header("Access-Control-Allow-Methods: GET, POST, OPTIONS");
header("Access-Control-Allow-Headers: Origin, X-Requested-With, 
Content-Type, Accept, Authorization, X-Custom-header");
header("Access-Control-Expose-Headers: X-Custom-header");
header("X-Custom-header: $some data");

var data = res.headers.get('X-Custom-header');

ソース: https://github.com/angular/angular/issues/5237

1
kuabhina1702