Inicio rápido: Creación de una aplicación web ASP.NET Core en Azure

En esta guía de inicio rápido, aprenderá a crear e implementar su primera aplicación web de ASP.NET Core en Azure App Service. App Service es compatible con aplicaciones de .NET 5.0.

Cuando haya terminado, tendrá un resource groupde Azure, que consta de un Plan de App Service y una Aplicación de App Service con una aplicación de ASP.NET Core implementada.


1. Preparación del entorno

¿Ya tiene Visual Studio 2019? Si ya ha instalado Visual Studio 2019:
  • Instale las actualizaciones más recientes de Visual Studio. Para ello, seleccione Ayuda > Buscar actualizaciones. Las actualizaciones más recientes contienen el SDK de .NET 5.0.
  • Agregue la carga de trabajo. Para ello, seleccione Herramientas > Obtener herramientas y características.

2. Cree una aplicación web ASP.NET Core

  1. Abra Visual Studio y seleccione Crear un proyecto.

  2. En Crear un nuevo proyecto, seleccione Aplicación web ASP.NET Core y confirme que C# aparece en los lenguajes de esa opción y, a continuación, seleccione Siguiente.

  3. En Configure su nuevo proyecto, asigne al proyecto de aplicación web el nombre miPrimeraAzureWebApp y luego seleccione Crear.

    Configuración del proyecto de aplicación web

  4. Para una aplicación de .NET 5.0, seleccione ASP.NET Core 5.0 en el menú desplegable. De lo contrario, use el valor predeterminado.

  5. Puede implementar cualquier tipo de aplicación web de ASP.NET Core en Azure pero, para este inicio rápido, elija la plantilla de Aplicación web de ASP.NET Core. Asegúrese de que Autenticación esté establecido en Sin autenticación y que no hay ninguna otra opción seleccionada. Seleccione Crear.

    Creación de una nueva aplicación web de ASP.NET Core

  6. En el menú de Visual Studio, seleccione Depurar > Iniciar sin depurar para ejecutar la aplicación web localmente.

    Aplicación web que se ejecuta localmente


3. Publicación de la aplicación web

  1. En Explorador de soluciones, haga clic con el botón derecho en el proyecto myFirstAzureWebApp y seleccione Publicar.

  2. En Publicar, seleccione Azure y haga clic en Siguiente.

  3. Las opciones dependen de si ya ha iniciado sesión en Azure y de si tiene una cuenta de Visual Studio vinculada a una cuenta de Azure. Seleccione Agregar una cuenta o Iniciar sesión para iniciar sesión en la suscripción de Azure. Si ya ha iniciado sesión, seleccione la cuenta que desee.

    Inicio de sesión en Azure

  4. A la derecha de App Service instances (Instancias de App Service), haga clic en + .

    Nueva aplicación de App Service

  5. En Suscripción, acepte la suscripción que aparece o seleccione otra en la lista desplegable.

  6. En Grupo de recursos, seleccione Nuevo. En Nuevo nombre de grupo de recursos, escriba myResourceGroup y seleccione Aceptar.

  7. En Plan de hospedaje, seleccione Nuevo.

  8. En el cuadro de diálogo Plan de hospedaje: Crear nuevo, escriba los valores especificados en la tabla siguiente:

    Configuración Valor sugerido
    Plan de hospedaje miPrimerPlanDeAzureWebApp
    Ubicación Oeste de Europa
    Tamaño Gratis

    Creación de un nuevo plan de hospedaje

  9. En Nombre, escriba un nombre de aplicación único.

    ¿Qué caracteres se pueden usar? Los caracteres válidos son a-z, A-Z, 0-9 y -. Puede aceptar el nombre único generado automáticamente. La dirección URL de la aplicación web es http://<app-name>.azurewebsites.net, donde <app-name> es el nombre de la aplicación.
  10. Seleccione Crear para crear los recursos de Azure.

    Creación de recursos de aplicación

  11. Espere a que el asistente termine de crear los recursos de Azure. Seleccione Finalizar para cerrar el asistente.

  12. En la página Publicar, haga clic en Publicar para implementar el proyecto.

    ¿Qué hace Visual Studio? Visual Studio compila, empaqueta y publica la aplicación en Azure y, luego, la inicia en el explorador predeterminado.

    Aplicación web de ASP.NET publicada en ejecución en Azure


4. Actualización de la aplicación y nueva implementación

  1. En Explorador de soluciones, en el proyecto, abra Pages > Index.cshtml.

  2. Reemplace la etiqueta <div> entera por el siguiente código:

    <div class="jumbotron">
        <h1>ASP.NET in Azure!</h1>
        <p class="lead">This is a simple app that we've built that demonstrates how to deploy a .NET app to Azure App Service.</p>
    </div>
    
  3. Para volver a implementar en Azure, haga clic con el botón derecho en el proyecto myFirstAzureWebApp, en el Explorador de soluciones y seleccione Publicar.

  4. En la página de resumen Publicar, seleccione Publicar.

    Cuando se completa la publicación, Visual Studio inicia un explorador en la dirección URL de la aplicación web.

    Aplicación web actualizada de ASP.NET en Azure


5. Administración de la aplicación de Azure

  1. Vaya a Azure Portal y busque y seleccione App Services.

    Selección de App Services

  2. En la página App Services, seleccione el nombre de la aplicación web.

    Captura de pantalla de la página de App Services con una aplicación web de ejemplo seleccionada.

  3. La página Información general de la aplicación web contiene opciones para la administración básica como examinar, detener, iniciar, reiniciar y eliminar. El menú izquierdo proporciona varias páginas para configurar la aplicación.

    App Service en Azure Portal


