Ejercicio: almacenamiento en caché de datos en Redis

10 minutos

En este ejercicio, agregará almacenamiento en caché a la aplicación nativa de nube parcialmente completada para el distribuidor de equipos al aire libre. Agregará Redis al proyecto AppHost y, a continuación, implementará el almacenamiento en caché de salida en el proyecto WebApp y el almacenamiento en caché distribuido en el proyecto Catalog.API.

Requisitos previos de instalación

Los requisitos previos para .NET Aspire son:

.NET 8
Visual Studio 2022 Preview
Docker Desktop
Carga de trabajo de .NET Aspire en Visual Studio

Si ya tiene instalados estos paquetes, puede ir directamente para empezar a trabajar con una caché de Redis.

Instalación de .NET 8

Siga este vínculo de .NET 8 y seleccione el instalador correcto para el sistema operativo. Por ejemplo, si usa Windows 11 y un procesador moderno, seleccione el SDK de .NET 8 para Windows x64.

Una vez completada la descarga, ejecute el instalador y siga las instrucciones. En una ventana de terminal, ejecute el siguiente comando para comprobar que la instalación se realizó correctamente:

dotnet --version

Debería ver el número de versión del SDK de .NET que instaló. Por ejemplo:

8.0.300-preview.24203.14

Instalación de Visual Studio 2022 Preview

Siga este vínculo de Visual Studio 2022 Preview y seleccione Descargar versión preliminar. Una vez completada la descarga, ejecute el instalador y siga las instrucciones.

Instalar Docker Desktop

Siga este vínculo de Docker Desktop y seleccione el instalador correcto para el sistema operativo. Una vez completada la descarga, ejecute el instalador y siga las instrucciones. Para obtener el mejor rendimiento y compatibilidad, use el back-end WSL 2.

Abra la aplicación Docker Desktop y acepte el contrato de servicio.

Instalación de la carga de trabajo de .NET Aspire en Visual Studio

Instale la carga de trabajo de .NET Aspire mediante la CLI de NET:

Abra un terminal.

Actualice las cargas de trabajo de .NET con este comando:

dotnet workload update

Debería ver un mensaje que indica que las cargas de trabajo se actualizaron correctamente.

No workloads installed for this feature band. To update workloads installed with earlier SDK versions, include the --from-previous-sdk option.
Updated advertising manifest microsoft.net.sdk.ios.
Updated advertising manifest microsoft.net.workload.mono.toolchain.net6.
Updated advertising manifest microsoft.net.sdk.android.
Updated advertising manifest microsoft.net.workload.emscripten.net7.
Updated advertising manifest microsoft.net.workload.emscripten.net6.
Updated advertising manifest microsoft.net.sdk.macos.
Updated advertising manifest microsoft.net.workload.emscripten.current.
Updated advertising manifest microsoft.net.workload.mono.toolchain.current.
Updated advertising manifest microsoft.net.sdk.maui.
Updated advertising manifest microsoft.net.workload.mono.toolchain.net7.
Updated advertising manifest microsoft.net.sdk.maccatalyst.
Updated advertising manifest microsoft.net.sdk.tvos.
Updated advertising manifest microsoft.net.sdk.aspire.
No workloads installed for this feature band. To update workloads installed with earlier SDK versions, include the --from-previous-sdk option.

Successfully updated workload(s): .

Instale la carga de trabajo de .NET Aspire con este comando:

dotnet workload install aspire

Debería ver un mensaje que indica que se ha instalado la carga de trabajo de Aspire.

Installing Aspire.Hosting.Sdk.Msi.x64 ...... Done
Installing Aspire.ProjectTemplates.Msi.x64 ..... Done
Installing Aspire.Hosting.Orchestration.win-x64.Msi.x64 ............. Done
Installing Aspire.Hosting.Msi.x64 ..... Done
Installing Aspire.Dashboard.Sdk.win-x64.Msi.x64 ....... Done

Successfully installed workload(s) aspire.

Compruebe que la carga de trabajo de .NET Aspire está instalada con este comando:

dotnet workload list

Debería ver los detalles de la carga de trabajo de aspire.

Installed Workload Id      Manifest Version      Installation Source
---------------------------------------------------------------------------------------------
aspire                     8.0.0/8.0.100         SDK 8.0.300-preview.24203, VS 17.10.34902.84

Use `dotnet workload search` to find additional workloads to install.

Clonar y modificar la aplicación de ejemplo

Vamos a usar git para obtener una aplicación de ejemplo compilada con .NET Aspire. La aplicación aún no tiene configurado el almacenamiento en caché:

