如何在Angular中使用$ resource访问响应头？

Question

我基本上这样称呼get请求:

var resource = $resource('/api/v1/categories/:id')

resource.get({id: 1}).$promise.then(function(data){
  console.log(data)
})

这工作正常..但我如何获得响应标头？

Answer 1

您可以使用此处定义的transformResponse操作,这将允许您添加标头

$resource('/', {}, {
    get: {
        method: 'GET',
        transformResponse: function(data, headers){
            response = {}
            response.data = data;
            response.headers = headers();
            return response;
        }
    }

在这里看一个工作示例JSFiddle

Answer 2

@ Martin的答案适用于相同的域请求.所以我想补充一点,如果您使用跨域请求,则必须添加另一个标头Access-Control-Expose-Headers: X-Blah, X-Bla以及Access-Control-Allow-Origin:*标头.

在哪里X-Blah和X-Bla是自定义标头.

此外,您不需要使用转换请求来获取标头.您可以使用此代码:

var resource = $resource('/api/v1/categories/:id')

resource.get({id: 1}, function(data, headersFun){
  console.log(data, headersFun());
})

看到这个小提琴.希望这可以帮助 !!!

Answer 3

老问题,但我认为值得一提,以备将来参考.在角度文档中有"官方"解决方案:

值得注意的是,get,query和其他方法的成功回调在来自服务器的响应以及$ http header getter函数中传递,因此可以重写上面的示例并获取http头的访问权限:

var User = $resource('/user/:userId', {userId:'@id'});

var users = User.query({}, function(users, responseHeaders){
  // ...
  console.log(responseHeaders('x-app-pagination-current-page'));
});

(文档中的代码为了清晰起见略微更新)

对于CORS请求,需要公开其他答案中提到的标头.