Verwenden von Azure SignalR Service mit Azure API Management

Der Azure API Management-Dienst bietet eine hybride Multi-Cloud-Verwaltungsplattform für APIs in allen Umgebungen. In diesem Artikel erfahren Sie, wie Sie Ihre Anwendung mithilfe des Azure API Management- und des Azure SignalR-Diensts mit Echtzeitfunktionen ausstatten.

Wichtig

Unformatierte Verbindungszeichenfolgen werden in diesem Artikel nur zu Demonstrationszwecken angezeigt.

Eine Verbindungszeichenfolge enthält die Autorisierungsinformationen, die Ihre Anwendung für den Zugriff auf den Azure SignalR-Dienst benötigt. Der Zugriffsschlüssel in der Verbindungszeichenfolge ähnelt einem Stammkennwort für Ihren Dienst. Schützen Sie Ihre Zugriffsschlüssel in Produktionsumgebungen immer sorgfältig. Verwenden Sie Azure Key Vault, um Ihre Schlüssel sicher zu verwalten und zu rotieren, Ihre Verbindungszeichenfolge mithilfe von Microsoft Entra ID zu schützen und den Zugriff mit Microsoft Entra ID zu autorisieren.

Geben Sie Zugriffsschlüssel nicht an andere Benutzer weiter, vermeiden Sie das Hartcodieren, und speichern Sie die Schlüssel nicht als Klartext, auf den andere Benutzer Zugriff haben. Rotieren Sie die Schlüssel, wenn Sie glauben, dass sie möglicherweise gefährdet sind.

Erstellen von Ressourcen

• Unter Schnellstart: Verwenden einer ARM-Vorlage zum Bereitstellen von Azure SignalR finden Sie Informationen zum Erstellen einer SignalR Service-Instanz ASRS1

• Unter Schnellstart: Verwenden einer ARM-Vorlage zum Bereitstellen von Azure API Management finden Sie Informationen zum Erstellen einer API Management-Instanz APIM1

Konfigurieren von APIs

Begrenzungen

Es gibt zwei Arten von Anforderungen für einen SignalR-Client:

• Aushandlungsanforderung: HTTP POST Anforderung an <APIM-URL>/client/negotiate/
• Verbindungsanforderung: Anforderung an <APIM-URL>/client/, kann entweder WebSocket oder ServerSentEvent oder LongPolling sein, je nach dem Datentransporttyp Ihres SignalR-Clients

Der Typ der Verbindungsanforderung variiert je nach Datentransporttyp der SignalR-Clients. Im Moment unterstützt API Management noch nicht die unterschiedlichen Arten von APIs für dasselbe Suffix. Mit dieser Einschränkung unterstützt Ihr SignalR-Client bei Verwendung von API Management kein Fallback von Datentransporttyp WebSocket auf andere Datentransporttypen. Fallback von ServerSentEvent nach LongPolling könnte unterstützt werden. In den folgenden Abschnitten werden die detaillierten Konfigurationen für die verschiedenen Datentransporttypen beschrieben.

Konfigurieren von APIs, wenn der Client eine Verbindung mit dem WebSocket-Datentransport herstellt

In diesem Abschnitt werden die Schritte zum Konfigurieren von API Management beschrieben, wenn die SignalR-Clients eine Verbindung mit dem WebSocket-Datentransport herstellen. Wenn SignalR-Clients eine Verbindung mit dem WebSocket-Datentransport herstellen, sind drei Arten von Anforderungen beteiligt:

1. OPTIONS Preflight-HTTP-Anforderung für Aushandeln
2. POST HTTP-Anforderung für Aushandeln
3. WebSocket-Anforderung für die Verbindung

Jetzt können wir API Management über das Portal konfigurieren.

