Share via

如何使用 Azure SignalR Service 搭配 Azure 應用程式閘道

  • 發行項

應用程式閘道 是 Web 流量負載平衡器，可讓您管理 Web 應用程式的流量。 搭配 SignalR Service 使用 應用程式閘道 可讓您執行下列動作：

  • 保護您的應用程式免於常見的 Web 弱點。
  • 取得可調整且高可用性應用程式的應用程式層級負載平衡。
  • 設定端對端安全性。
  • 自訂功能變數名稱。

本文包含兩個部分：

  • 第一個部分示範如何設定 應用程式閘道，讓用戶端可以透過 應用程式閘道 存取 SignalR。
  • 第二個部分示範如何將訪問控制新增至 SignalR 服務來保護 SignalR 服務，並只允許來自 應用程式閘道 的流量。

此圖顯示搭配 應用程式閘道 使用 SignalR Service 的架構。

設定及設定 應用程式閘道

建立 SignalR 服務實例

  • 請遵循 本文 並建立 SignalR 服務實例 ASRS1

建立 應用程式閘道 實例

從入口網站建立 應用程式閘道 實例 AG1：

  • 在 Azure 入口網站 上，搜尋 [應用程式閘道] 和 [建立]。

  • 在 [ 基本] 索引 標籤上，針對下列應用程式閘道設定使用這些值：

    • 訂 用帳戶和資源 群組 和 區域：與您針對 SignalR 服務選擇的相同

    • 應用程式閘道名稱： AG1

    • 虛擬網路，選取 [ 新建]，然後在開啟的 [建立虛擬網络 ] 視窗中，輸入下列值來建立虛擬網络和兩個子網、一個用於應用程式網關，另一個用於後端伺服器。

      • 名稱：輸入 VN1 以取得虛擬網路的名稱。

      • 子網：使用下列 2 個子網更新子網方格

        子網路名稱 位址範圍 注意
        myAGSubnet （位址範圍） 應用程式閘道的子網。 應用程式閘道子網路只能包含應用程式閘道。 不允許任何其他資源。
        myBackendSubnet （另一個位址範圍） Azure SignalR 實例的子網。

    • 接受其他設定的預設值，然後選取 [下一步：前端]

    使用 [基本] 索引標籤建立 應用程式閘道 實例的螢幕快照。

  • 在 [ 前端] 索引標籤 上：

    • 前端IP位址類型： 公用。
    • 針對 [公用 IP 位址] 選擇 [新增]，而針對公用 IP 位址名稱輸入 myAGPublicIPAddress，然後選取 [確定]。
    • 選取 [下一步：後端]使用 [前端] 索引標籤建立 應用程式閘道 實例的螢幕快照。

  • 在 [ 後端] 索引標籤上 ，選取 [新增後端集區]：

    • 名稱：輸入 SignalR 服務資源後端集區的訊號 。
    • 後端目標目標：SignalR 服務實例 ASRS1 的主機名，例如asrs1.service.signalr.net
    • 選取 [下一步：設定]

    設定SignalR服務應用程式閘道後端集區的螢幕快照。

  • 在 [組態] 索引標籤上，選取 [路由規則] 數據行中的 [新增路由規則]：

    • 規則名稱： myRoutingRule

    • 優先順序：1

    • 在 [新增路由規則] 視窗內的 [接聽程式] 索引標籤上，針對接聽程式輸入下列值：

      • 接聽程式名稱：輸入 myListener 作為接聽程式的名稱。
      • 前端 IP：選取 [公用] 以選擇您針對前端建立的公用 IP。
      • 通訊協定：HTTP
        • 我們會使用本文中 應用程式閘道 上的 HTTP 前端通訊協議來簡化示範，並協助您更輕鬆地開始使用。 但實際上，您可能需要在生產案例中啟用 HTTP 和客戶網域。
      • 接受 [接聽程式] 索引標籤上其他設定的預設值設定 SignalR Service 的應用程式閘道路由規則接聽程式索引標籤螢幕快照。

    • 在 [ 後端目標] 索引標籤上 ，使用下列值：

      • 目標類型：後端集區

      • 後端目標：選取我們先前建立的訊號

      • 後端設定：選取 [ 新增 ] 以新增新的設定。

        • 後端設定名稱： mySetting
        • 後端通訊協定： HTTPS
        • 使用已知的 CA 憑證： 是
        • 以新的主機名覆寫： 是
        • 主機名覆寫： 從後端目標挑選主機名
        • 其他保留預設值

        設定SignalR服務應用程式閘道後端設定的螢幕快照。

      建立應用程式閘道後端目標的螢幕快照。

  • 檢閱並建立 AG1檢閱和建立應用程式閘道實例的螢幕快照。

設定 應用程式閘道 健康情況探查

