Ejercicio: Adición de OpenTelemetry a una aplicación nativa de nube

Completado

En este ejercicio, agregará un nuevo proyecto de diagnóstico a la solución eShopLite. Verá cómo incluir los paquetes NuGet de OpenTelemetry y, a continuación, agregar observabilidad al servicio Products.

Apertura del entorno de desarrollo y creación de los recursos de Azure

Puede optar por usar un codespace de GitHub que hospede el ejercicio, o bien hacer el ejercicio localmente en Visual Studio Code.

Para usar un codespace, cree un codespace preconfigurado de GitHub con esta plantilla de creación de codespace.

Este paso lleva varios minutos mientras GitHub crea y configura el codespace. Una vez finalizado el proceso, verá los archivos de código del ejercicio. El código usado en el resto de este módulo está en el directorio /dotnet-observability.

Para usar Visual Studio Code, clone el repositorio https://github.com/MicrosoftDocs/mslearn-dotnet-cloudnative en la máquina local. Después:

  1. Instale cualquier requisito del sistema para ejecutar Dev Container en Visual Studio Code.
  2. Asegúrese de que Docker se está ejecutando.
  3. En una nueva ventana de Visual Studio Code, abra la carpeta del repositorio clonado
  4. Presione Ctrl+Mayús+P para abrir la paleta de comandos.
  5. Buscar: >Dev Containers: Recompilar y volver a abrir en contenedor
  6. Seleccione eShopLite - dotnet-observability en la lista desplegable. Visual Studio Code crea el contenedor de desarrollo localmente.

Adición de un proyecto de diagnóstico a la solución

El primer paso para agregar observabilidad a la aplicación eShopLite es introducir un nuevo proyecto de diagnóstico en la solución. Este proyecto contiene todos los paquetes y configuraciones de OpenTelemetry que usará para agregar observabilidad a la aplicación.

  1. En la paleta de comandos de Visual Studio Code, introduzca >.NET: Abra Solución.
  2. Seleccione dotnet-observability/eShopLite/eShopLite.sln.
  3. En el Explorador de soluciones, en la parte inferior del panel EXPLORER, haga clic con el botón derecho en la solución eShopLite y, a continuación, seleccione Nuevo proyecto.
  4. En el cuadro de diálogo Seleccionar una plantilla para crear un nuevo proyecto de .NET, seleccione Biblioteca de clases (Común, Biblioteca).
  5. En el campo Nombre, escriba Diagnóstico.
  6. En el menú desplegable El proyecto se creará en seleccione Directorio predeterminado.

Adición de paquetes de OpenTelemetry

Ahora agregue los paquetes de OpenTelemetry al nuevo proyecto de diagnóstico.

  1. Con el panel TERMINAL en la parte inferior de Visual Studio Code, vaya a la carpeta del proyecto Diagnóstico:

    cd dotnet-observability/eShopLite/Diagnostics
    
  2. Ejecute estos comandos dotnet add:

    dotnet add package OpenTelemetry.Exporter.Console
    dotnet add package OpenTelemetry.Extensions.Hosting
    dotnet add package OpenTelemetry.Instrumentation.AspNetCore
    dotnet add package OpenTelemetry.Instrumentation.EventCounters --prerelease
    dotnet add package OpenTelemetry.Instrumentation.Runtime
    dotnet add package OpenTelemetry.Instrumentation.SqlClient --prerelease
    dotnet add package OpenTelemetry.Instrumentation.Http
    
  3. En el panel EXPLORADOR, expanda la carpeta Diagnóstico y, a continuación, seleccione Diagnostics.csproj.

  4. Cambie Project Sdk en la parte superior a:

    <Project Sdk="Microsoft.NET.Sdk.Web">
    

    El código anterior permite usar la clase IConfiguration en el código.

  5. En el <PropertyGroup>, agregue el tipo de salida:

    <OutputType>Library</OutputType>
    

    El código anterior garantiza que el proyecto se compila como una biblioteca. De lo contrario, el compilador espera un archivo Program.cs con un método main.

Adición del código para usar OpenTelemetry