1. Wechseln Sie zur Registerkarte APIs im Portal für die API Management-Instanz-APIM1, wählen Sie API hinzufügen aus, und wählen Sie HTTP und dann Erstellen mit den folgenden Parametern aus:
   • Anzeigename: SignalR negotiate
   • Webdienst-URL: https://<your-signalr-service-url>/client/negotiate/
   • API-URL-Suffix: client/negotiate/
2. Wählen Sie die erstellte SignalR negotiate-API aus, und Speichern Sie diese mit den folgenden Einstellungen:
   1. In der Registerkarte Entwerfen
      1. Wählen Sie Vorgang hinzufügen und dann Speichern Sie ihn mit den folgenden Parametern:
         • Anzeigename: negotiate preflight
         • URL: OPTIONS /
      2. Wählen Sie Vorgang hinzufügen und dann Speichern Sie ihn mit den folgenden Parametern:
         • Anzeigename: negotiate
         • URL: POST /
   2. Wechseln sie zur Registerkarte Einstellungen, und deaktivieren Sie Abonnement erforderlich für die Schnelldemo
3. Wählen Sie API hinzufügen aus, und wählen Sie WebSocket, Erstellen mit den folgenden Parametern aus:
   • Anzeigename: SignalR connect
   • WebSocket-URL: wss://<your-signalr-service-url>/client/
   • API-URL-Suffix: client/
4. Wählen Sie die erstellte SignalR connect-API aus, und Speichern Sie diese mit den folgenden Einstellungen:
   1. Wechseln sie zur Registerkarte Einstellungen, und deaktivieren Sie Abonnement erforderlich für die Schnelldemo

Jetzt ist API Management erfolgreich konfiguriert, um den SignalR-Client mit WebSocket-Datentransport zu unterstützen.

Konfigurieren von APIs, wenn der Client eine Verbindung mit dem ServerSentEvents- oder dem LongPolling-Datentransport herstellt

In diesem Abschnitt werden die Schritte zum Konfigurieren von API Management beschrieben, wenn die SignalR-Clients eine Verbindung mit dem ServerSentEvents- oder dem LongPolling-Datentransporttyp herstellen. Wenn SignalR-Clients eine Verbindung mit dem ServerSentEvents- oder dem LongPolling-Datentransport herstellen, sind fünf Arten von Anforderungen beteiligt:

1. OPTIONS Preflight-HTTP-Anforderung für Aushandeln
2. POST HTTP-Anforderung für Aushandeln
3. OPTIONS Preflight-HTTP-Anforderung für Verbinden
4. POST HTTP-Anforderung für Verbinden
5. GET HTTP-Anforderung für Verbinden

Nun konfigurieren wir API Management über das Portal.

1. Wechseln Sie zur Registerkarte APIs im Portal für die API Management-Instanz-APIM1, wählen Sie API hinzufügen aus, und wählen Sie HTTP und dann Erstellen mit den folgenden Parametern aus:
   • Anzeigename: SignalR
   • Webdienst-URL: https://<your-signalr-service-url>/client/
   • API-URL-Suffix: client/
2. Wählen Sie die erstellte SignalR-API aus, und Speichern Sie diese mit den folgenden Einstellungen:
   1. In der Registerkarte Entwerfen
      1. Wählen Sie Vorgang hinzufügen und dann Speichern Sie ihn mit den folgenden Parametern:
         • Anzeigename: negotiate preflight
         • URL: OPTIONS /negotiate
      2. Wählen Sie Vorgang hinzufügen und dann Speichern Sie ihn mit den folgenden Parametern:
         • Anzeigename: negotiate
         • URL: POST /negotiate
      3. Wählen Sie Vorgang hinzufügen und dann Speichern Sie ihn mit den folgenden Parametern:
         • Anzeigename: connect preflight
         • URL: OPTIONS /
      4. Wählen Sie Vorgang hinzufügen und dann Speichern Sie ihn mit den folgenden Parametern:
         • Anzeigename: connect
         • URL: POST /
      5. Wählen Sie Vorgang hinzufügen und dann Speichern Sie ihn mit den folgenden Parametern:
         • Anzeigename: connect get
         • URL: GET /
      6. Wählen Sie den neu hinzugefügten Vorgang connect getaus, und bearbeiten Sie die Backendrichtlinie, um die Pufferung für ServerSentEvents zu deaktivieren. Weitere Details finden Sie hier.

         <backend>
             <forward-request buffer-response="false" />
         </backend>
         

   2. Wechseln sie zur Registerkarte Einstellungen, und deaktivieren Sie Abonnement erforderlich für die Schnelldemo

