Share via

Usar Azure SignalR Service con Azure Application Gateway

  • Artículo

Application Gateway es un equilibrador de carga de tráfico web que permite administrar el tráfico a las aplicaciones web. El uso de Application Gateway con SignalR Service le permite hacer lo siguiente:

  • Proteger las aplicaciones frente a vulnerabilidades web comunes.
  • Obtener un equilibrio de carga de nivel de aplicación para las aplicaciones escalables y de alta disponibilidad.
  • Configurar la seguridad de un extremo a otro.
  • Personalizar el nombre de dominio.

Este artículo contiene dos secciones:

  • En la primera parte se muestra cómo configurar Application Gateway para que los clientes puedan acceder a SignalR mediante Application Gateway.
  • En la segunda parte se muestra cómo proteger SignalR Service agregando un control de acceso a SignalR Service y permitir solo el tráfico que procede de Application Gateway.

Diagrama que muestra la arquitectura del uso de SignalR Service con Application Gateway.

Instalación y configuración Application Gateway

Creación de una instancia de SignalR Service

  • Siga el artículo y cree una instancia de SignalR Service ASRS1.

Creación de una instancia de Application Gateway

Cree una instancia de Application Gateway AG1 desde el portal:

  • En Azure Portal, busque Application Gateway y seleccione Crear.

  • En la pestaña Aspectos básicos, use estos valores para la siguiente configuración de puerta de enlace de aplicación:

    • Suscripción y Grupo de recursos y Región: igual que lo que elija para SignalR Service

    • Nombre de la puerta de enlace de aplicación: AG1

    • Red virtual, seleccione Crear nuevo y, en la ventana Crear red virtual que se abre, escriba los valores siguientes para crear la red virtual y dos subredes, una para la puerta de enlace de aplicación y otra para los servidores back-end.

      • Nombre: escriba VN1 como nombre de la red virtual.

      • Subredes: actualice la cuadrícula Subredes con subredes por debajo de 2.

        Nombre de subred Intervalo de direcciones Nota:
        myAGSubnet (intervalo de direcciones) Subred de la puerta de enlace de aplicación. La subred de la puerta de enlace de aplicaciones solo puede contener puertas de enlace de aplicaciones. No se permite ningún otro recurso.
        myBackendSubnet (otro intervalo de direcciones) Subred de la instancia de Azure SignalR.

    • Acepte los valores predeterminados para las demás opciones y seleccione Siguiente: Front-end.

    Captura de pantalla de creación de una instancia de Application Gateway con la pestaña Aspectos básicos.

  • En la pestaña Front-end:

    • Tipo de dirección IP de front-end: Público.
    • En Dirección IP pública, seleccione Agregar nueva y escriba myAGPublicIPAddress como nombre de la dirección IP pública y, luego, elija Aceptar.
    • Seleccione Siguiente: back-endCaptura de pantalla de la creación de una instancia de Application Gateway con la pestaña Frontends.

  • En la pestaña Back-end, seleccione Agregar un grupo de back-end.

    • Nombre: escriba signalr para el grupo de back-end de recursos de SignalR Service.
    • Destinos de back-end Destino: nombre de host de la instancia de SignalR Service ASRS1, por ejemplo asrs1.service.signalr.net.
    • Seleccione Siguiente: Configuración.

    Captura de pantalla de configuración del grupo de back-end de la puerta de enlace de aplicación para SignalR Service.

  • En la pestaña Configuración, seleccione Agregar una regla de enrutamiento en la columna Reglas de enrutamiento:

    • Nombre de la regla: myRoutingRule

    • Prioridad: 1

    • En la pestaña Cliente de escucha de la ventana Agregar una regla de enrutamiento, escriba los valores siguientes para el cliente de escucha:

      • Nombre del cliente de escucha: Escriba myListener para el nombre del cliente de escucha.
      • Dirección IP de front-end: Seleccione Pública para elegir la dirección IP pública que ha creado para el front-end.
      • Protocolo: HTTP
        • En este artículo se usa el protocolo de front-end HTTP en Application Gateway para simplificar la demostración y ayudarle a empezar más fácilmente. Pero en realidad, es posible que tenga que habilitar HTTPS y el dominio del cliente en él en un escenario de producción.
      • Acepte los valores predeterminados para la otra configuración de la pestaña ListenerCaptura de pantalla de configuración del grupo de back-end de la puerta de enlace de aplicación para SignalR Service.

    • En la pestaña Destinos de back-end, use los siguientes valores:

      • Tipo de destino: grupo de back-end

      • Destino de back-end: seleccione signalr, que hemos creado anteriormente.

      • Configuración de back-end: seleccione Agregar nuevo para agregar una nueva configuración.

        • Nombre de la configuración de back-end: mySetting
        • Protocolo de back-end: HTTPS
        • Usar certificado de entidad de certificación reconocida: Sí
        • Reemplazar por un nuevo nombre de host: Sí
        • Reemplazo del nombre de host: Seleccionar el nombre de host del destino de back-end.
        • Las demás mantienen los valores predeterminados.

        Captura de pantalla de configuración del valor de back-end de la puerta de enlace de aplicación para SignalR Service.

      Captura de pantalla de creación de destinos de back-end para la puerta de enlace de aplicación.

  • Revise la configuración y cree la instancia AG1Captura de pantalla de revisión y creación de la instancia de la puerta de enlace de aplicación..

