Share via

Creación de una aplicación web que usa autenticación de SignalR Service y GitHub

  • Artículo

Este script de ejemplo crea un nuevo recurso de Azure SignalR Service, que se utiliza para insertar las actualizaciones de contenido en tiempo real en los clientes. Este script también agrega una nueva aplicación web y un nuevo plan de App Service para hospedar la aplicación web de ASP.NET que usa la instancia de SignalR Service. La aplicación web está configurada con la configuración de aplicación para conectarse al nuevo recurso de SignalR Service y se autentica con autenticación de GitHub. La aplicación web también está configurada para usar un origen de implementación de repositorio de Git local.

Si no tiene una suscripción a Azure, cree una cuenta gratuita de Azure antes de empezar.

Azure Cloud Shell

En Azure se hospeda Azure Cloud Shell, un entorno de shell interactivo que puede utilizar mediante el explorador. Puede usar Bash o PowerShell con Cloud Shell para trabajar con los servicios de Azure. Puede usar los comandos preinstalados de Cloud Shell para ejecutar el código de este artículo sin tener que instalar nada en su entorno local.

Para iniciar Azure Cloud Shell:

Opción Ejemplo o vínculo
Seleccione Pruébelo en la esquina superior derecha de un bloque de código o de comandos. Solo con seleccionar Pruébelo no se copia automáticamente el código o comando en Cloud Shell. Screenshot that shows an example of Try It for Azure Cloud Shell.
Vaya a https://shell.azure.com o seleccione el botón Iniciar Cloud Shell para abrir Cloud Shell en el explorador. Button to launch Azure Cloud Shell.
Seleccione el botón Cloud Shell en la barra de menús de la esquina superior derecha de Azure Portal. Screenshot that shows the Cloud Shell button in the Azure portal

Para usar Azure Cloud Shell:

  1. Inicie Cloud Shell.

  2. Seleccione el botón Copiar en un bloque de código (o bloque de comandos) para copiar el código o comando.

  3. Pegue el código o comando en la sesión de Cloud Shell. Para ello, seleccione Ctrl+Mayús+V en Windows y Linux, o bien seleccione Cmd+Mayús+V en macOS.

  4. Seleccione Entrar para ejecutar el código o comando.

Muestras de scripts

Inicio de Azure Cloud Shell

Azure Cloud Shell es un shell interactivo gratuito que puede usar para ejecutar los pasos de este artículo. Tiene las herramientas comunes de Azure preinstaladas y configuradas para usarlas en la cuenta.

Para abrir Cloud Shell, seleccione Pruébelo en la esquina superior derecha de un bloque de código. También puede ir a https://shell.azure.com para iniciar Cloud Shell en una pestaña independiente del explorador.

Cuando se abra Cloud Shell, compruebe que Bash está seleccionado para el entorno. En las sesiones siguientes se usará la CLI de Azure en un entorno de Bash, seleccione Copiar para copiar los bloques de código, péguelos en Cloud Shell y, luego, presione Entrar para ejecutarlos.

Inicio de sesión en Azure

Cloud Shell se autentica de forma automática en la cuenta inicial con la que ha iniciado sesión. Use el script siguiente para iniciar sesión con otra suscripción, y reemplace <Subscription ID> con el id. de la suscripción de Azure. Si no tiene una suscripción a Azure, cree una cuenta gratuita de Azure antes de empezar.

subscription="<subscriptionId>" # add subscription here

az account set -s $subscription # ...or use 'az login'

Para más información, vea Establecimiento de la suscripción activa o Inicio de sesión de forma interactiva

Creación de SignalR Service con de App Service

# Create a SignalR Service with an App Service

# Variable block
let "randomIdentifier=$RANDOM*$RANDOM"
location="East US"
resourceGroup="msdocs-azure-signalr-rg-$randomIdentifier"
tag="create-signal-service-with-app-service"
signalRSvc="msdocs-signalr-svc-$randomIdentifier"
webApp="msdocs-web-app-signalr-$randomIdentifier"
appSvcPlan="msdocs-app-svc-plan-$randomIdentifier"
signalRSku="Standard_S1"
unitCount="1"
serviceMode="Default"
planSku="Free"