En la línea de comandos, vaya a una carpeta de su elección, donde pueda trabajar con código.
Ejecute el siguiente comando para clonar la aplicación de ejemplo Northern Mountains eShop:
```
git clone -b aspire-cache https://github.com/MicrosoftDocs/mslearn-aspire-starter
```
Inicie Visual Studio y después seleccione Abrir un proyecto o solución.
Vaya a la carpeta donde ha clonado eShop, abra la carpeta de inicio y seleccione el archivo eShop.rediscache.sln y, a continuación, seleccione Abrir.
En el Explorador de soluciones, vaya a WebApp/Components/Pages y, a continuación, haga doble clic en Catalog.razor.

Busque la línea de código siguiente:

<SectionContent SectionName="page-header-subtitle">Start the season with the latest in clothing and equipment.</SectionContent>

Reemplace la línea con el código siguiente:

<SectionContent SectionName="page-header-subtitle">Start the season with the latest in clothing and equipment. It's @DateTime.Now</SectionContent>

Para iniciar la aplicación, presione F5 o seleccione Depurar>Iniciar depuración.
Si aparece el cuadro de diálogo Iniciar Docker Desktop, seleccione Sí.
Cuando aparezca el panel de eShop de .NET Aspire, en el recurso de aplicación web, seleccione uno de los puntos de conexión:
El punto de conexión muestra la página principal de Northern Mountains. Incluyendo la hora en el servidor:
Presione F5 para actualizar la página. Dado que la página no se almacena en caché, la hora que se muestra cambia cada vez que se actualiza, siempre que el segundo haya cambiado.
Cambie a la pestaña del explorador que muestra el panel de .NET Aspire y, a continuación, en el panel de navegación izquierdo, seleccione Seguimientos.
Los seguimientos con el nombre aplicación web: GET / son solicitudes para la página principal. Tome nota de la duración típica para estas solicitudes y, después, en una de ellas, seleccione Ver en la columna Detalles:
En la vista de escala de tiempo, tenga en cuenta que la aplicación web llama a varios microservicios para construir la respuesta.
Cierre la página principal de Northern Mountains y el panel de .NET Aspire.
En Visual Studio, para detener la depuración, presione Mayús - F5 o seleccione Depurar > Detener depuración.

Adición de un servicio de respaldo de almacenamiento en caché

Ahora que ha visto cómo funciona la página principal sin almacenamiento en caché, vamos a agregar el almacenamiento en caché de salida para ver si mejora la capacidad de respuesta. Empiece agregando el componente de almacenamiento en caché de salida al proyecto AppHost:

En Visual Studio, en Explorador de soluciones, haga clic con el botón derecho en el proyectoeShop.AppHost, seleccione Agregar y, a continuación, seleccione paquete de .NET Aspire.
En el cuadro de texto de búsqueda, al final del texto existente, escriba Redis.
Seleccione el paquete Aspire.Hosting.Redis.
En la lista Versión, seleccione la versión más reciente 8.0.0 y, a continuación, seleccione Instalar.
Si aparece el cuadro de diálogo Vista previa de cambios, seleccione Aplicar.
En el diálogo Aceptación de licencia, seleccione Acepto.
En Explorador de soluciones, expanda el proyecto AppHost y, a continuación, haga doble clic en Program.cs.

Busque las siguientes líneas de código:

// Databases

var postgres = builder.AddPostgres("postgres").WithPgAdmin();
var catalogDb = postgres.AddDatabase("CatalogDB");

Inmediatamente después de esas líneas, agregue el siguiente código:
```
// Cache
var redis = builder.AddRedis("cache");
```
Busque la siguiente línea de código, que agrega el proyecto API de Catálogo a la orquestación de .NET Aspire:
```
var catalogApi = builder.AddProject<Catalog_API>("catalog-api")
    .WithReference(catalogDb);
```
Para pasar la caché de Redis al proyecto de API de Catálogo, reemplace ese código por las siguientes líneas:
```
var catalogApi = builder.AddProject<Catalog_API>("catalog-api")
    .WithReference(catalogDb)
    .WithReference(redis);
```
Nota:

Usaremos la memoria caché en la API de Catálogo para realizar el almacenamiento en caché distribuido.
Busque la siguiente línea de código, que agrega el proyecto WebApp a la orquestación de .NET Aspire:
```
builder.AddProject<WebApp>("webapp")
    .WithReference(catalogApi);
```
Para pasar la caché de Redis al proyecto WebApp, reemplace ese código por las siguientes líneas:
```
builder.AddProject<WebApp>("webapp")
    .WithReference(catalogApi)
    .WithReference(redis);
```
Nota:

