I make a post request to a server which responds with two headers that are important for the client: username and access-token. The Network Tab of the Chrome debug tool displays the following data for the response:
I also log the response on the console:
Here the headers are not present - why is this? My code for logging:
this.usersService.registerNewUser(firstName, lastName, email, username, birthday, password).subscribe(
res => {
console.log(res);
},
err => {
console.log("Error" + JSON.stringify(err));
}
);
I wanted to access the header username by res.headers.username
.
My request looks like this:
this.http.post<string>(
"http://localhost:2002/users",
JSON.stringify({
firstName: firstName,
lastName: lastName,
email: email,
username: username,
birthday: birthday,
password: password
}),
{
observe: "response"
}
);
What have I done wrong?
The front end will not be able to access that header unless the back end allows it.
In order to do so, you need to send a Access-Control-Expose-Headers
header from the backend, and the value should be a comma separated list of the values you want to expose, ie access-token, username
normally the response is just the 'body', while you want the 'headers'. on the res you could use:
this.header = res.headers.get('header-name');
Just want to give additional info. Yesterday spent on this few hours and was getting crazy.
Once you have access-control-expose-headers
from backend. And if you just printing response object like this console.log(res)
or console.log(res.headers)
it will not show the headers because Angular uses Lazy-loading. You need to explicitly say which header you need console.log(res.headers.get('your-header'))
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.