I am making a request to a rest service from Angular 5 to the login route, so that it returns a JWT in the header, in this way (Method getUserToken) :
import { Injectable } from '@angular/core';
import { Http, Response, Headers, RequestOptions, URLSearchParams } from "@angular/http";
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/do';
import 'rxjs/add/operator/catch';
import { Observable } from 'rxjs/Rx';
import Config from '../../config/config';
@Injectable()
export class LoginServiceService {
private url: string = Config.serviceRoute;
headers: Headers;
options: RequestOptions;
constructor(private http:Http) {
this.headers = new Headers({ 'Accept': 'application/json',
'Access-Control-Allow-Origin': "*",
'Access-Control-Allow-Headers': "Origin, X-Requested-With, Content-Type, Accept, Authorization, X-Custom-header",
});
this.options = new RequestOptions({ headers: this.headers });
}
getUserToken(test){
console.log("calling /login");
return this.http.post(this.url + 'login', test, this.options)
.map(res => {
let headers = res.headers;
let varaible = headers.get("Authorization");
console.log("My varaible ", varaible);
return res.json;
});
}
}
But when I explore the console.log of MyToken I see that it is null. As I understand security measures, there are things that I cannot access in the header, but in this case, how can I obtain the value that Authorization has?
What the API returns to me is this in the header:
Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: GET, POST, DELETE, PUT, OPTIONS
Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept, Accept-Encoding, Accept-Language, Host, Referer, Connection, User-Agent, Authorization, sw-useragent, sw-version
X-Content-Type-Options: nosniff
X-XSS-Protection: 1; mode=block
Cache-Control: no-cache, no-store, max-age=0, must-revalidate
Pragma: no-cache
Expires: 0
X-Frame-Options: DENY
Authorization: Bearer eyJhbGciOiJIUzUxMiJ9.eyJzdWIiOiJhZG1pbiIsImV4cCI6MTUxNjM3MTY5OX0.DDUF4gb0kXIZP17hFWYUqEVkeT9H0LZDOv4DKxgyktObV60klJhrzrBtv9m5UqWx6lZA0eZzIM1hn9nGp-_bnQ
Content-Length: 0
Date: Fri, 19 Jan 2018 14:11:39 GMT
Update:
When I do a console.log() of the header it brings me this.
{"Cache-Control":["no-cache"," no-store"," max-age=0"," must-revalidate"],"Expires":["0"],"Pragma":["no-cache"]}
For some reason I don't see the authorization, which I do see from Mozilla or Chrome.
I answered this same question on SO in English :
When you use CORS, there are certain headers that have to be added in the responses. Your answer has the following:
Access-Control-Allow-Origin: *
Indicates that anyone can make requests.Access-Control-Allow-Methods: GET, POST, DELETE, PUT, OPTIONS
Indicate which methods you can use.Access-Control-Allow-Headers: Origin, X-Requested-With, ... Authorization, sw-useragent, sw-version
indicates which headers you can send to the server.Now what you need is the following:
This header defines which headers the server sends can be read and is not present in your response.