Angular [SSR](https://stackoverflow.com/questions/58612090/how-could-do-some-http-requests-just-from-the-server-side-in-angular-universal) 只負責渲染 initial page，一旦載入了初始頁面，客戶端 Angular 應用程式就會接剩下的互動，然後客戶就可以進行 SPA 導航，並透過 ajax 呼叫後臺 API。

Angular SSR 需要注意的開發[關鍵點](https://www.tektutorialshub.com/angular/server-side-rendering-using-angular-universal/#things-to-note)。

如何檢查一個網站是 http1.1 還是 http1.0？

![](https://img-blog.csdnimg.cn/img_convert/db5565922411a77a83d8cf2d48ec6985.png)

ng serve 處於 dev 用途的 express 伺服器：

![](https://img-blog.csdnimg.cn/img_convert/033e75ac9fee1851a2c10be53ad735a7.png)

在 Chrome 開發者工具 network 皮膚也能看到：

![](https://img-blog.csdnimg.cn/img_convert/ac9d2494e4fc019953785f3b79866991.png)

在 response header 區域也能檢視：
![](https://img-blog.csdnimg.cn/img_convert/8fb050c5f1aa336268c3c45539da03cf.png)

連線重用是使用 HTTP Keep-alive，這是 HTTP/1.1 的一個特性。 透過使用 HTTP Keep-alive，一個 `TCP` 連線用於順序處理多個 HTTP 請求，因此可以節省為每個請求開啟新 `TCP` 連線的時間。 然而，每個 `HTTP` 請求本身都是[獨立](https://stackoverflow.com/questions/1697424/http-connection-reuse)的，因此不會自動重複使用身份驗證和類似請求。

在 HTTP 1.1 中，除非另有宣告，否則所有連線都被視為持久連線。HTTP 持久連線不使用單獨的 keepalive 訊息，它們只允許多個請求使用單個連線。 但是，Apache httpd 1.3 和 2.0 的預設連線超時時間僅為 15 秒，而 Apache httpd 2.2 及更高版本僅為 5 秒。短超時的優點是能夠快速交付網頁的多個元件，同時不會消耗資源來執行多個伺服器程式或執行緒太長時間。

![](https://img-blog.csdnimg.cn/img_convert/f5f8f742240a7cd1a76c874cc9aea6ad.png)

上圖左邊演示了頻繁的 TCP 連線建立和關閉。

HttpClient是一個內建的服務類，位於 `@angular/common/http` 包中。它對每個請求都有多個簽名和返回型別。它使用 RxJS 基於可觀察的api，這意味著它返回可觀察物件和訂閱它所需的內容。這個API是基於瀏覽器公開的XMLHttpRequest介面開發的。

關於 HttpClient 是否是 [singleton](https://stackoverflow.com/questions/40811278/angular-2-http-service-is-singleton-or-not) 的問題：

- 如果在 AppModule 的 `@NgModule({providers: [...]})` 或 AppModule 直接或間接匯入的模組中提供服務，那麼你會得到一個單例。

- 如果在 `@Component(...)` 中提供服務，那麼將獲得每個元件例項的服務例項。

關於 Angular HttpClient 的單例特性的思考

相關文章