在angularjs

Question

我正在尝试访问标题'error-detail'，您可以在浏览器网络检查器中看到（上面的链接），标题会被返回。服务器方面我还将自定义标头添加到“Access-Control-Expose-Headers”以允许跨域请求，因为这被建议是对其他问题的修复。

以下是对服务器的请求以及成功/错误回调。

this.signon = function (request, onComplete, onError) {
    console.log("Calling server with 'login' request...");

    return $http.post("http://localhost:8080/markit-war/services/rest/UserService/login/", request)
        .then(onComplete, onError);
};

var onLookupComplete = function(response) {
    if (response.data.username)
    {
        //If user is returned, redirect to the dashboard.
        $location.path('/dashboard');
    }

    $scope.username = response.data.username;
};

var onError = function(response) {
    $scope.error = "Ooops, something went wrong..";
    console.log('error-detail: ' + response.headers('error-detail'));
};

当我尝试访问响应头时，如下所示：

    console.log(response.headers());
    console.log('error-detail: ' + response.headers('error-detail'));

这只输出： content-type：“application / json” error-detail：null

是否有理由将错误详细信息标头映射到响应对象？

Answer 1

我认为你走在正确的轨道上。要访问自定义标头，您的服务器需要设置此特殊Access-Control-Expose-Headers标头，否则您的浏览器只允许访问Mozilla docs中列出的6个预定义标头值。

在屏幕截图中，响应中不存在此标头。你应该看看这个cors头的后端也会出现在响应中。

Answer 2

这是一个CORS问题。因为这是一个跨源请求，所以浏览器隐藏了大多数标头。服务器需要在其响应中包含Access-Control-Expose-Headers标头。

Access-Control-Expose-Headers¹响应标头通过列出其名称来指示哪些标头可以作为响应的一部分公开。

默认情况下，只显示6个简单响应标头：

• 缓存控制
• 内容的语言
• 内容类型
• 到期
• 上次修改
• 附注

如果您希望客户端能够访问其他标头，则必须使用Access-Control-Expose-Headers标头列出它们。

有关详细信息，请参阅MDN HTTP Header -- Access-Control-Expose-Headers