Configuración del sondeo de estado de Application Gateway

Cuando se cree AG1, vaya a la pestaña Sondeos de estado en la sección Configuración del portal y cambie la ruta del sondeo de estado a /api/health.

Captura de pantalla de configuración del sondeo de estado del back-end de la puerta de enlace de aplicación para SignalR Service.

Prueba rápida

  • Pruebe con una solicitud de cliente no válida https://asrs1.service.signalr.net/client; se devuelve 400 con el mensaje de error se requiere el parámetro de consulta "hub". Esto significa que la solicitud llegó a SignalR Service y que se ha validado.

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

    returns

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

  • Vaya a la pestaña Información general de AG1 y averigüe la dirección IP pública de front-end.

    Captura de pantalla de prueba rápida del punto de conexión de estado de SignalR Service mediante Application Gateway.

  • Visite el punto de conexión de estado mediante AG1http://<frontend-public-IP-address>/client; también se devuelve 400 con el mensaje de error se requiere el parámetro de consulta "hub". Esto significa que la solicitud pasó por Application Gateway en su camino hasta SignalR Service y que se ha validado.

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

    returns

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

Ejecución del chat mediante Application Gateway

Ahora, el tráfico puede llegar a SignalR Service mediante Application Gateway. El cliente podría usar la dirección IP pública de Application Gateway o un nombre de dominio personalizado para acceder al recurso. Vamos a usar esta aplicación de chat como ejemplo. Empecemos por ejecutarla localmente.

  • En primer lugar, vamos a obtener la cadena de conexión de ASRS1.

    • En la pestaña Cadenas de conexión de ASRS1
      • Punto de conexión de cliente: escriba la dirección URL mediante la dirección IP pública de front-end de AG1, por ejemplo http://20.88.8.8. Es un generador de cadenas de conexión cuando se usan servidores proxy inversos y el valor no se conserva la próxima vez que vuelva a esta pestaña. Cuando se especifica el valor, la cadena de conexión anexa una sección ClientEndpoint.
      • Copia de la cadena de conexión Captura de pantalla de cómo se obtiene la cadena de conexión para SignalR Service con el punto de conexión de cliente.

  • Clone el repositorio de GitHub https://github.com/aspnet/AzureSignalR-samples.

  • Vaya a la carpeta samples/Chatroom:

  • Establezca la cadena de conexión copiada y ejecute la aplicación localmente; puede ver que hay una sección ClientEndpoint en ConnectionString.

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

  • Abra http://localhost:5000 desde el explorador y use F12 para ver los seguimientos de red; puede ver que la conexión de WebSocket se establece mediante AG1.

    Captura de pantalla de ejecución de la aplicación de chat localmente con App Gateway y SignalR Service.

Protección de SignalR Service

En la sección anterior, hemos configurado correctamente SignalR Service como servicio back-end de Application Gateway; ahora podemos llamar a SignalR Service directamente desde la red pública o mediante Application Gateway.

En esta sección, vamos a configurar SignalR Service para denegar todo el tráfico de la red pública y aceptar solo el tráfico de Application Gateway.

Configuración de SignalR Service

Vamos a configurar SignalR Service solo para permitir el acceso privado. Puede encontrar más información en Uso del punto de conexión privado para SignalR Service.

  • Vaya a la instancia de SignalR Service ASRS1 en el portal.

  • Vaya a la pestaña Redes:

    • En la pestaña Acceso público: cambie Acceso a la red pública a Deshabilitado y haga clic en Guardar. Ahora ya no podrá acceder a SignalR Service desde la red pública.

      Captura de pantalla de deshabilitación del acceso público a SignalR Service.

    • En la pestaña Acceso privado, seleccione + Punto de acceso privado:

      • En la pestaña Aspectos básicos:
        • Nombre: PE1.
        • Nombre de la interfaz de red: PE1-nic.
        • Región: asegúrese de elegir la misma región que la de Application Gateway.
        • Seleccione Siguiente: Recursos.
      • En la pestaña Recursos:
        • Mantenga los valores predeterminados.
        • Seleccione Siguiente: Red virtual.
      • En la pestaña Red virtual:
        • Red virtual: seleccione VN1, que se creó anteriormente.
        • Subred: seleccione VN1/myBackendSubnet, que se creó anteriormente.
        • Las demás opciones mantienen la configuración predeterminada.
        • Seleccione Next: DNS (Siguiente: DNS)
      • En la pestaña DNS:
        • Integración con zona DNS privada: Sí
      • Revise la configuración y cree el punto de conexión privado.

    Captura de pantalla de configuración del recurso de punto de conexión privado para SignalR Service.

