Angular 2:获取授权标头 [英] Angular 2: Get Authorization header
问题描述
在我的应用程序(Angular 2 / Ionic 2)中,我实现了自己的登录/身份验证。基本上它的工作方式如下:在登录时,PHP后端正在验证用户名和密码。生成令牌,然后将其发送回标题中的前端(授权)。来自后端的响应如下所示:
in my App (Angular 2 / Ionic 2) I implemented my own login/authentication. Basically it works like this: On login, username and password is being validated by the PHP backend. A token is generated, which is sent back to then frontend in the header (Authorization). The response from backend looks like this:
HTTP/1.1 200 OK
Host: localhost:8080
Connection: close
X-Powered-By: PHP/5.6.28
Set-Cookie: PHPSESSID=jagagi2le1b8i7r90esr4vmeo6; path=/
Expires: Thu, 19 Nov 1981 08:52:00 GMT
Cache-Control: no-store, no-cache, must-revalidate, post-check=0, pre-check=0
Pragma: no-cache
Content-Type: application/json
Authorization: d7b24a1643a61706975213306446aa4e4157d167eaad9aac989067a329c492d3
Access-Control-Allow-Origin: *
Access-Control-Allow-Headers: X-Requested-With, Content-Type, Accept, Origin, Authorization
Access-Control-Allow-Methods: GET, POST, PUT, DELETE, OPTIONS
Content-Length: 301
显然有一个带有令牌的Authorization标头。
CORS似乎也可以正确设置,因为我在Allow-Headers标题中看到了Authorization。
There's clearly an Authorization header with a token present. CORS seems also to be setup correctly, since I see Authorization in the Allow-Headers header.
但是,当我尝试在Angular 2中获取头时,它总是返回null:
But, when I try to get the header in Angular 2, it always returns null:
private extractDataAndSetAuthHeader(res: Response) {
// Set auth header if available.
// If not available - user is not logged in. Then
// we also have to remove the token from localStorage
if(res.headers.has("Authorization"))
{
let token = res.headers.get("Authorization");
this.setToken(token);
}
else
{
// If no token is sent, remove it
this.removeToken();
}
let body = res.json();
return body.data || { };
}
该方法的第一行返回false。此外,当我在我的回复中检查标题对象时,它仅显示以下内容(Chrome开发工具):
The first line of the method gives back false. Also, when I check the headers object in my response, it shows me only the following (Chrome dev tools):
[[Entries]]:
Array[4]
0:{"pragma" => Array[1]}
1:{"content-type" => Array[1]}
2:{"cache-control" => Array[1]}
3:{"expires" => Array[1]}
该对象中没有授权标题。
There's no Authorization header present in that object.
任何人都可以帮助我吗?
Can anyone please help me out?
提前致谢:)
推荐答案
只是想发布答案,因为它可能会帮助其他人:
解决方案设置
Just wanted to post the answer as it might help others: The solution as to set
Access-Control-Expose-Headers: Authorization
然后 - 前端可以读取授权标题也是。
Then - frontend can read the Authorization header as well.
这篇关于Angular 2:获取授权标头的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!