Inicio rápido: Creación de una aplicación ASP.NET Core con Azure App Configuration

En este inicio rápido usará Azure App Configuration para externalizar el almacenamiento y la administración de la configuración de la aplicación de una aplicación de ASP.NET Core. ASP.NET Core genera un solo objeto de configuración basado en un par clave-valor mediante el uso de la configuración de uno o varios proveedores de configuración. App Configuration ofrece una biblioteca de proveedores de configuración de .NET. Por lo tanto, puede usar App Configuration como origen de configuración adicional para la aplicación. Si tiene una aplicación existente, para empezar a usar App Configuration, solo necesitará algunos pequeños cambios en el código de inicio de la aplicación.

Requisitos previos

Sugerencia

Azure Cloud Shell es un shell interactivo gratuito que se puede usar para ejecutar las instrucciones de línea de comandos en este artículo. Tiene herramientas comunes de Azure preinstaladas, lo que incluye el SDK de .NET. Si ha iniciado sesión en su suscripción de Azure, inicie Azure Cloud Shell desde shell.azure.com. Para más información sobre Azure Cloud Shell, lea la documentación.

Agregar pares clave-valor

Agregue los siguientes pares clave-valor al almacén de App Configuration y deje Etiqueta y Tipo de contenido con sus valores predeterminados. Para obtener más información sobre cómo agregar pares clave-valor a un almacén mediante Azure Portal o la CLI, vaya a Creación de un valor de clave.

Clave Value
TestApp:Settings:BackgroundColor blanco
TestApp:Settings:FontColor negro
TestApp:Settings:FontSize 24
TestApp:Settings:Message Datos de Azure App Configuration

Cree una aplicación web ASP.NET Core

Utilice la interfaz de la línea de comandos (CLI) de .NET para crear un proyecto de aplicación web de ASP.NET Core. Azure Cloud Shell proporciona estas herramientas. También están disponibles en las plataformas Windows, macOS y Linux.

Ejecute el siguiente comando para crear una aplicación web de ASP.NET Core en una nueva carpeta TestAppConfig:

dotnet new webapp --output TestAppConfig --framework net6.0

Conexión al almacén de App Configuration

  1. Vaya al directorio del proyecto TestAppConfig y ejecute el siguiente comando para agregar una referencia de paquete NuGet Microsoft.Azure.AppConfiguration.AspNetCore:

    dotnet add package Microsoft.Azure.AppConfiguration.AspNetCore
    
  2. Ejecute el comando siguiente: El comando usa el administrador de secretos para almacenar un secreto denominado ConnectionStrings:AppConfig, que almacena la cadena de conexión para el almacén de App Configuration. Reemplace el marcador de posición <your_connection_string> por la cadena de conexión del almacén de App Configuration. Puede encontrar la cadena de conexión en Claves de acceso del almacén de App Configuration en Azure Portal.

    dotnet user-secrets init
    dotnet user-secrets set ConnectionStrings:AppConfig "<your_connection_string>"
    

    Sugerencia

    Algunos shells truncarán la cadena de conexión, salvo que esté entre comillas. Asegúrese de que la salida del comando dotnet user-secrets list muestra toda la cadena de conexión. Si no lo hace, vuelva a ejecutar el comando y escriba la cadena de conexión entre comillas.

    El administrador de secretos almacena el secreto fuera del árbol del proyecto, lo que ayuda a evitar el uso compartido accidental de secretos en el código fuente. Solo se utiliza para probar la aplicación web localmente. Cuando la aplicación se implementa en Azure como App Service, use las cadenas de conexión, la configuración de la aplicación o las variables de entorno para almacenar la cadena de conexión. Alternativamente, para evitar las cadenas de conexión, puede conectarse a App Configuration utilizando identidades administradas o sus otras identidades de Microsoft Entra.

  3. Abra Program.cs y agregue Azure App Configuration como origen de configuración adicional mediante una llamada al método AddAzureAppConfiguration.

    var builder = WebApplication.CreateBuilder(args);
    
    // Retrieve the connection string
    string connectionString = builder.Configuration.GetConnectionString("AppConfig");
    
    // Load configuration from Azure App Configuration
    builder.Configuration.AddAzureAppConfiguration(connectionString);
    
    // The rest of existing code in program.cs
    // ... ...
    

    Este código se conectará al almacén de App Configuration mediante una cadena de conexión y cargará todos los valores de clave que no tengan etiquetas. Para obtener más información sobre el proveedor de App Configuration, consulte la referencia de API del proveedor de App Configuration.

Lectura desde el almacén de App Configuration