Actualización del grupo de back-end de Application Gateway

Dado que Application Gateway se configuró antes de que hubiera un punto de conexión privado para usar, es necesario actualizar el grupo de back-end para que examine la zona DNS privada y descubra que debe enrutar el tráfico al punto de conexión privado en lugar de la dirección pública. Para realizar la actualización, establezca el FQDN de back-end en otro valor y, luego, vuelva a cambiarlo.

Vaya a la pestaña Grupos de back-end de AG1 y seleccione signalr:

  • Paso 1: Cambie el valor de asrs1.service.signalr.net de destino por otro valor, por ejemplo, x.service.signalr.net y seleccione Guardar.
  • Paso 2: Vuelva a cambiar el destino a asrs1.service.signalr.net.

Prueba rápida

  • Ahora vamos a visitar https://asrs1.service.signalr.net/client de nuevo. Con el acceso público deshabilitado, se devuelve 403 en su lugar.

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

    returns

    < HTTP/1.1 403 Forbidden

  • Visite el punto de conexión mediante AG1http://<frontend-public-IP-address>/client; se devuelve 400 con el mensaje de error se requiere el parámetro de consulta "hub". Significa que la solicitud ha pasado por Application Gateway en su camino hacia SignalR Service.

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

    returns

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

Ahora, si vuelve a ejecutar la aplicación Chat localmente, verá los mensajes de error Failed to connect to .... The server returned status code '403' when status code '101' was expected.. Esto se debe a que el acceso público está deshabilitado para que las conexiones del servidor localhost que son más largas puedan conectarse a SignalR Service.

Vamos a implementar la aplicación Chat en la misma red virtual con ASRS1 para que el chat pueda hablar con ASRS1.

Implementación de la aplicación de chat en Azure

  • En Azure Portal, busque Servicios de aplicaciones y Crear una Aplicación web.

  • En la pestaña Aspectos básicos, use estos valores para la siguiente configuración de la aplicación web:

    • Suscripción y Grupo de recursos y Región: igual que lo que elija para SignalR Service
    • Nombre: WA1.
    • Publicar: Código.
    • Pila en tiempo de ejecución: .NET 6 (LTS).
    • Sistema operativo: Linux.
    • Región: asegúrese de que sea la misma que la que elija para SignalR Service.
    • Seleccione Siguiente Implementación, mantenga todo como predeterminado y seleccione Siguiente:Redes

  • En la pestaña Redes:

    • Habilitar la inserción de red: seleccione Activado.
    • Red virtual: seleccione VN1, que se ha creado anteriormente.
    • Habilitar la integración con la red virtual: Activado.
    • Subred de salida: cree una nueva subred.
    • Seleccionar Revisar y crear.

Ahora vamos a implementar nuestra aplicación de chat en Azure. Below

Usamos la CLI de Azure para implementar nuestra aplicación de chat en Azure. Consulte Inicio rápido: Implementación de una aplicación web de ASP.NET para otros entornos de implementación que se implementan en Azure.

En la carpeta samples/Chatroom, ejecute los siguientes comandos:

# 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

Ahora se implementa la aplicación web; vamos a WA1 en el portal y realizamos las siguientes actualizaciones:

  • En la pestaña Configuración:

    • Nueva configuración de la aplicación:

      NOMBRE Valor
      WEBSITE_DNS_SERVER 168.63.129.16
      WEBSITE_VNET_ROUTE_ALL 1

    • Nueva cadena de conexión:

      NOMBRE Value Tipo
      AzureSignalRConnectionString Cadena de conexión copiada con el valor ClientEndpoint Seleccione Personalizado.

    Captura de pantalla de configuración de la cadena de conexión de la aplicación web.

  • En la pestaña Configuración de TLS/SSL:

    • Solo HTTPS: Desactivado. Para simplificar la demostración, usamos el protocolo de front-end HTTP en Application Gateway. Por lo tanto, es necesario desactivar esta opción para evitar cambiar la dirección URL HTTP a HTTPS automáticamente.

  • Vaya a la pestaña Información general y obtenga la dirección URL de WA1.

  • Obtenga la dirección URL y reemplace el esquema HTTPS por HTTP, por ejemplo, http://wa1.azurewebsites.net, abra la dirección URL en el explorador, y ya puede empezar a chatear. Use F12 para abrir seguimientos de red; puede ver que la conexión de SignalR se establece a través de AG1.

    Nota:

    En ocasiones debe deshabilitar la redirección automática de HTTPS del explorador y la caché del explorador para evitar que la dirección URL se redirija automáticamente a HTTPS.

    Captura de pantalla de ejecución de la aplicación de chat en Azure con App Gateway y SignalR Service.

Pasos siguientes

Ahora, ha creado correctamente una aplicación de chat en tiempo real con SignalR Service y ha usado Application Gateway para proteger las aplicaciones y configurar la seguridad de un extremo a otro. Más información sobre SignalR Service.