Usaremos la caché en WebApp para realizar el almacenamiento en caché de salida.
Para guardar el archivo Program.cs, presione CTRL - S o seleccione Archivo > Guardar Program.cs.

Uso del almacenamiento en caché de salida en el proyecto WebApp

Ahora, vamos a usar la caché de Redis en el proyecto WebApp para almacenar en caché la salida de la página principal:

En Visual Studio, en Explorador de soluciones, haga clic con el botón derecho en el proyectoWebApp, seleccione Agregar y, a continuación, seleccione paquete de .NET Aspire.
En el cuadro de texto de búsqueda, al final del texto existente, escriba Redis.
Seleccione el paquete Aspire.StackExchange.Redis.OutputCaching.
En la lista Versión, seleccione la versión más reciente 8.0.0 y, a continuación, seleccione Instalar.
Si aparece el cuadro de diálogo Vista previa de cambios, seleccione Aplicar.
En el diálogo Aceptación de licencia, seleccione Acepto.
Una vez completada la instalación, en Explorador de soluciones, expanda WebApp y, a continuación, haga doble clic en Program.cs.

Busque la línea de código siguiente:

var builder = WebApplication.CreateBuilder(args);

Inmediatamente después de esa línea, para agregar la memoria caché de salida al proyecto, agregue este código:
```
builder.AddRedisOutputCache("cache");
```
Busque la línea de código siguiente:
```
var app = builder.Build();
```
Inmediatamente después de esa línea, para agregar el middleware de almacenamiento en caché a la canalización de solicitudes, agregue este código:
```
app.UseOutputCache();
```
En Explorador de soluciones, expanda WebApp > Componentes > Páginas y haga doble clic en Catalog.razor.
Busque la línea de código siguiente:
```
@attribute [StreamRendering]
```
Inmediatamente después de esa línea, para almacenar en caché la página principal, agregue este código:
```
@attribute [Microsoft.AspNetCore.OutputCaching.OutputCache(Duration = 10)]
```

Almacenamiento en caché de salida de prueba

El almacenamiento en caché de salida ahora se implementa en la página principal de Northern Mountains. Vamos a probarlo:

En Visual Studio, para iniciar la aplicación, presione F5 o seleccione Depurar > Iniciar depuración.
Cuando aparezca el panel de eShop de .NET Aspire, en el recurso de aplicación web, seleccione uno de los puntos de conexión:
El punto de conexión muestra la página principal de Northern Mountains, incluida la hora en el servidor.
Presione F5 para actualizar la página. Dado que la página se almacena en caché durante 10 segundos, la hora mostrada cambia solo cuando es superior a 10 segundos después de la solicitud almacenada en caché.
Cambie a la pestaña del explorador que muestra el panel de .NET Aspire y, a continuación, en el panel de navegación izquierdo, seleccione Seguimientos.
Los seguimientos con el nombre aplicación web: GET / son solicitudes para la página principal. Algunas solicitudes a la página principal, que no se pudieron satisfacer desde la memoria caché, tienen tiempos similares a las duraciones que anotó anteriormente. Sin embargo, otras solicitudes, que se devuelven de la memoria caché, tienen duraciones significativamente más cortas.
Para una de las solicitudes más cortas, seleccione Vista en la columna Detalles. Observe que la solicitud se recuperó de la caché de Redis:
Cierre la página principal de Northern Mountains y el panel de .NET Aspire.
En Visual Studio, para detener la depuración, presione Mayús - F5 o seleccione Depurar > Detener depuración.

Uso del almacenamiento en caché distribuido

También podemos usar Redis para realizar el almacenamiento en caché distribuido en el proyecto Catalog.API:

En Visual Studio, en Explorador de soluciones, haga clic con el botón derecho en el proyectoCatalog.API, seleccione Agregar y, a continuación, seleccione paquete de .NET Aspire.
En el cuadro de texto de búsqueda, al final del texto existente, escriba Redis.
Seleccione el paquete Aspire.StackExchange.Redis.DistributedCaching.
En la lista Versión, seleccione la versión más reciente 8.0.0 y, a continuación, seleccione Instalar.
Si aparece el cuadro de diálogo Vista previa de cambios, seleccione Aplicar.
En el diálogo Aceptación de licencia, seleccione Acepto.
Una vez completada la instalación, en Explorador de soluciones, expanda Catalog.API y, a continuación, haga doble clic en Program.cs.

Busque la línea de código siguiente:

var builder = WebApplication.CreateBuilder(args);

Inmediatamente después de esa línea, para agregar la memoria caché de salida al proyecto, agregue este código:
```
builder.AddRedisDistributedCache("cache");
```
En Explorador de soluciones expanda Catalog.API > API y haga doble clic en CatalogApi.cs.

