rest - consume - http post-¿cómo enviar un encabezado de autorización?

http interceptor angular 6

Question

¿Cómo se agregan encabezados a su solicitud http en Angular2 RC6? Tengo el siguiente código:

login(login: String, password: String): Observable<boolean> {
console.log(login);
console.log(password);
this.cookieService.removeAll();
let headers = new Headers();
headers.append("Authorization","Basic YW5ndWxhci13YXJlaG91c2Utc2VydmljZXM6MTIzNDU2");
this.http.post(AUTHENTICATION_ENDPOINT + "?grant_type=password&scope=trust&username=" + login + "&password=" + password, null, {headers: headers}).subscribe(response => {
console.log(response);
});
//some return
}

El problema es que angular no agrega encabezado de autorización. En lugar de eso, a petición puedo ver los siguientes encabezados adicionales:

Access-Control-Request-Headers:authorization
Access-Control-Request-Method:POST

y sdch agregados en Accept-Encoding:

Accept-Encoding:gzip, deflate, sdch

Desafortunadamente, no hay un encabezado de Autorización. ¿Cómo debería agregarlo correctamente?

Toda la solicitud enviada por mi código se ve de la siguiente manera:

OPTIONS /oauth/token?grant_type=password&scope=trust&username=asdf&password=asdf HTTP/1.1
Host: localhost:8080
Connection: keep-alive
Pragma: no-cache
Cache-Control: no-cache
Access-Control-Request-Method: POST
Origin: http://localhost:3002
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.116 Safari/537.36
Access-Control-Request-Headers: authorization
Accept: */*
Referer: http://localhost:3002/login
Accept-Encoding: gzip, deflate, sdch
Accept-Language: en-US,en;q=0.8,pl;q=0.6

Answer 1

Creo que debes mapear el resultado antes de suscribirte a él. Usted lo configura así:

 updateProfileInformation(user: User) {
var headers = new Headers();
headers.append(''Content-Type'', this.constants.jsonContentType);
var t = localStorage.getItem("accessToken");
headers.append("Authorization", "Bearer " + t;
var body = JSON.stringify(user);
return this.http.post(this.constants.userUrl + "UpdateUser", body, { headers: headers })
.map((response: Response) => {
var result = response.json();
return result;
})
.catch(this.handleError)
.subscribe(
status => this.statusMessage = status,
error => this.errorMessage = error,
() => this.completeUpdateUser()
);
}

Answer 2

De acuerdo. Encontré un problema

No estaba en el lado angular. Para ser honesto, no hubo ningún problema en absoluto.

La razón por la cual no pude realizar mi solicitud satisfactoriamente fue porque mi aplicación de servidor no manejaba adecuadamente la solicitud OPTIONS.

¿Por qué OPCIONES, no POST? Mi aplicación de servidor está en un host diferente, luego frontend. Debido a CORS mi navegador estaba convirtiendo POST en OPCIÓN: http://restlet.com/blog/2015/12/15/understanding-and-using-cors/

Con la ayuda de esta respuesta: Standalone Spring OAuth2 JWT Authorization Server + CORS

Implementé el filtro apropiado en mi aplicación del lado del servidor.

Gracias a @Supamiu, la persona que me señaló que no estoy enviando POST en absoluto.

Answer 3

Tuve el mismo problema. Esta es mi solución usando documentación angular y Token de firebase:

getService() {
const accessToken=this.afAuth.auth.currentUser.getToken().then(res=>{
const httpOptions = {
headers: new HttpHeaders({
''Content-Type'': ''application/json'',
''Authorization'': res
})
};
return this.http.get(''Url'',httpOptions)
.subscribe(res => console.log(res));
}); }}

Answer 4

necesita RequestOptions

 let headers = new Headers({''Content-Type'': ''application/json''});
headers.append(''Authorization'',''Bearer '')
let options = new RequestOptions({headers: headers});
return this.http.post(APIname,body,options)
.map(this.extractData)
.catch(this.handleError);

para más verifique este link