Azure Web PubSub 實做及時聊天服務

  • 90
  • 0

Azure Web PubSub 是微軟推出的一個新服務,目前還在預覽中,它是即時推撥訊息的服務,透過伺服器和用戶端建立 WebSoket 連線,做到及時的訊息傳遞的服務,它底層還是微軟之前推出的 SignalR ,他簡化了 SignalR 的使用,僅保留 WebSoket 的連線方式,然後支援 CloudEvents 格式,在使用上也不需要限定使用 SignalR 的 JS SDK,可以使用任何 WebSoket 的套件來使用,本文針對官方聊天室範例實做過程做個記錄,並且把一些會卡住的點說明一下。

前言

Azure Web PubSub 是微軟推出的一個新服務,目前還在預覽中,它是即時推撥訊息的服務,透過伺服器和用戶端建立 WebSoket 連線,做到及時的訊息傳遞的服務,它底層還是微軟之前推出的 SignalR ,他簡化了 SignalR 的使用,僅保留 WebSoket 的連線方式,然後支援 CloudEvents 格式,在使用上也不需要限定使用 SignalR 的 JS SDK,可以使用任何 WebSoket 的套件來使用,本文針對官方聊天室範例實做過程做個記錄,並且把一些會卡住的點說明一下。

說明

開始前還是不免俗介紹一下 Web PubSub ,根據官方說明,它可以使用在底下的情境:

  • 高頻率資料更新: 遊戲、投票、輪詢、拍賣。
  • 即時儀表板和監視: 公司儀表板、財務市場資料、即時銷售更新、多玩家遊戲領導人面板,以及 IoT 監視。
  • 跨平臺即時聊天: 即時聊天室、聊天機器人、線上客戶支援、即時購物助理、messenger、遊戲中的交談等等。
  • 地圖上的即時位置: 物流追蹤、傳遞狀態追蹤、運輸狀態更新、GPS 應用程式。
  • 即時目標廣告: 個人化即時推播廣告和供應專案、互動式廣告。
  • 共同作業應用程式: 共同創作、白板應用程式和小組會議軟體。
  • 推播立即通知: 社交網路、電子郵件、遊戲、旅遊警示。
  • 即時廣播: 即時音訊/視訊廣播、即時隱藏式輔助字幕、轉譯、事件/新聞廣播。
  • IoT 和連接的裝置: 即時 IoT 計量、遠端控制、即時狀態,以及位置追蹤。
  • 自動化: 上游事件的即時觸發程序。

這類型訂閱推撥服務最基本的應用就是聊天室了,所以這次挑選來實做看看。首先搜尋 Web PubSub Service 可以看到底下的服務:

建立的畫面相當簡單,唯一要注意的只有定價層

目前微軟提供兩種定價層,一個是免費,一個是標準,免費針對的就是開發和測試時候使用,每一單位連線數為 20 ,每天發訊息上限為 20000,最大單位只能一個,所以是無法針對服務規模去調整執行的個體,更多詳細比較可以參考下圖。

正常的話大約幾分鐘內服務就會建立完成,但是我第一次建立的時候,執行了一個多小時之後建置失敗,之後在建立就幾分鐘內就完成了,可能因為還在預覽,所以產生這樣的錯誤,如果在建立的過程等候太久的話,很有可能是會建置失敗的。

再來點選金鑰這一個功能,複製連接字串,之後會需要用到

接下來到這邊取得官方範例,裡面包含各種程式語言的範例,我這邊挑選 C# 的 chatapp 來測試,下載之後開啟專案,主要修改的檔案為 Startup.cs 的 ConfigureServices 內,首先把前面複製下來的連線字串填入。

services.AddAzureClients(builder =>
{                
    builder.AddWebPubSubServiceClient("<connection_string>", "chat");
});

再來針對這個範例,需要在同一個區塊補上底下的程式碼,因為後面的程式碼包含了非同步的 IO 程式,如果不開啟的話會產生錯誤,而這個錯誤在這個情境底下會很難找到問題點,我也是卡住很久後來才意外找到解決辦法,底下針對 Kestrel 和 IIS 的執行模式有不同的設定,請針對 .NET Core 執行的 Web Server 自行選擇,或是都輸入。

// If using Kestrel:
services.Configure<KestrelServerOptions>(options =>
{
    options.AllowSynchronousIO = true;
});

// If using IIS:
services.Configure<IISServerOptions>(options =>
{
    options.AllowSynchronousIO = true;
});

整個 ConfigureServices 區塊修改之後程式碼如下:

public void ConfigureServices(IServiceCollection services)
{
    services.AddAzureClients(builder =>
    {                
        builder.AddWebPubSubServiceClient("<connection_string>", "chat");
    });

    // If using Kestrel:
    services.Configure<KestrelServerOptions>(options =>
    {
        options.AllowSynchronousIO = true;
    });

    // If using IIS:
    services.Configure<IISServerOptions>(options =>
    {
        options.AllowSynchronousIO = true;
    });
}

再來針對特定的系統訊息需要做 Handler 的設定,才會送出這些訊息到我們的程式,不然只會收到客戶端傳送的一般訊息,在設定前需要確認有對外的網址,可以將程式部署到 Azure 或是使用 ngrok 這類型服務產生一個對外網址,再來開啟 Web PubSub 設定,新增一個 Handler, Hub Name 請輸入 chat 或是看前面設定連線字串時候有沒有調整,然後 Url 部分輸入 http://<url>/eventhandler ,請針對自己的對外網址修改,System Events 部分選擇 connected,存檔之後就可以了,針對這一個事件主要是判斷有用戶端連上的時候,就會收到訊息,然後在畫面上就可以呈現某人加入的訊息。

修改到這邊就可以執行程式來測試了,用瀏覽器開啟 index.html 就可以測試這一個範例了,開啟兩個不同的瀏覽器,就可以正確執行和傳送訊息了。

結論

簡單的玩了一下這個服務,大致上的應用和 SignalR 是一樣的,如果本來就已經在用 SignalR 建立還是可以維持使用該服務,因為還是比較完整可以支援不同連線方式,對於瀏覽器相容性會高一點,尤其是不支援 WebSoket 的老舊瀏覽器,如果想要快速簡單的使用,就可以嘗試這一個新服務,使用上可以比較簡易的使用,官方也提供很多範例,其中有一個電子白板的範例也是很有趣,大家可以嘗試玩看看。

本文僅針對服務簡單的測試,之後有機會會針對服務跟 SDK 做介紹,看看可以做出怎樣有趣的範例來說明更多的情境。

參考資料