建立 AG1 時，請移至入口網站中 [設定] 區段底下的 [健康情況探查] 索引標籤，將健康情況探查路徑變更為/api/health

設定 SignalR 服務應用程式閘道後端健康情況探查的螢幕快照。

快速測試

  • 嘗試使用無效的用戶端要求 https://asrs1.service.signalr.net/client ，並傳回 400 並出現錯誤訊息 'hub' 查詢參數。 這表示要求已抵達 SignalR 服務，並執行要求驗證。

    curl -v https://asrs1.service.signalr.net/client

    傳回

    < HTTP/1.1 400 Bad Request
< ...
<
'hub' query parameter is required.

  • 移至 AG1 的 [概觀] 索引標籤，並找出前端公用 IP 位址

    透過 應用程式閘道 快速測試 SignalR 服務健康情況 端點的螢幕快照。

  • 請透過 AG1http://<frontend-public-IP-address>/client 流覽健康情況端點，而且也會傳回 400，並需要錯誤訊息 『hub』 查詢參數。這表示要求已成功通過 應用程式閘道 至 SignalR 服務，並執行要求驗證。

    curl -I http://<frontend-public-IP-address>/client

    傳回

    < HTTP/1.1 400 Bad Request
< ...
<
'hub' query parameter is required.

透過 應用程式閘道 執行聊天

現在，流量可以透過 應用程式閘道 到達 SignalR Service。 客戶可以使用 應用程式閘道 公用IP位址或自訂功能變數名稱來存取資源。 讓我們使用此 聊天應用程式 作為範例。 讓我們從在本機執行開始。

  • 首先，讓我們取得 ASRS1 的 連接字串

    • 在 ASRS1 的 [連線 ion 字串] 索引卷標上
      • 用戶端端點：使用 AG1 的前端公用 IP 位址輸入 URL，例如 http://20.88.8.8。 這是使用反向 Proxy 時的 連接字串 產生器，下次回到此索引標籤時，不會保留此值。輸入值時，連接字串 會附加區ClientEndpoint段。
      • 複製 連線 字串使用用戶端端點取得 SignalR Service 連接字串 的螢幕快照。

  • 複製 GitHub 存放庫 https://github.com/aspnet/AzureSignalR-samples

  • 移至 samples/Chatroom 資料夾：

  • 設定複製的 連接字串 並在本機執行應用程式，您可以看到 連線 ionString 中有一個ClientEndpoint區段。

    cd samples/Chatroom
dotnet restore
dotnet user-secrets set Azure:SignalR:ConnectionString "<copied-onnection-string-with-client-endpoint>"
dotnet run

  • 從瀏覽器開啟 http://localhost:5000 並使用 F12 來檢視網路追蹤，您可以看到 WebSocket 連線是透過 AG1 建立的

    使用應用程式閘道和 SignalR Service 在本機執行聊天應用程式的螢幕快照。

安全 SignalR 服務

在上一節中，我們成功地將 SignalR Service 設定為 應用程式閘道 的後端服務，我們可以直接從公用網路呼叫 SignalR Service，或透過 應用程式閘道 呼叫 SignalR Service。

在本節中，讓我們設定 SignalR Service 來拒絕來自公用網路的所有流量，並只接受來自 應用程式閘道 的流量。

設定 SignalR 服務

讓我們將 SignalR Service 設定為只允許私人存取。 您可以在使用 SignalR Service 的私人端點中找到更多詳細數據。

  • 移至入口網站中的 SignalR Service 實例 ASRS1。

  • 移至 [ 網络] 索引 標籤：

    • 在 [公用存取] 索引卷標上：公用網络存取權變更為 [已停用] 和 [儲存]，現在您無法再從公用網络存取 SignalR Service

      停用 SignalR 服務的公用存取螢幕快照。

    • 在 [私人存取] 索引標籤上，選取 [+ 私人端點]：

      • 在 [基本] 索引標籤上：
        • 名稱： PE1
        • 網路介面名稱： PE1-nic
        • 區域：請務必選擇與您 應用程式閘道 相同的區域
        • 選取 [下一步：資源]
      • 在 [資源] 索引標籤上
        • 保留預設值
        • 選取 [下一步]：虛擬網絡
      • 在 [虛擬網絡] 索引標籤上
        • 虛擬網路：選取先前建立 的 VN1
        • 子網：選取先前建立 的 VN1/myBackendSubnet
        • 其他保留預設設定
        • 選取 [下一步: DNS]
      • 在 [DNS] 索引標籤上
        • 與私人 DNS 區域整合： 是
      • 檢閱並建立私人端點

    設定 SignalR 服務私人端點資源的螢幕快照。

重新整理 應用程式閘道 後端集區

由於在有私人端點可供使用之前設定 應用程式閘道，因此我們需要重新整理後端集區，以便查看 私用 DNS 區域，並找出應該將流量路由傳送至私人端點，而不是公用位址。 我們將後端 FQDN 設定為一些其他值，然後將它變更回，以重新整理。

