각도 2 http.get 요청이 여러 번 수행되었습니다.

Question

내 서비스에서 서버에서 데이터를 가져 오는 기능이 있습니다. 내 응용 프로그램의 여러 부분에서 초기화시이 함수를 호출합니다. 그리고 내가하고 싶은 것은 : 이미 하나의 요청이 전송되고 있다면, 다른 하나는 응답을 기다린다 (그들은 자신의 요청을 할 필요가 없다).

그래서 내 코드는 다음과 같습니다

@Injectable() 
export class UserService implements OnInit { 
    ngOnInit(){ 
     this.getUserInformations(); 
    }; 

    public getUserInformations(forceRefresh?: boolean): Observable<Object>{ 

     if(this.userInformationsLastObservable == null) { 
      console.log('Making a request'); // called only once at init 
      this.userInformationsLastObservable = this.http.get(this.baseUrl + "informations") 
      .map((result: Response) => { 
       console.log('map is called'); // called 5 times at init 
       let userInformations = result.json(); 
       /* So future calls will perform a new request */ 
       this.userInformationsLastObservable = null; 
       return userInformations; 
      }); 
     } 

     return this.userInformationsLastObservable; 
    }; 
} 

그리고 몇 가지 구성 요소가 호출이 방법 :

@Component({ 
    selector: 'app-leaderboard', 
    templateUrl: 'leaderboard.component.html', 
    styleUrls: ['leaderboard.component.css'], 
    providers: [] 

}) 
export class LeaderboardComponent implements OnInit 
{ 
    ngOnInit(){ 
     this.userService.getUserInformations().subscribe((userInformations) => { 
     this.userInformations = userInformations; 
     /* this function does not make any call to the User service */ 
     this.refresh(); 
     },() => { 
     this.isLoading = false; 
     }); 

    }; 
} 

문제는 : 콘솔의 네트워크 패널에서, 나는 5 개 요청이 전송되는 것을 볼 수 초기화시. '지도 만들기'는 5 번 인쇄되는 반면 '요청하기'는 한 번만 호출됩니다.

내가 뭘 잘못하고 있니? 다른 요청에서 응답을받은 후 보내 당신의 도움이

Answer 1

요청에 대한

덕분 구성 요소의 서비스의 가입 방법에 등록해야한다. 요소에서

에 관계없이 응답 배열의 길이

constructor(private _service: Service) { } 

ngOnInit() { 
    this._service.getUserInformations().subscribe(
    res => { 
     // call another service; 
    } 
} 

번째 요구는 한번만 송신된다.

Answer 2

문제점은 rxjs Observable 작동 방식에 대한 오해에서 비롯된 것으로 밝혀졌습니다. 나는 당신이 그 중 한 명을 구독 할 때마다 그것을 다시 실행한다는 것을 몰랐습니다. 여기에 this.userInformationsLastObservable에 가입 할 때마다 http 호출이 다시 발생합니다. 나는 전화가 창작시에만 만들어 질 것이라고 생각했고, 응답을 받으면 모든 가입자에게 통보했다.

제목을 사용하여이 문제를 해결할 것입니다.

Answer 3

public getConfig(): ReplaySubject<HomeConfig> { 

    if (this.replayConfigRequest) { 
     return this.replayConfigRequest; 
    } 

    this.configRequest = this.http.get<HomeConfig>(this.meta.configUrl); 

    this.replayConfigRequest = new ReplaySubject<HomeConfig>(1); 

    this.configRequest.subscribe(this.replayConfigRequest); 

    return this.replayConfigRequest; 
}