렌더링하기 전에 http 호출이 완료 될 때까지 서버가 대기하지 않습니다. - 네 번째 네 번째 서버 쪽 렌더링

Question

나는 범용 보간을 구현했으며 서버 쪽 렌더링을 통해 html의 정적 부분을 렌더링 할 수 있습니다. 내가 직면 한 문제는 http 호출이 완료 될 때까지 기다리지 않고 API 호출이 이루어지고 서버가 html을 렌더링하는 것입니다. 그래서 내 템플릿이 api 호출에서 얻은 데이터에 종속적 인 부분은 서버에서 렌더링되지 않습니다.

추가 정보 :

I는 사용자 인증 및 응답에 대한 쿠키를 설정하는 경우에만 인덱스 HTML을 제공 노드 서버에 인증을 사용한다.

각도에서 API 호출을 할 때마다 종속 서비스가 토큰을 사용하여 사용자의 유효성을 검사하므로 쿠키를 헤더로 보냅니다. 서버 측 렌더링의 경우 서버 수준에서 쿠키를 사용할 수 없으므로 요청을 성공적으로 주입하고 API 호출에 대한 쿠키를 선택했습니다. 따라서 API 호출은 성공적이지만 서버는 약속이 해결 될 때까지 렌더링 대기를 기다리지 않습니다. 내가 성공하지 시도

단계 :이 댓글 https://github.com/angular/universal-starter/issues/181#issuecomment-250177280

더 정보가 필요하면 알려 주시기 바랍니다에 제안

내 영역 버전을 변경했습니다.

http 호출이 포함 된 각도 범용 상용구로 나를 안내하면 도움이 될 것입니다.

Answer 1

마지막으로 해결 방법은 외부 API 비동기 호출을 매크로 작업으로 예약하는 것입니다. 이 issue의 설명이 도움이되었습니다. 외부 API 비동기 호출에 대한 도우미 래퍼 클래스와 같은 ZoneMacroTaskWrapper을 구현하면 렌더링 프로세스가 외부 약속을 기다리게됩니다.

현재 ZoneMacroTaskWrapper은 공개 API에 노출되지 않습니다. 그러나 문서화를 약속하는 쟁점이 있습니다.

Answer 2

나는 내 요구에 맞는 솔루션을 만들었습니다. 어쩌면 그것은 우리 모두를 돕고 있습니다 :

const obs = new Observable<Item<any>>(subscriber => { 
    this.thirdPartyService.getItem(itemId).then((item) => { 
    subscriber.next(item); 
    subscriber.complete(); 
    return item; 
    }); 
}); 
return obs.map(item => item.data);