为 cross-origin 请求获取响应自定义 headers

Question

我有一个 Angular2/4 应用程序，其获取请求的响应 header 键为 'X-Auth-Key'。当我调用 response.header 我得到默认的 headers 然后我调用 response.headers.get('X-Auth-Token') 我得到空值。下面是我的代码和来自 Chrome 控制台的请求的屏幕截图（var url 在其他地方定义）。

    getToken(id: string, password: string): Observable<User> {
    let headers = new Headers({ 'X-Auth-User': id, 'X-Auth-Key': password });
    return this.http
        .get(url + 'auth', { headers: headers })
        .map(response => {
            let user: User = response.json() as User;

            // store user details and jwt token in local storage to keep user logged in between page refreshes
            localStorage.setItem('currentUser', JSON.stringify({ user: user, token: response.headers.get('X-Auth-Token') }));

            return user;
        })
   }// Get authorization token

我不确定我做错了什么，但我很感激任何帮助

谢谢！

Answer 1

如果您希望您的请求前端 JavaScript 代码被允许访问 X-Auth-Key 响应 header 值。

如果响应不包含 Access-Control-Expose-Headers header 的值，浏览器将允许您从 client-side JavaScript 访问的唯一响应 header在您的网络应用程序中是 Cache-Control， Content-Language, Content-Type, Expires, Last-Modified 和 Pragma.

请参阅 https://fetch.spec.whatwg.org/#cors-safelisted-response-header-name 了解相关规范。

为 cross-origin 请求获取响应自定义 headers

Get response custom headers for cross-origin request

javascript

cors

rxjs

angular-http

angular