HttpResponse中的Angular 6空头数组答案

【问题标题】：Angular 6 Empty Header Array in HttpResponseHttpResponse中的Angular 6空头数组
【发布时间】：2019-01-24 11:09:18
【问题描述】：

我已经在谷歌上搜索过这个问题并找到了很多文章，但没有一个解决方案适合我。

问题：

从我的 Angular 应用程序发送 AJAX 请求以验证用户身份后，C# API 会在“Set-Cookie”标头中使用 jwt 令牌进行响应。 cookie 设置为“httponly”，所以我想直接从响应中提取它以在我的路由保护中处理它。尽管firefox开发控制台网络选项卡正确显示了每个响应头并且cookie保存在cookie存储中，但HttpResponse对象中的头数组仍然是空的。

这是我的设置：

角度请求：

postLogin(user: string, pw: string): Promise<HttpResponse<any>> {

 return this.httpClient.post<HttpResponse<any>>(
   'https://localhost:443/login',
   'user=' + user + '&pw=' + encodeURIComponent(pw),
   {
     headers: new HttpHeaders({
       'Content-Type': 'application/x-www-form-urlencoded'
     }),
     observe: 'response',
     withCredentials: true
   }
 ).toPromise();
}

C# HttpListenerResponse：

internal void SendLoginResponse(HttpListenerResponse response, string token)
    {
        response.StatusCode = (int)HttpStatusCode.OK;
        response.KeepAlive = false;
        response.AddHeader("Server", "DSM Management");
        response.AddHeader("Access-Control-Allow-Methods", "GET, POST");
        response.AddHeader("Access-Control-Allow-Origin", "http://localhost:4200");
        response.AddHeader("Access-Control-Allow-Credentials", "true");
        response.AddHeader("Access-Control-Allow-Headers", "Set-Cookie");
        response.AddHeader("Access-Control-Expose-Headers", "Set-Cookie");
        response.AddHeader("Vary", "Origin");
        response.AddHeader("Set-Cookie", "token=" + token + "; path=/; HttpOnly");

        response.Close();
    }

角响应法：

onSubmit(): void {
 const user = this.form.get('username').value;
 const pw = this.form.get('password').value;

 this.httpService.postLogin(user, pw).then(
   (response) => {
     console.log(response.headers);
   },
   (error) => {
     console.log(error);
   }
 );
}

Firefox 网络标签：

Firefox Request/Response Screenshot

Angular 中的 HttpResponse 对象：

response object

除了使用 Promise 技术之外，我还尝试了使用 Observable/Subscribe 技术的相同方法。结果相同。

旁注：我知道使用 cookie 的 jwt 实现而不是授权标头不是最好的，但我需要使用这个客户 api。

有人可以帮我获取这些标题吗？

编辑： 出于测试目的，我已经将 cookie httponly 值设置为 false。没区别，header数组还是空的。

【问题讨论】：

How to get a cookie from an AJAX response?的可能重复
我实际上并不认为这与 cookie 或 httponly 标志有关，因为即使有其他响应标头并且 cookie 上没有设置 httponly 标志，标头数组仍然为空。
I actually don't think 唉，你错了。 stackoverflow.com/a/1022119/34092
是的，你是对的。然而，当它不是 httponly 时，甚至没有得到 cookie 是令人困惑的。但这似乎是对角度或 xhr 的限制。标头数组也始终为空。只有当您明确请求特定标头时，标头才会显示在数组中。非常奇怪的行为。

标签： c# ajax angular http xmlhttprequest

【解决方案1】：

由于 cookie 设置为 HttpOnly，因此无法通过 JavaScript 访问。既不是来自document.cookie，也不是直接来自HTTP响应头。

【讨论】：

感谢您的回复，请查看我编辑的问题。