Come usare Servizio Azure SignalR con Azure Gestione API

Il servizio Azure Gestione API offre una piattaforma di gestione ibrida e multicloud per le API in tutti gli ambienti. Questo articolo illustra come aggiungere funzionalità in tempo reale all'applicazione con Azure Gestione API e il servizio Azure SignalR.

Creare le risorse

• Seguire Avvio rapido: Usare un modello di Resource Manager per distribuire Azure SignalR e creare un'istanza di Servizio SignalR ASRS1

• Seguire Avvio rapido: Usare un modello di Resource Manager per distribuire Azure Gestione API e creare un'API dell'istanza di Gestione API M1

Configurare le API

Limiti

Esistono due tipi di richieste per un client SignalR:

• richiesta negoziata: richiesta HTTP POST a<APIM-URL>/client/negotiate/
• richiesta di connessione: richiesta a <APIM-URL>/client/, potrebbe essere WebSocket o ServerSentEvent LongPolling dipende dal tipo di trasporto del client SignalR

Il tipo di richiesta di connessione varia a seconda del tipo di trasporto dei client SignalR. Per il momento, Gestione API non supporta ancora diversi tipi di API per lo stesso suffisso. Con questa limitazione, quando si usa Gestione API, il client SignalR non supporta il fallback dal WebSocket tipo di trasporto ad altri tipi di trasporto. Il fallback da ServerSentEvent a LongPolling potrebbe essere supportato. Le sezioni seguenti descrivono le configurazioni dettagliate per i diversi tipi di trasporto.

Configurare le API quando il client si connette con WebSocket il trasporto

Questa sezione descrive i passaggi per configurare Gestione API quando i client SignalR si connettono al WebSocket trasporto. Quando i client SignalR si connettono con WebSocket il trasporto, vengono coinvolti tre tipi di richieste:

1. OPTIONS preflight HTTP request for negotiate
2. Richiesta HTTP POST per la negoziazione
3. Richiesta WebSocket per la connessione

Configurare Gestione API dal portale.

1. Passare alla scheda API nel portale per Gestione API'APIM1 dell'istanza, selezionare Aggiungi API e scegliere HTTP, Crea con i parametri seguenti:
   • Nome visualizzato: SignalR negotiate
   • URL servizio Web: https://<your-signalr-service-url>/client/negotiate/
   • Suffisso URL API: client/negotiate/
2. Selezionare l'API creata SignalR negotiate , Salva con le impostazioni seguenti:
   1. Nella scheda Progettazione
      1. Selezionare Aggiungi operazione e Salva con i parametri seguenti:
         • Nome visualizzato: negotiate preflight
         • URL: OPTIONS /
      2. Selezionare Aggiungi operazione e Salva con i parametri seguenti:
         • Nome visualizzato: negotiate
         • URL: POST /
   2. Passare alla scheda Impostazioni e deselezionare Sottoscrizione necessaria per uno scopo demo rapido
3. Selezionare Aggiungi API e scegliere WebSocket, Crea con i parametri seguenti:
   • Nome visualizzato: SignalR connect
   • URL WebSocket: wss://<your-signalr-service-url>/client/
   • Suffisso URL API: client/
4. Selezionare l'API creata SignalR connect , Salva con le impostazioni seguenti:
   1. Passare alla scheda Impostazioni e deselezionare Sottoscrizione necessaria per uno scopo demo rapido

Ora Gestione API è configurato correttamente per supportare il client SignalR con WebSocket il trasporto.

Configurare le API quando il client si connette con ServerSentEvents o LongPolling trasporto

Questa sezione descrive i passaggi per configurare Gestione API quando i client SignalR si connettono al ServerSentEvents tipo di trasporto o LongPolling . Quando i client SignalR si connettono con ServerSentEvents o LongPolling con il trasporto, sono coinvolti cinque tipi di richieste:

1. OPTIONS preflight HTTP request for negotiate
2. Richiesta HTTP POST per la negoziazione
3. OPTIONS preflight HTTP request for connect
4. Richiesta HTTP POST per la connessione
5. Richiesta HTTP GET per la connessione

Configurare ora Gestione API dal portale.

1. Passare alla scheda API nel portale per Gestione API'APIM1 dell'istanza, selezionare Aggiungi API e scegliere HTTP, Crea con i parametri seguenti:
   • Nome visualizzato: SignalR
   • URL servizio Web: https://<your-signalr-service-url>/client/
   • Suffisso URL API: client/
2. Selezionare l'API creata SignalR , Salva con le impostazioni seguenti:
   1. Nella scheda Progettazione
      1. Selezionare Aggiungi operazione e Salva con i parametri seguenti:
         • Nome visualizzato: negotiate preflight
         • URL: OPTIONS /negotiate
      2. Selezionare Aggiungi operazione e Salva con i parametri seguenti:
         • Nome visualizzato: negotiate
         • URL: POST /negotiate
      3. Selezionare Aggiungi operazione e Salva con i parametri seguenti:
         • Nome visualizzato: connect preflight
         • URL: OPTIONS /
      4. Selezionare Aggiungi operazione e Salva con i parametri seguenti:
         • Nome visualizzato: connect
         • URL: POST /
      5. Selezionare Aggiungi operazione e Salva con i parametri seguenti:
         • Nome visualizzato: connect get
         • URL: GET /
      6. Selezionare l'operazione get di connessione appena aggiunta e modificare i criteri back-end per disabilitare il buffering per ServerSentEvents, vedere qui per altri dettagli.

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

   2. Passare alla scheda Impostazioni e deselezionare Sottoscrizione necessaria per uno scopo demo rapido

Ora Gestione API è configurato correttamente per supportare il client SignalR con ServerSentEvents o LongPolling il trasporto.

Eseguire la chat

Il traffico può ora raggiungere Servizio SignalR attraverso Gestione API. Si userà questa applicazione di chat come esempio. Iniziamo con l'esecuzione in locale.

Le stringa di connessione non elaborate vengono visualizzate in questo articolo solo a scopo dimostrativo. Negli ambienti di produzione proteggere sempre le chiavi di accesso. Usare Azure Key Vault per gestire e ruotare le chiavi in modo sicuro e proteggere i stringa di connessione usando Microsoft Entra ID e autorizzare l'accesso con Microsoft Entra ID.

• Prima di tutto, ottenere il stringa di connessione di ASRS1

  • Nella scheda Stringhe di connessione di ASRS1
    • Endpoint client: immettere l'URL usando l'URL del gateway di GESTIONE API1, ad esempio https://apim1.azure-api.net. Si tratta di un generatore di stringa di connessione quando si usano proxy inversi e il valore non viene mantenuto quando si torna a questa scheda. Quando viene immesso un valore, il stringa di connessione aggiunge una ClientEndpoint sezione.
    • Copiare la stringa di connessione

• Clonare il repository GitHub https://github.com/aspnet/AzureSignalR-samples

• Passare alla cartella samples/Chatroom:

• Impostare il stringa di connessione copiato ed eseguire l'applicazione in locale, si noterà che è presente una ClientEndpoint sezione in ConnectionString.

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

• Configurare il tipo di trasporto per il client

  Aprire index.html nella cartella wwwroot e trovare il codice al momento connection della creazione, aggiornarlo per specificare il tipo di trasporto.

  Ad esempio, per specificare la connessione per usare eventi server-sent-o polling lungo, aggiornare il codice in:

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

  Per specificare la connessione per l'uso di WebSocket, aggiornare il codice in:

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

• Aprire http://localhost:5000 dal browser e usare F12 per visualizzare le tracce di rete, si noterà che la connessione viene stabilita tramite APIM1

Passaggi successivi

Ora è stata aggiunta la funzionalità in tempo reale al Gestione API usando Azure SignalR. Altre informazioni sulle Servizio SignalR.