En este ejemplo, actualizará una página web para mostrar su contenido mediante los ajustes que configuró en el almacén de App Configuration.

  1. Agregue un archivo Settings.cs en la raíz del directorio del proyecto. Define una clase Settings fuertemente tipada para la configuración que va a usar. Reemplace el espacio de nombres por el nombre del proyecto.

    namespace TestAppConfig
    {
        public class Settings
        {
            public string BackgroundColor { get; set; }
            public long FontSize { get; set; }
            public string FontColor { get; set; }
            public string Message { get; set; }
        }
    }
    
  2. Enlace la sección TestApp:Settings de la configuración al objeto Settings.

    Actualice Program.cs con el código siguiente y agregue el espacio de nombres TestAppConfig al principio del archivo.

    using TestAppConfig;
    
    // Existing code in Program.cs
    // ... ...
    
    builder.Services.AddRazorPages();
    
    // Bind configuration "TestApp:Settings" section to the Settings object
    builder.Services.Configure<Settings>(builder.Configuration.GetSection("TestApp:Settings"));
    
    var app = builder.Build();
    
    // The rest of existing code in program.cs
    // ... ...
    
  3. Abra Index.cshtml.cs en el directorio Pages y actualice la clase IndexModel con el código siguiente. Agregue el espacio de nombres using Microsoft.Extensions.Options al principio del archivo si aún no está ahí.

    public class IndexModel : PageModel
    {
        private readonly ILogger<IndexModel> _logger;
    
        public Settings Settings { get; }
    
        public IndexModel(IOptionsSnapshot<Settings> options, ILogger<IndexModel> logger)
        {
            Settings = options.Value;
            _logger = logger;
        }
    }
    
  4. Abra Index.cshtml en el directorio Pages y actualice el contenido con el código siguiente.

    @page
    @model IndexModel
    @{
        ViewData["Title"] = "Home page";
    }
    
    <style>
        body {
            background-color: @Model.Settings.BackgroundColor;
        }
    
        h1 {
            color: @Model.Settings.FontColor;
            font-size: @(Model.Settings.FontSize)px;
        }
    </style>
    
    <h1>@Model.Settings.Message</h1>
    

Compilación y ejecución de la aplicación en un entorno local

  1. Para compilar la aplicación mediante la CLI de .NET, desplácese hasta el directorio raíz del proyecto. Ejecute el comando siguiente en el shell de comandos:

    dotnet build
    
  2. Una vez que la compilación se haya realizado correctamente, ejecute el siguiente comando para ejecutar la aplicación web localmente:

    dotnet run
    
  3. La salida del comando dotnet run contiene dos direcciones URL. Abra un explorador y vaya a cualquiera de estas direcciones URL para acceder a la aplicación. Por ejemplo: https://localhost:5001.

    Si trabajando en Azure Cloud Shell, seleccione el botón Vista previa web y después Configurar. Cuando se le pida que configure el puerto para la versión preliminar, escriba 5000 y seleccione Abrir y examinar.

    Screenshot of Azure Cloud Shell. Locate Web Preview.

    La página web tiene el siguiente aspecto: Screenshot of the browser.Launching quickstart app locally.

Limpieza de recursos

Si no quiere seguir usando los recursos que se han creado en este artículo, elimine el grupo de recursos que creó aquí para evitar cargos.

Importante

La eliminación de un grupo de recursos es irreversible. El grupo de recursos y todos los recursos que contiene se eliminan permanentemente. Asegúrese de que no elimina por accidente el grupo de recursos o los recursos equivocados. Si creó los recursos para este artículo en un grupo de recursos que contenga los recursos que desee conservar, elimine cada recurso de forma individual desde su panel respectivo, en lugar de eliminar el grupo de recursos.

  1. Inicie sesión en Azure Portal y después seleccione Grupos de recursos.
  2. En el cuadro de texto Filtrar por nombre, escriba el nombre del grupo de recursos.
  3. En la lista resultados, seleccione el nombre del grupo de recursos para ver la información general.
  4. Seleccione Eliminar grupo de recursos.
  5. Se le pedirá que confirme la eliminación del grupo de recursos. Escriba el nombre del grupo de recursos para confirmar y seleccione Eliminar.

Transcurridos unos instantes, el grupo de recursos y todos sus recursos se eliminan.

Pasos siguientes

En esta guía de inicio rápido:

  • Ha aprovisionado un nuevo almacén de App Configuration.
  • Conectado al almacén de App Configuration mediante la biblioteca de proveedores de App Configuration.
  • Lea los valores de clave del almacén de App Configuration con la biblioteca de proveedores de configuración.
  • Muestra una página web con los ajustes que configuró en el almacén de App Configuration.

Para aprender a configurar una aplicación de ASP.NET Core para actualizar dinámicamente la configuración, vaya al siguiente tutorial.