移至 AG1 的 [後端集區] 索引標籤，然後選取訊號：

  • 步驟 1：將 [目標 asrs1.service.signalr.net ] 變更為其他一些值，例如 ， x.service.signalr.net然後選取 [ 儲存]
  • 步驟 2：將目標變更回 asrs1.service.signalr.net

快速測試

  • 現在讓我們再次造訪 https://asrs1.service.signalr.net/client 。 停用公用存取時，會改為傳 回 403 。

    curl -v https://asrs1.service.signalr.net/client

    傳回

    < HTTP/1.1 403 Forbidden

  • 請流覽透過 AG1http://<frontend-public-IP-address>/client 的端點，並傳回 400 並出現錯誤訊息 'hub' 查詢參數。 這表示要求已成功通過 應用程式閘道 至 SignalR 服務。

    curl -I http://<frontend-public-IP-address>/client

    傳回

    < HTTP/1.1 400 Bad Request
< ...
<
'hub' query parameter is required.

現在，如果您再次在本機執行聊天應用程式，您會看到錯誤訊息 Failed to connect to .... The server returned status code '403' when status code '101' was expected.，這是因為已停用公用存取，讓localhost伺服器連線能夠連線到 SignalR 服務。

讓我們將聊天應用程式部署至與 ASRS1 相同的 VNet，讓聊天可以與 ASRS1 交談。

將聊天應用程式部署至 Azure

  • 在 Azure 入口網站 上，搜尋 [應用程式服務] 和 [建立Web 應用程式]。

  • 在 [ 基本] 索引 標籤上，針對下列 Web 應用程式設定使用這些值：

    • 訂 用帳戶和資源 群組 和 區域：與您針對 SignalR 服務選擇的相同
    • 名稱： WA1
    • 發佈：程序代碼
    • 執行時間堆疊： .NET 6 （LTS）
    • 操作系統： Linux
    • 區域：請確定它與您選擇的 SignalR 服務相同
    • 選取 [ 下一步：部署]，保留全部為預設值，然後選取 [ 下一步：網络]

  • 在 [ 網络] 索引標籤 上

    • 開啟網路插入：選擇 [ 開啟]
    • 虛擬網絡：選取我們先前建立的 VN1
    • 啟用 VNet 整合： 開啟
    • 輸出子網：建立新的子網
    • 選取 [檢閱 + 建立]

現在讓我們將聊天應用程式部署至 Azure。 Below

我們使用 Azure CLI 將聊天應用程式部署至 Azure。 請參閱 快速入門：針對部署至 Azure 的其他部署環境部署 ASP.NET Web 應用程式 。

在資料夾範例/Chatroom 底下，執行下列命令：

# Build and publish the assemblies to publish folder
dotnet publish --os linux -o publish
# zip the publish folder as app.zip
cd publish
zip -r app.zip .
# use az CLI to deploy app.zip to our webapp
az login
az account set -s <your-subscription-name-used-to-create-WA1>
az webapp deploy -g <resource-group-of-WA1> -n WA1 --src-path app.zip

現在已部署 Web 應用程式，讓我們前往 WA1 的入口網站，並進行下列更新：

  • 在 [組態] 索引標籤上：

    • 新的應用程式設定：

      名稱 值
      WEBSITE_DNS_SERVER 168.63.129.16
      WEBSITE_VNET_ROUTE_ALL 1

    • 新的 連接字串：

      名稱 值 類型
      AzureSignalR 連線 ionString 具有 ClientEndpoint 值的複製 連接字串 選取 [自訂]

    設定 Web 應用程式 連接字串 的螢幕快照。

  • 在 [ TLS/SSL 設定 ] 索引標籤上：

    • 僅限 HTTPS： 關閉。 為了簡化示範，我們在 應用程式閘道 上使用 HTTP 前端通訊協定。 因此，我們需要關閉此選項，以避免自動將 HTTP URL 變更為 HTTP。

  • 移至 [概觀] 索引標籤並取得 WA1 的 URL。

  • 取得 URL，並以 HTTP 取代配置 HTTPs，例如 http://wa1.azurewebsites.net，在瀏覽器中開啟 URL，現在您可以開始聊天！ 使用 F12 來開啟網路追蹤，而且您可以看到 SignalR 連線是透過 AG1 建立的。

    注意

    有時候，您必須停用瀏覽器的自動 HTTPS 重新導向和瀏覽器快取，以防止 URL 自動重新導向至 HTTPS。

    使用應用程式閘道和 SignalR Service 在 Azure 中執行聊天應用程式的螢幕快照。

下一步

現在，您已使用 SignalR Service 成功建置即時聊天應用程式，並使用 應用程式閘道 來保護您的應用程式並設定端對端安全性。 深入瞭解 SignalR Service。