Con los paquetes de OpenTelemetry agregados, introduzca ahora el código para usarlos.

  1. En el panel EXPLORADOR, haga clic con el botón derecho en el archivo Class1.cs y, a continuación, seleccione Cambiar nombre.

  2. Cambie el nombre del archivo a DiagnosticServiceCollectionExtensions.cs.

  3. Reemplace el código del archivo con el código siguiente:

    using OpenTelemetry.Metrics;
    using OpenTelemetry.Resources;
    using OpenTelemetry.Trace;
    
    namespace Microsoft.Extensions.DependencyInjection;
    
    public static class DiagnosticServiceCollectionExtensions
    {
      public static IServiceCollection AddObservability(this IServiceCollection services,
          string serviceName,
          IConfiguration configuration)
      {
        // create the resource that references the service name passed in
        var resource = ResourceBuilder.CreateDefault().AddService(serviceName: serviceName, serviceVersion: "1.0");
    
        // add the OpenTelemetry services
        var otelBuilder = services.AddOpenTelemetry();
    
        otelBuilder
            // add the metrics providers
            .WithMetrics(metrics =>
            {
              metrics
                .SetResourceBuilder(resource)
                .AddRuntimeInstrumentation()
                .AddAspNetCoreInstrumentation()
                .AddHttpClientInstrumentation()
                .AddEventCountersInstrumentation(c =>
                {
                  c.AddEventSources(
                          "Microsoft.AspNetCore.Hosting",
                          "Microsoft-AspNetCore-Server-Kestrel",
                          "System.Net.Http",
                          "System.Net.Sockets");
                })
                .AddMeter("Microsoft.AspNetCore.Hosting", "Microsoft.AspNetCore.Server.Kestrel")
                .AddConsoleExporter();
    
            })
            // add the tracing providers
            .WithTracing(tracing =>
            {
              tracing.SetResourceBuilder(resource)
                          .AddAspNetCoreInstrumentation()
                          .AddHttpClientInstrumentation()
                          .AddSqlClientInstrumentation();
            });
    
        return services;
      }
    }
    
  4. En el panel TERMINAL, ejecute este comando para compilar el proyecto:

    dotnet build
    

    Debería mostrarse una salida similar a esta de ejemplo:

    Build succeeded.
        0 Warning(s)
        0 Error(s)
    
  5. El proyecto Diagnóstico ya está listo para ser utilizado por el servicio Productos.

  6. En el panel EXPLORADOR, en EXPLORADOR DE SOLUCIONES, haga clic con el botón derecho en el proyecto Productos y seleccione Agregar referencia de proyecto.

  7. Haga clic en Diagnósticos.

  8. En el panel EXPLORADOR, expanda la carpeta Productos y después seleccione Program.cs.

  9. En el comentario de código // Add observability code here, agregue una llamada al método Diagnóstico:

    builder.Services.AddObservability("Products", builder.Configuration);
    
  10. En el panel TERMINAL, vaya a la carpeta Productos:

    cd ../Products
    
  11. Ejecute este comando para compilar el proyecto:

    dotnet build
    

    Debería mostrarse una salida similar a esta de ejemplo:

    Build succeeded.
        0 Warning(s)
        0 Error(s)
    

Actualización de la configuración de Docker y ejecución de la aplicación

  1. En el panel TERMINAL, vaya a la raíz de la carpeta dotnet-observability:

    cd ..
    dotnet publish /p:PublishProfile=DefaultContainer
    
  2. Ejecute estos comandos de Docker:

    cd /workspaces/mslearn-dotnet-cloudnative/dotnet-observability/
    docker compose up 
    

    Los contenedores de back-end (servicio de Productos) y front-end (servicio de Store) deberían compilarse. A continuación, se inicia la aplicación.

  3. Si va a realizar este ejercicio en un codespace, seleccione la pestaña PUERTOS en la parte inferior de la ventana de Visual Studio Code. Seleccione el vínculo Abrir en el explorador junto al servicio Front-end.

  4. Si va a realizar este ejercicio localmente en Visual Studio Code, en una nueva pestaña del explorador, vaya a la aplicación en http://localhost:32000.

  5. En la aplicación, seleccione Productos en la barra de navegación.

    Captura de pantalla que muestra la página Productos en la aplicación eShopLite. En la página se muestra una lista de productos con un nombre, una descripción y un precio y un botón para actualizar el stock.

  6. Seleccione Actualizar existencias para varios de los productos. A continuación, en el cuadro de diálogo, cambie el valor de existencias y seleccione Actualizar.

  7. Seleccione la pestaña TERMINAL y desplácese por los mensajes. Tenga en cuenta que hay mensajes de OpenTelemetry como:

    backend-1   | Export ec.Microsoft-AspNetCore-Server-Kestrel.connection-queue-length, Meter: OpenTelemetry.Instrumentation.EventCounters/1.5.1.1
    backend-1   | (2023-11-09T19:55:14.8933518Z, 2023-11-09T20:04:44.8596671Z] http.request.method: PUT http.response.status_code: 200 http.route: /api/Stock/{id} network.protocol.name: http network.protocol.version: 1.1 url.scheme: http Histogram      
    backend-1   | Value: Sum: 0.05144170000000001 Count: 4 Min: 0.0039736 Max: 0.0359739
    
  8. Presione CTRL+C para detener la aplicación.

Ha agregado correctamente OpenTelemetry al servicio Productos. En la siguiente unidad, verá cómo hacer un mejor uso de los datos de telemetría mediante su visualización en herramientas como Prometheus y Grafana.