Angular Httpclient не использует бэкэнд-API

У меня есть следующий код для использования внутреннего API, обслуживаемого приложением Play. API http://localhost:9000/ws/users/get работает, если я набираю его как есть в окне браузера (я вижу ответ hello from get user controller в окне, а также отладочную печать `получить запрос пользователя в моем игровом приложении), но код Angular, похоже, ничего не отправляет в бэкэнд (я вообще не вижу никаких отладок ни в игре, ни в окне браузера).

Вопрос 1. Как я могу отладить, куда Angular отправляет сообщение. Вопрос 2. Почему код не работает?

import { Injectable } from '@angular/core';
import { environment } from 'environments/environment';
import {Observable} from "rxjs/Observable";
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';
import 'rxjs/add/observable/throw';

import { HttpClient} from '@angular/common/http';
import {User} from "./user";

@Injectable()
export class WebToBackendInterfaceService {

  API_URL = environment.apiUrl; 
  ADD_USER_URL = environment.addUserUrl;
  GET_USER_URL = environment.getUserUrl;
  constructor(private http:HttpClient) { }

  public createUser(user:User):any{
    console.log('contacting server at '+this.API_URL +this.ADD_USER_URL +" with user data ",user); //if I click this link directly fro browser's debug window then I see response from the server
    this.http.post(this.API_URL +this.ADD_USER_URL,user)
      .map(response => { 
        console.log('response from backend service',response);
        return response;
      })
      .catch(this.handleError); //error handler if Observable fails
  }

  public getUser(id:string):any{
    console.log('contacting server at '+this.API_URL +this.GET_USER_URL +" with user data "+id);
    this.http.get(this.API_URL+this.GET_USER_URL)
      .map(response=>{
        console.log('response from backend service',response);
        return response;
      })
      .catch(this.handleError);
  }

  private handleError (error: Response | any) {
    console.error('WebToBackendInterfaceService::handleError', error);
    return 'error from the server:'+error;
  }

}


angular angular-httpclient
person Manu Chadha    schedule 20.02.2018    source источник
comment
Насколько я вижу, вы не подписаны. У вас должен быть компонент, который использует этот сервис. В Сервисе вы должны вернуть Observable, созданный http.post. Проверьте это: https://angular.io/guide/http   -  person Max    schedule 20.02.2018
comment
См. также (stackoverflow.com/a/42342954/5452941)   -  person Akshay Garg    schedule 20.02.2018
comment
Та! Часть подписки отсутствовала!   -  person Manu Chadha    schedule 20.02.2018

Ответы (1)


arrow_upward
1
arrow_downward

так что вот простая демонстрация вызовов сервера через angular

в вашем приложении должен быть файл service.ts, который будет подключаться к внутреннему серверу. Этот файл обычно используется для соединения между сервером и внешним интерфейсом.

import { Injectable } from '@angular/core';
import {ColaboratorResponse} from '../domain/colaborator.response';
import {Colaborator} from '../domain/colaborator';
import { Headers, RequestOptions, Response } from '@angular/http';
import { HttpClient } from '@angular/common/http';
import 'rxjs/add/operator/map';

export class YourService{

constructor(private httpClient: HttpClient) {}
getUser(id:string){   
   return this.httpClient.get(this.API_URL+this.GET_USER_URL);
}

Теперь вы должны использовать этот сервис в своем компоненте. везде, где вы хотите вызвать эту функцию getUser, например

сначала импортируйте свой сервис

import {ColaboratorService} from 'from/your/service/location';

инициализируйте это в конструкторе компонента

constructor(
       private confirmationService: ConfirmationService,
       private _ser: YourService
     ) {}

и вызовите это в компоненте, создав функцию

getUserDetails(){
this._ser.getUser(id).subscribe((User : any)=>{this.User =User;});

//console.log('here'+this.User);


}

так вот ваш объект this.User

import {User} from "./user";

надеюсь это поможет.

person Hrishikesh Kale    schedule 20.02.2018
comment
Код в этом ответе использует старый Http. Рассмотрите возможность использования более нового HttpClient, как указано в OP. (Тогда вам больше не нужен .map.) - person DeborahK; 20.02.2018