Day04 - SignalR 簡介


前言

ASP.NET Core 3 最特別的兩個新玩意兒應該是 BlazorSignalR 吧!這兩個Frameworks可是有關聯的呢!這篇文將會簡介 BlazorSignalR


Blazor 和 SignalR

SignalR

SignalR 是一個 Framework,可以用來建立 real-time web applications。

什麼是 real-time web application ?

real-time web application 就是當Server端(也就是ASP.NET Core)發送更新的訊息給 Client端(例如瀏覽器)時,Client端不完全重整整個頁面的去顯示更新過後的資料。舉例來說,我們常用的Gmail。我們登入Gmail後,當有新的信件寄過來時,我們不需要重新整理整個頁面,就能看到有新的信件寄過來了。

Blazor

Blazor 是一個 Framework,可以用來建立 single-page applications。

什麼是 single-page applications ?

傳統MVc的運作模式是從瀏覽器收到的request由ASP.NET Core application 內部Server端的Controller處理。然後,該Controller收集Data,將Data放入Model中,然後使用Model將Data發送到View,從而以某種方式呈現Data。回覆給瀏覽器的response最終是純HTML、CSS和JavaScript。當User在瀏覽器觸發什麼事件時,通常會向Controller發出request,然後重複相同的循環。而single-page的運作模式則是在第一次Server端發送request給Client時,只有HTML、CSS和JavaScript會被送到瀏覽器。另外,Server端還會有負責處理跟user互動的API,又稱 Web APIWeb Server。 API不使用Pages,但它提供pure data給single-page application。


頁面上的所有用戶交互(例如Click按鈕)都由瀏覽器使用JavaScript處理。甚至HTTP請求獲取Data也是在JavaScript中完成的。如果你研究過React,Angular或Vue等JavaScript框架時,就會知道它是如何運作的。一直到現在,JavaScript是唯一實現此目標的方法,因為JavaScript是瀏覽器唯一能理解的編程語言。 Blazor是一個單頁面的應用程序框架,可以使用C#代替JavaScript來處理頁面上的user的互動。就像大多數基於JavaScript的框架一樣,Blazor是基於組件(Component Based)的。它使用兩種 hosting models 。一種是client-side hosting model,另一種是server-side hosting model

client-side hosting model

用C#編寫的組件以.NET dll的形式直接發送到瀏覽器,可以在其中進行組合和使用。當然,瀏覽器不理解.NET assemblies,這就是為什麼會發送特殊版本的Mono的原因。傳統上,Mono是開放源代碼.NET框架,但在其最新版本中,它可以解釋中間語言。 .NET程序集中包含的代碼語言。瀏覽器可以執行Mono,因為它接收的版本是用一種新的類似於彙編語言的低階語言寫的,瀏覽器可以理解為WebAssembly。然後,Mono在包含組件的程序集中獲取代碼,並將其傳遞給WebAssembly,以便瀏覽器也可以執行它。最重要的是,Blazor還提供了從組件代碼執行JavaScript的功能。

server-side hosting model

在此模型中,組件的程式碼碼將保留在服務器上,因此它們將在服務器上呈現並轉換為HTML。使用SignalR連接將呈現的組件發送到瀏覽器。當組件代碼中有某些事件的處理程序時,瀏覽器將通過相同的雙向SignalR連接將事件通知服務器。然後,服務器可以重新呈現UI並再次將UI更新發送到瀏覽器。


結語

今天只介紹簡介 Blazor 和 SignalR,之後會另外寫一篇範例程式的實作文。







留言討論