Javascript Angular 7 SSR，多次调用应用程序组件ngOnInit（）

我有一个angular 7应用程序，大约有30个模块。我正在

app.component.ts

中获取用户详细信息，以便在整个应用程序中使用它，但我突然注意到，用户详细信息API在一次加载时运行多次

将日志放入我的

app.component.ts

中的

ngOnInit（）

后，我发现日志打印了多次，但只在浏览器的服务器端渲染上发生，只渲染一次

---

知道为什么ngOnInit（）调用多次吗？

角度SSR的概念是，在第一次加载页面/URL时，它通过服务器呈现，然后在客户端传输数据。所以从技术上讲，它会调用所有组件，服务在该页面/URL上存在两次

---

您可以使用条件isPlatformBrowser和isPlatformServer方法，以便只在服务器端渲染所需的零件。我们只在SSR上呈现与SEO优化相关的特定内容。

在所有指令实例化之后，ngOnInit（）钩子只会出现一次。如果您在ngOnInit（）中有订阅，并且没有取消订阅，那么如果订阅的数据发生更改，它将再次运行。在服务器端通过SSR加载API调用时，服务器并不总是等待响应，这可能是产生多个日志的原因。建议使用isPlatformBrowser在客户端委派此任务。在我看来，这是基于对一般SSR流的调查

我不确定这个问题是否已经解决，但有一个建议：

在组件本身中添加

subscribe

部分，并将其从进行HTTP调用的函数中删除：

ngOnInit() {
    this.loadData();
}

loadData(){
    this.my_service.getData().subscribe(data => this.userDetails = data);
}

getData() {
    return this.http.get('../your/url')
           .map((res:Response) => res.json());
}

在您的服务中，您可以使用普通HTTP调用：

ngOnInit() {
    this.loadData();
}

loadData(){
    this.my_service.getData().subscribe(data => this.userDetails = data);
}

getData() {
    return this.http.get('../your/url')
           .map((res:Response) => res.json());
}

---

我希望这能有所帮助。

嘿，我不知道为什么会发生这种情况，但我确实为自己解决了一个类似的问题。有一次，我处理了身份验证重定向，该重定向将转到SSO页面并返回到我的应用程序，该页面保留了init中声明的对象和承诺。服务器端呈现是否可以在呈现页面的过程中执行一些操作，并将say从root重定向到/home作为重定向？并尝试渲染两次，导致init函数运行两次？这听起来不太对，但可能是你的一个起点？你能提供更多细节吗？你的应用程序组件中有什么？以及应用程序组件的相关内容？你能提供代码吗？你需要提供一些关于你的代码和你的应用架构的细节。Angular的SSR在开箱即用的很好你能给我一些代码吗？比如日志指令在哪里，AppComponent是如何引导的？不是一个解决方案，而是一个提示。我有一个类似的问题，AppComponent的ngOnInit被多次调用。这是由到延迟加载模块的路由事件触发的，该模块被防护阻止。此事件触发了对AppComponent的重定向，并再次调用了ngOnInit。但是如何确保app.component.ts

ngOnInit

只应调用once@GauravAggarwal这回答了你的问题吗？