Jetzt ist API Management erfolgreich konfiguriert, um den SignalR-Client mit dem ServerSentEvents- oder dem LongPolling-Datentransport zu unterstützen.

Chat ausführen

Nun kann der Datenverkehr SignalR Service über API Management erreichen. Verwenden wir diese Chatanwendung als Beispiel. Wir beginnen mit der lokalen Ausführung.

Unformatierte Verbindungszeichenfolgen werden in diesem Artikel nur zu Demonstrationszwecken angezeigt. Schützen Sie Ihre Zugriffsschlüssel in Produktionsumgebungen immer sorgfältig. Verwenden Sie Azure Key Vault, um Ihre Schlüssel sicher zu verwalten und zu rotieren, Ihre Verbindungszeichenfolge mithilfe von Microsoft Entra ID zu schützen und den Zugriff mit Microsoft Entra ID zu autorisieren.

• Zuerst rufen wir die Verbindungszeichenfolge von ASRS1 ab.

  • Auf der Registerkarte Verbindungszeichenfolgen von ASRS1:
    • Clientendpunkt: Geben Sie die URL mithilfe der Gateway-URL von APIM1ein, z. B https://apim1.azure-api.net. . Dies ist ein Verbindungszeichenfolgen-Generator bei Verwendung von Reverseproxys, und der Wert bleibt nicht erhalten, wenn Sie das nächste Mal zu dieser Registerkarte zurückkehren. Wenn ein Wert eingegeben wird, fügt die Verbindungszeichenfolge einen Abschnitt ClientEndpoint an.
    • Kopieren Sie die Verbindungszeichenfolge.

• Klonen Sie das GitHub-Repository https://github.com/aspnet/AzureSignalR-samples.

• Wechseln Sie zum Ordner „samples/Chatroom“:

• Legen Sie die kopierte Verbindungszeichenfolge fest, und führen Sie die Anwendung lokal aus. Sie sehen, dass in ConnectionString ein Abschnitt ClientEndpoint vorhanden ist.

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

• Konfigurieren des Datentransporttyps für den Client

  Öffnen Sie index.html im Ordner wwwroot, und suchen Sie den Code, wenn connection erstellt wird, und aktualisieren Sie ihn, um den Datentransporttyp anzugeben.

  Um zum Beispiel die Verbindung so zu spezifizieren, dass vom Server gesendete Ereignisse oder lange Abfragen verwendet werden, aktualisieren Sie den Code auf:

  const connection = new signalR.HubConnectionBuilder()
    .withUrl(
      "/chat",
      signalR.HttpTransportType.ServerSentEvents |
        signalR.HttpTransportType.LongPolling
    )
    .build();
  

  Um die Verbindung zur Verwendung von WebSockets anzugeben, aktualisieren Sie den Code auf:

  const connection = new signalR.HubConnectionBuilder()
    .withUrl("/chat", signalR.HttpTransportType.WebSockets)
    .build();
  

• Öffnen Sie http://localhost:5000 über den Browser, und drücken Sie F12, um die Netzwerkablaufverfolgungen anzuzeigen. Sie stellen fest, dass die Verbindung über APIM1 hergestellt wird

Nächste Schritte

Jetzt haben Sie API Management mithilfe von Azure SignalR eine Echtzeitfunktion hinzugefügt. Erfahren Sie mehr über SignalR Service.