6. Limpieza de recursos

  1. En el menú de Azure Portal o la página Inicio, seleccione Grupos de recursos. En la página Grupos de recursos, seleccione myResourceGroup.

  2. En la página myResourceGroup, asegúrese de que los recursos enumerados sean los que desea eliminar.

  3. Seleccione Eliminar grupo de recursos, escriba myResourceGroup en el cuadro de texto para confirmar y, después, seleccione Eliminar.


Pasos siguientes

Pase al siguiente artículo para aprender a crear una aplicación de .NET Core y conectarla a una instancia de SQL Database:

En esta guía de inicio rápido se muestra cómo crear una aplicación de .NET Core en App Service en Linux. Creará la aplicación web con la CLI de Azure y usará Git para implementar el código de .NET Core en la aplicación.


1. Preparación del entorno

¿Tiene problemas? Háganoslo saber.


2. Creación de la aplicación localmente

  1. Ejecute mkdir hellodotnetcore para crear el directorio.

    mkdir hellodotnetcore
    
  2. Ejecute cd hellodotnetcore para cambiar al directorio.

    cd hellodotnetcore
    
  3. Ejecute dotnet new web para crear una nueva aplicación de .NET Core.

    dotnet new web
    

3. Ejecución de la aplicación de forma local

  1. Ejecute dotnet run para ver su aspecto cuando la implemente en Azure.

    dotnet run
    
  2. Abra un explorador web y vaya a la aplicación en http://localhost:5000.

Prueba con un explorador

¿Tiene problemas? Háganoslo saber.


4. Inicio de sesión en Azure

Ejecute az login para iniciar sesión en Azure.

az login

¿Tiene problemas? Háganoslo saber.


5. Implementar la aplicación

  1. Ejecute az webapp up en la carpeta local. Reemplace <app-name> por un nombre único global.

    az webapp up --sku F1 --name <app-name> --os-type linux
    
    Solución de problemas
    • Si no se reconoce el comando az, asegúrese de tener instalada la CLI de Azure, tal y como se describe en Preparación del entorno inicial.
    • Reemplace <app-name> por un nombre que sea único en todo Azure (los caracteres válidos son a-z, 0-9 y -). Un buen patrón es usar una combinación del nombre de la empresa y un identificador de la aplicación.
    • El argumento --sku F1 crea la aplicación web en el plan de tarifa Gratuito. Omita este argumento para usar un nivel Premium más rápido, lo que supondrá un costo por hora.
    • Opcionalmente, incluya el argumento --location <location-name>, donde <location-name> es una región de Azure disponible. Puede recuperar una lista de las regiones permitidas para su cuenta de Azure mediante la ejecución del comando az account list-locations.
  2. Espere hasta que finalice el comando. Puede tardar algunos minutos y termina con el mensaje "Puede iniciar la aplicación en http://<app-name>.azurewebsites.net".

    ¿Qué hace az webapp up?

    El comando az webapp up realiza las acciones siguientes:

    • Crear un grupo de recursos predeterminado.
    • Crear un plan de App Service predeterminado.
    • Cree una aplicación de App Service con el nombre especificado.
    • Implementar con ZIP archivos desde el directorio de trabajo actual a la aplicación.
    • Mientras se ejecuta, proporciona mensajes sobre la creación de recursos, el registro y la implementación con zip.

¿Tiene problemas? Háganoslo saber.


6. Navegación hasta la aplicación

Vaya a la aplicación implementada mediante el explorador web.

http://<app_name>.azurewebsites.net

Aplicación de ejemplo que se ejecuta en Azure

¿Tiene problemas? Háganoslo saber.


7. Actualización del código y nueva implementación

  1. Abra el archivo Startup.cs en el directorio local.

  2. Realice un pequeño cambio en el texto en la llamada al método context.Response.WriteAsync.

    await context.Response.WriteAsync("Hello Azure!");
    
  3. Guarde los cambios.

  4. Ejecute az webapp up para volver a implementar:

    az webapp up --os-type linux
    
    ¿Qué hace ahora az webapp up? La primera vez que ejecutó el comando, este guardó el nombre de la aplicación, el grupo de recursos y el plan de App Service en el archivo .azure/config de la raíz del proyecto. Cuando se vuelve a ejecutar desde la raíz del proyecto, usa los valores guardados en .azure/config, detecta que los recursos de App Service ya existen y realiza la implementación con zip de nuevo.
  5. Una vez finalizada la implementación, pulse actualizar en la ventana del explorador que abrió anteriormente.

    Aplicación de ejemplo actualizada que se ejecuta en Azure

¿Tiene problemas? Háganoslo saber.


8. Administración de la nueva aplicación de Azure

  1. Vaya a Azure Portal.

  2. En el menú izquierdo, haga clic en App Services y, luego, en el nombre de la aplicación de Azure.

    Captura de pantalla de la página de App Services en la que se muestra una aplicación de ejemplo de Azure seleccionada.

  3. Desde la página de información general puede realizar tareas de administración básicas como examinar, detener, iniciar, reiniciar y eliminar. El menú izquierdo proporciona distintas páginas para configurar la aplicación.

    Página de App Service en Azure Portal


9. Limpieza de recursos

Ejecute az group delete --name myResourceGroup para eliminar el grupo de recursos.

az group delete --name myResourceGroup

¿Tiene problemas? Háganoslo saber.


Pasos siguientes