Angular 5 не отображает значение ответа от сервера

Question

Кажется, мой клиент не захватывает значение ответа с сервера и не отображает его.

Вот мой код компонента:

export class MyComponent implements OnInit {

  data: string;

  constructor(private myService: MyService) {}

  ngOnInit() {}

  testCall() {
    this.myService.getData().subscribe(data => this.data = data);
    console.log("Data: " + this.data);
  }
}

Сервисный код:

@Injectable()
export class MyService {

  private url = 'http://localhost:5000/myproj/api/test';

  constructor(private http: HttpClient) { }

  // Get data from the server
  getData(): Observable<string> {
    console.log("in getData() method");
    return this.http.get<string>(this.url)
      .pipe(
        catchError(this.handleError) // then handle the error
      );
  }

  private handleError(error: HttpErrorResponse) {
    if (error.error instanceof ErrorEvent) {
      // A client-side or network error occurred. Handle it accordingly.
      console.error('An error occurred:', error.error.message);
    } else {
      // The backend returned an unsuccessful response code.
      // The response body may contain clues as to what went wrong,
      console.error(
        `Backend returned code ${error.status}, ` +
        `body was: ${error.error}`);
    }
    // return an observable with a user-facing error message
    return new ErrorObservable('Something went wrong; please try again later.');
  };
}

Запрос отправляется на сервер, и сервер отвечает с данными в теле ответа и кодом состояния 200, который можно увидеть в инструментах разработчика в Internet Explorer:

Но по какой-то причине, когда я вызываю метод обслуживания getData(), код углового клиента вызывает определенный мной метод catchError() и печатает:

Backend returned code 200, body was: [object Object]
ERROR Something went wrong; please try again later.

Почему сервер возвращает статус 200 (ОК), но клиент Angular вызывает метод catchError()?

РЕДАКТИРОВАТЬ:

Вот мой код API на стороне сервера:

@RequestMapping(value = "/test", method = RequestMethod.GET, produces = "text/plain")
    public String testApi(HttpServletRequest request) {

        System.out.println("in /test");

        String response = "my response";

        return response;
    }

Answer 1

Тело ответа имеет неправильный формат JSON, поэтому возникает ошибка «Недопустимый символ», возникающая при десериализации.Служба ожидает правильно сформированный JSON.

Обновите ваш API, чтобы он возвращал действительный объект JSON, используя «application / json» и возвращая объект, как показано в следующем сообщении: Spring MVC - Как вернуть простую строку в виде JSON в Rest Controller

Answer 2

Необходимо установить responseType в 'text' в объекте параметров запроса.Вот образец:

return this.http.get(`myApi/ExampleMethod/param`, { responseType: 'text' })
                .pipe(
                    catchError(
                        this.errorHandler.handleError.bind(this)
                    )
                 );

Answer 3

Вам нужно поместить console.log внутри метода .subscribe ()

 this.myService.getData().subscribe(data => {
     this.data = data;
     console.log(this.data);
});