web-dev-qa-db-fra.com

Angular 2 - Obtenir un cookie de réponse

J'ai besoin d'aide, j'essaie d'obtenir le cookie de la réponse, et je ne trouve pas de moyen, je suis assez nouveau avec tsc et ng2.

Ceci est le post http ng2

return this._http
    .post('http://demo...', body, { headers: headers })
    .subscribe(
        (response: Response) => {
            this.storeToken(response);
        }, (err) => {
            console.log('Error: ' + err);
        }
    );

Voici la réponse du serveur:

HTTP/1.1 200 OK
Server: Apache-Coyote/1.1
Access-Control-Allow-Origin: http://localhost:3000
Access-Control-Allow-Credentials: true
Access-Control-Allow-Headers: Content-Type, Access-Control-Allow-Headers, Authorization, X-Requested-With
Set-Cookie: JSESSIONID=A099CC4CA7A25DFBD12701630A7DC24C; Path=/pbcp/; HttpOnly
Content-Type: application/json;charset=UTF-8
Transfer-Encoding: chunked
Date: Fri, 17 Feb 2017 04:08:15 GMT

32
{"status":"OK","message":"User is Authenticated."}
0

Je suis confus, car je ne le vois pas dans le tableau des en-têtes ...

Résultat de console.log(response)

Response from Chrome console

Résultat de console.log(response.headers)

Headers array from Chrome console

..., mais je peux le voir dans la section cookies.

Cookies section in Chrome

Merci!

angulartypescriptcookies
13
Sebastian Ferrari

Eh bien, après quelques recherches, j'ai trouvé deux problèmes de mon côté.

Tout d'abord , le cookie était OK, mais je le cherchais au mauvais endroit. Pendant tout ce temps, je le regardais sous mon localhost:3000 domaine et le cookie a été correctement stocké sous http://demo... domaine, c'est le bon comportement. Je pourrais le voir dans chrome://settings/ ==> Afficher les paramètres avancés ==> Tous les cookies et les données du site ... ==> et le filtrage par l'hôte distant comme suit:

enter image description here

Deuxièmement , j'ai oublié d'utiliser withCredentials: true dans le reste des en-têtes de demande également, afin d'inclure et d'accepter automatiquement le cookie.

authenticate(username: string, password: string) {
    var body = `{"username":"${username}","password":"${password}"}`;
    var headers = new Headers();
    headers.append('Content-Type', 'application/json');
    let options = new RequestOptions({ headers: headers, withCredentials: true });

    return this._http
               .post('http://demo...', body, options)
               .subscribe(
                   (response: Response) => {
                   this.doSomething(response);
               }, (err) => {
                   console.log('Error: ' + err);
               });
}

Merci à tous pour vos réponses et votre temps!

19
Sebastian Ferrari

Je suppose que vous utilisez le module http angular2 pour contacter le serveur qui retournera un observable avec la réponse du serveur.

Vous pouvez utiliser la réponse si vous vous y abonnez:

//...
http.post(...your content...)
 .take(1) // optional: depending on your needs you could .take(x) this to just take a certain number of responses and then terminate the subscription in order to not have a "hot Observable" lying around
 .subscribe(response =>{
      .console.log(response);
    // if I am not mistaken "response.headers" should contain the "Set-Cookie" you are looking for 
 });

Vous pouvez également transformer l'observable en promesse:

http.post(...your content...)
  .toPromise()
  .then(response=>{
     console.log(response);
     let headers = response.headers;
     console.log(headers);
  })
  .catch(err=>console.log(err));

Dans certains cas de réponse, vous devrez peut-être le transformer à l'aide de response.json () pour récupérer et objecter.

J'espère que cela t'aides. Si ce n'est pas ce que vous cherchez, donnez-moi plus de détails et je vais essayer de vous aider.

1
jparg