it-swarm.com.de

Angular 2: Wie greife ich auf einen HTTP-Antworttext zu?

Ich habe den folgenden Code in Angular 2 geschrieben: 

this.http.request('http://thecatapi.com/api/images/get?format=html&results_per_page=10').
      subscribe((res: Response) => {
        console.log(res);
      })

Wenn ich die Antwort drucke, bekomme ich in der Konsole:  enter image description here

Ich möchte in der Antwort auf das Feld "Code to Body" zugreifen. Das 'body'-Feld beginnt mit einem Unterstrich, was bedeutet, dass es sich um ein privates Feld handelt. Wenn ich es in "console.log (res._body)" ändere, wurde eine Fehlermeldung angezeigt. 

Kennen Sie eine Getter-Funktion, die mir hier helfen kann? 

35
CrazySynthax

Beide Request und Response extend Body . Um den Inhalt abzurufen, verwenden Sie die text()-Methode.

this.http.request('http://thecatapi.com/api/images/get?format=html&results_per_page=10')
    .subscribe(response => console.log(response.text()))
52
OrangeDog

Hier ist ein Beispiel für den Zugriff auf Antwortkörper mithilfe von angle2 built in Response  

import { Injectable } from '@angular/core';
import {Http,Response} from '@angular/http';

@Injectable()
export class SampleService {
  constructor(private http:Http) { }

  getData(){

    this.http.get(url)
   .map((res:Response) => (
       res.json() //Convert response to JSON
       //OR
       res.text() //Convert response to a string
   ))
   .subscribe(data => {console.log(data)})

  }
}
13
vishnu

Hier ist ein Beispiel eines get http-Aufrufs:

this.http
  .get('http://thecatapi.com/api/images/get?format=html&results_per_page=10')
  .map(this.extractData)
  .catch(this.handleError);

private extractData(res: Response) {
   let body = res.text();  // If response is a JSON use json()
   if (body) {
       return body.data || body;
    } else {
       return {};
    }
}

private handleError(error: any) {
   // In a real world app, we might use a remote logging infrastructure
   // We'd also Dig deeper into the error to get a better message
   let errMsg = (error.message) ? error.message :
   error.status ? `${error.status} - ${error.statusText}` : 'Server error';
        console.error(errMsg); // log to console instead
        return Observable.throw(errMsg);
}

Beachten Sie .get() anstelle von .request().

Ich wollte dir auch zusätzliche extractData- und handleError-Methoden zur Verfügung stellen, falls du sie brauchst und nicht hast.

9
SrAxi

Die Antwortdaten liegen in Form einer JSON-Zeichenfolge vor. Die App muss diese Zeichenfolge in JavaScript-Objekte parsen, indem sie response.json () aufruft.

  this.http.request('http://thecatapi.com/api/images/get?format=html&results_per_page=10').
  .map(res => res.json())
  .subscribe(data => {
    console.log(data);
  })

https://angular.io/docs/ts/latest/guide/server-communication.html#!#extract-data

5
Dmitrij Kuba

Können Sie nicht direkt auf das _body-Objekt verweisen? Anscheinend gibt es keine Fehler zurück, wenn es auf diese Weise verwendet wird.

this.http.get('https://thecatapi.com/api/images/get?format=html&results_per_page=10')
            .map(res => res)
            .subscribe(res => {
                this.data = res._body;
            });

Arbeitsplunker

4
kind user

Leider geben viele Antworten nur an, wie Sie auf den Text der Antwort als text zugreifen können. Der Hauptteil des Antwortobjekts ist standardmäßig Text und nicht ein Objekt, wenn es durch einen Stream geleitet wird.

Was Sie suchen, ist die json () - Funktion der Body-Objekteigenschaft für das Response-Objekt. MDN erklärt es viel besser als ich:

Die json () -Methode des Body-Mixins nimmt einen Response-Stream und liest diesen vollständig aus. Es gibt ein Versprechen zurück, das mit dem Ergebnis der Analyse des Haupttextes als JSON aufgelöst wird.

response.json().then(function(data) { console.log(data);});

oder mit ES6:

response.json().then((data) => { console.log(data) });

Quelle: https://developer.mozilla.org/en-US/docs/Web/API/Body/json

Diese Funktion gibt standardmäßig ein Promise zurück. Beachten Sie jedoch, dass dies leicht in ein Observable für den Downstream-Verbrauch konvertiert werden kann (Stream-Wort ist nicht beabsichtigt, funktioniert jedoch hervorragend). 

Ohne die json () - Funktion aufzurufen, werden die Daten, insbesondere beim Versuch, auf die _body -Eigenschaft des Response-Objekts zuzugreifen, als Text zurückgegeben. Dies ist offensichtlich nicht das, was Sie möchten, wenn Sie nach einem tiefen Objekt suchen (wie in einem Objekt) mit Eigenschaften, oder kann nicht einfach in ein anderes Objekt umgewandelt werden). 

Beispiel für Antwortobjekte

4
pinky00106

Ich hatte auch das gleiche Problem und das hat für mich versucht:

this.http.request('http://thecatapi.com/api/images/get?format=html&results_per_page=10').
  subscribe((res) => {
    let resSTR = JSON.stringify(res);
    let resJSON = JSON.parse(resStr);
    console.log(resJSON._body);
  })
3
A. Bahieddine
.subscribe(data => {   
            console.log(data);
            let body:string = JSON.parse(data['_body']);`
2
RUPNESH SHARMA

Das ist Arbeit für mich 100%: 

let data:Observable<any> = this.http.post(url, postData);
  data.subscribe((data) => {

  let d = data.json();
  console.log(d);
  console.log("result = " + d.result);
  console.log("url = " + d.image_url);      
  loader.dismiss();
});
0
Nheom Phearum