Busque el siguiente código, que declara el método GetAllItems:

public static async Task<Results<Ok<PaginatedItems<CatalogItem>>, BadRequest<string>>> GetAllItems(
    [AsParameters] PaginationRequest paginationRequest,
    [AsParameters] CatalogServices services)
{

Para obtener la caché de Redis mediante la inserción de dependencias, modifique ese código para agregar un nuevo parámetro al método:

public static async Task<Results<Ok<PaginatedItems<CatalogItem>>, BadRequest<string>>> GetAllItems(
    [AsParameters] PaginationRequest paginationRequest,
    [AsParameters] CatalogServices services,
    IDistributedCache cache)
{

Quite todo el contenido del método GetAllItems y reemplácelo por el código siguiente:

var pageSize = paginationRequest.PageSize;
var pageIndex = paginationRequest.PageIndex;

var totalItems = await services.DbContext.CatalogItems
    .LongCountAsync();

// Check that there are cached items
var cachedItems = await cache.GetAsync("catalogItems");

if (cachedItems is null)
{
    // There are no items in the cache. Get them from the database
    var itemsOnPage = await services.DbContext.CatalogItems
        .OrderBy(c => c.Name)
        .Skip(pageSize * pageIndex)
        .Take(pageSize)
        .AsNoTracking()
        .ToListAsync();

    // Store the items in the cache for 10 seconds
    await cache.SetAsync("catalogItems", Encoding.UTF8.GetBytes(System.Text.Json.JsonSerializer.Serialize(itemsOnPage)), new()
    {
        AbsoluteExpiration = DateTime.Now.AddSeconds(10)
    });

    ChangeUriPlaceholder(services.Options.Value, itemsOnPage);
    return TypedResults.Ok(new PaginatedItems<CatalogItem>(pageIndex, pageSize, totalItems, itemsOnPage));

}
else
{
    // There are items in the cache. Deserialize them to display.
    var itemsOnPage = System.Text.Json.JsonSerializer.Deserialize<List<CatalogItem>>(cachedItems);
    // Make sure itemsOnPage is not null
    if (itemsOnPage is null)
    {
        itemsOnPage = new List<CatalogItem>();
    }

    ChangeUriPlaceholder(services.Options.Value, itemsOnPage);
    return TypedResults.Ok(new PaginatedItems<CatalogItem>(pageIndex, pageSize, totalItems, itemsOnPage));
}

Prueba del almacenamiento en caché distribuido

El almacenamiento en caché distribuido ahora se implementa en el proyecto Catalog.API. Vamos a probarlo:

En Visual Studio, para iniciar la aplicación, presione F5 o seleccione Depurar > Iniciar depuración.
Cuando aparezca el panel de eShop de .NET Aspire, para el recurso catalog-api, seleccione el punto de conexión:
El punto de conexión muestra la interfaz de Swagger para el microservicio de API de Catálogo. Junto al método /api/v1/catalog/items, seleccione GET.
Seleccione Probarlo y, a continuación, seleccione Ejecutar. Los resultados se muestran en la ventana Cuerpo de la respuesta:
Haga clic en Ejecutar varias veces más para volver a llamar a la API. Estas solicitudes deben obtener los elementos de la memoria caché, siempre y cuando la solicitud sea inferior a 10 segundos después de la primera.
Cambie a la pestaña del explorador que muestra el panel de .NET Aspire y, a continuación, en el panel de navegación izquierdo, seleccione Seguimientos.
Los seguimientos con el nombre catalog-api: GET /api/v1/catalog/items son solicitudes para el método elementos de la API de Catálogo. Tenga en cuenta que la primera solicitud a ese método tarda más tiempo en formular las solicitudes posteriores, que la API obtiene los elementos de la caché de Redis:
Cierre la página de Swagger y el panel de .NET Aspire.
En Visual Studio, para detener la depuración, presione Mayús - F5 o seleccione Depurar > Detener depuración.

Continuar

Ejercicio: almacenamiento en caché de datos en Redis

Requisitos previos de instalación

Instalación de .NET 8

Instalación de Visual Studio 2022 Preview

Instalar Docker Desktop

Instalación de la carga de trabajo de .NET Aspire en Visual Studio

Clonar y modificar la aplicación de ejemplo

Adición de un servicio de respaldo de almacenamiento en caché

Uso del almacenamiento en caché de salida en el proyecto WebApp

Almacenamiento en caché de salida de prueba

Uso del almacenamiento en caché distribuido

Prueba del almacenamiento en caché distribuido

Comentarios