无法从 Angular 4 中的 POST 响应标头访问属性答案

【问题标题】：Can't access property from POST response headers in Angular 4无法从 Angular 4 中的 POST 响应标头访问属性
【发布时间】：2018-08-31 15:56:50
【问题描述】：

我正在尝试访问从 POST 响应标头收到的 CSRF 令牌，我需要将其与来自我的应用程序的每个进一步请求一起发回。我能够深入研究响应流，直到我可以访问具有“csrfpreventionsalt”令牌的 [[Entries]]。它显示在控制台中，但在尝试访问时显示为未定义。

久经考验： 我尝试了“get”方法来访问标题，但没有成功。

var csrf = res.headers.get('csrfpreventionsalt');

我在 SO 上看到了其他问题，这些问题说您无法访问标头值，但如果我可以在控制台中访问标头，那么我肯定应该能够访问令牌并将其分配给变量。

此问题的解决方案可能会帮助其他可能在其应用中面临相同情况的人。欢迎任何帮助！

【问题讨论】：

标签： javascript angular header csrf csrf-protection

【解决方案1】：

您需要映射您的响应以获取类似的方法

this.http.get('…', { observe: 'response' });

根据 Angular 中的新 httpclient，如果您仍然对整个 Response 对象感兴趣，可以观察它

请查看here

【讨论】：

【解决方案2】：

您可以尝试以下方法：

Map.forEach((value: boolean, key: string) => {
    console.log(key, value);
});

【讨论】：

【解决方案3】：

我相信这个问题已经被问过所以检查一下

Angular 4.3.3 HttpClient : How get value from the header of a response?

我本来想把它放在评论中，但我没有足够的影响力发表评论，抱歉

【讨论】：

【解决方案4】：

我在调用json()方法后调用get方法，基本上我可以在原始响应对象中访问csrf值后获取它，如下所示：

private extractLoginData = (res: Response) => {
    this.csrfToken = res.headers.get('csrfPreventionSalt');
    let body = res.json();
    return body;
}

还要确保您的服务已将 Access-Control-Allow-Headers 和 Access-Control-Allow-Origin 的标头字段设置为“*”。

同时添加您的“Access-Control-Allow-Credentials: true”。

【讨论】：