# Create a resource group
echo "Creating $resourceGroup in "$location"..."
az group create --name $resourceGroup --location "$location" --tag $tag

# Create the Azure SignalR Service resource
echo "Creating $signalRSvc"
az signalr create \
  --name $signalRSvc \
  --resource-group $resourceGroup \
  --sku $signalRSku \
  --unit-count $unitCount \
  --service-mode $serviceMode

# Create an App Service plan.
echo "Creating $appSvcPlan"
az appservice plan create --name $appSvcPlan --resource-group $resourceGroup --sku $planSku

# Create the Web App
echo "Creating $webApp"
az webapp create --name $webApp --resource-group $resourceGroup --plan $appSvcPlan

# Get the SignalR primary connection string
primaryConnectionString=$(az signalr key list --name $signalRSvc \
  --resource-group $resourceGroup --query primaryConnectionString -o tsv)
echo $primaryConnectionString

# Add an app setting to the web app for the SignalR connection
az webapp config appsettings set --name $webApp --resource-group $resourceGroup \
  --settings "AzureSignalRConnectionString=$primaryConnectionString"

Habilitación de la autenticación de Github y la implementación de Git para la aplicación web

  1. Actualice los valores del siguiente script para el nombre de usuario de implementación deseado y su contraseña

    deploymentUser=<Replace with your desired username>
deploymentUserPassword=<Replace with your desired password>

  2. Actualice los valores del siguiente script en función del registro de aplicación de OAuth de GitHub.

    GitHubClientId=<Replace with your GitHub OAuth app Client ID>
GitHubClientSecret=<Replace with your GitHub OAuth app Client Secret>

  3. Añada la configuración de la aplicación para usarla con la autenticación de GitHub

    az webapp config appsettings set --name $webApp --resource-group $resourceGroup --settings "GitHubClientSecret=$GitHubClientSecret"

  4. Actualice de la aplicación web con el nombre de usuario y la contraseña de implementación deseados

    az webapp deployment user set --user-name $deploymentUser --password $deploymentUserPassword

  5. Configure la implementación de Git y devuelva la dirección URL de implementación.

    az webapp deployment source config-local-git --name $webAppName --resource-group $resourceGroupName --query [url] -o tsv

Limpieza de recursos

Use el comando siguiente para quitar el grupo de recursos y todos los recursos asociados con él mediante el comando az group delete, a menos que tenga una necesidad constante de estos recursos. Algunos de estos recursos pueden tardar un tiempo en crearse, así como en eliminarse.

az group delete --name $resourceGroup

Referencia de ejemplo

Cada comando de la tabla crea un vínculo a documentación específica del comando. Este script usa los siguientes comandos:

Get-Help Notas
az group create Crea un grupo de recursos en el que se almacenan todos los recursos.
az signalr create Crea un recurso de Azure SignalR Service.
az signalr key list Muestra las claves, que usará la aplicación al insertar actualizaciones de contenido en tiempo real con SignalR.
az appservice plan create Crea un plan de Azure App Service para hospedar aplicaciones web.
az webapp create Crea una aplicación web de Azure mediante el plan de hospedaje de App Service.
az webapp config appsettings set Agrega la nueva configuración de aplicación de la aplicación web. Esta configuración de aplicación se usa para almacenar la cadena de conexión de SignalR y los secretos de aplicación de GitHub OAuth.
az webapp deployment user set Actualiza las credenciales de implementación.
az webapp deployment source config-local-git Obtiene una dirección URL de un punto de conexión de repositorio de Git para clonarla e insertarla en una implementación de aplicación web.

Pasos siguientes

Para más información sobre la CLI de Azure, consulte la documentación de la CLI de Azure.

Se pueden encontrar ejemplos de scripts adicionales de la CLI de Azure SignalR Service en la documentación de Azure SignalR Service.