Exercice - Ajouter OpenTelemetry à une application native cloud

Effectué

Dans cet exercice, vous ajoutez un nouveau projet de diagnostic à votre eShopLite solution. Vous verrez comment inclure les packages NuGet OpenTelemetry, puis ajouter l’observabilité au service Produits .

Ouvrez l’environnement de développement et créez les ressources Azure

Vous pouvez choisir d’utiliser un espace de code GitHub qui héberge l’exercice ou effectuez l’exercice localement dans Visual Studio Code.

Pour utiliser un espace de code, créez un espace de code GitHub préconfiguré avec ce modèle de création Codespace.

Cette étape prend plusieurs minutes pendant que GitHub crée et configure l’espace de code. Une fois le processus terminé, vous voyez les fichiers de code de l’exercice. Le code utilisé pour le reste de ce module se trouve dans le répertoire /dotnet-observability .

Pour utiliser Visual Studio Code, clonez le référentiel https://github.com/MicrosoftDocs/mslearn-dotnet-cloudnative sur votre ordinateur local. Ensuite :

  1. Installez les éléments système requis pour exécuter Dev Container dans Visual Studio Code.
  2. Vérifiez que Docker est en cours d’exécution.
  3. Dans une nouvelle fenêtre Visual Studio Code, ouvrez le dossier du référentiel cloné.
  4. Appuyez sur Ctrl+Maj+P pour ouvrir la palette de commandes.
  5. Recherche : >Conteneurs de développement : Rebuild and Reopen in Container (Regénérer et rouvrir dans un conteneur).
  6. Sélectionnez eShopLite - dotnet-observabilité dans la liste déroulante. Visual Studio Code crée votre conteneur de développement localement.

Ajouter un projet de diagnostic à la solution

La première étape de l’ajout de l’observabilité à l’application eShopLite consiste à introduire un nouveau projet de diagnostic à la solution. Ce projet contient tous les packages et configurations OpenTelemetry que vous utiliserez pour ajouter l’observabilité à l’application.

  1. Dans la palette de commandes Codespace, entrez >.NET : Ouvrir la solution.
  2. Sélectionnez dotnet-observability/eShopLite/eShopLite.sln.
  3. Dans l’Explorateur de solutions, en bas du volet Explorateur , cliquez avec le bouton droit sur la solution eShopLite , puis sélectionnez Nouveau projet.
  4. Dans la boîte de dialogue Sélectionner un modèle pour créer un projet .NET, sélectionnez Bibliothèque de classes (Commun, Bibliothèque).
  5. Dans le champ Nom , entrez Diagnostics.
  6. Dans la liste déroulante Projet sera créé dans, assurez-vous que le répertoire du chemin d'accès au fichier est /workspaces/mslearn-dotnet-cloudnative/dotnet-observability/eShopLite/.

Ajouter les packages OpenTelemetry

Ajoutez maintenant les packages OpenTelemetry au nouveau projet de diagnostic.

  1. En utilisant le volet TERMINAL en bas de Codespace, accédez au dossier du projet Diagnostics :

    cd dotnet-observability/eShopLite/Diagnostics
    
  2. Exécutez ces dotnet add commandes :

    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. Dans le volet EXPLORATEUR , développez le dossier Diagnostics , puis sélectionnez Diagnostics.csproj.

  4. Remplacez le Project Sdk haut par :

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

    Le code précédent vous permet d’utiliser la IConfiguration classe dans votre code.

  5. Dans le <PropertyGroup>, ajoutez le type de sortie :

    <OutputType>Library</OutputType>
    

    Le code précédent garantit que le projet est construit en tant que bibliothèque. Sinon, le compilateur attend un Program.cs fichier avec une main méthode.

Ajouter le code pour utiliser OpenTelemetry

Avec les packages OpenTelemetry ajoutés, vous introduisez maintenant le code à utiliser.

  1. Dans le volet Explorateur , cliquez avec le bouton droit sur le fichier Class1.cs , puis sélectionnez Renommer.

  2. Renommez le fichier en DiagnosticServiceCollectionExtensions.cs.

  3. Remplacez le code du fichier par le code suivant :

    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. Dans le volet TERMINAL , exécutez cette commande pour générer le projet :

    dotnet build
    

    La sortie doit ressembler à cet exemple :

    Build succeeded.
        0 Warning(s)
        0 Error(s)
    
  5. Le projet Diagnostics est maintenant prêt à être utilisé par le service Products .

  6. Dans le volet EXPLORATEUR , sous l’Explorateur de solutions, cliquez avec le bouton droit sur le projet Produits , puis sélectionnez Ajouter une référence de projet.

  7. Sélectionnez Diagnostics.

  8. Dans le volet EXPLORATEUR , développez le dossier Produits , puis sélectionnez Program.cs.

  9. Sous le commentaire // Add observability code here, ajoutez un appel à la méthode Diagnostics :

    builder.Services.AddObservability("Products", builder.Configuration);
    
  10. Dans le volet TERMINAL , accédez au dossier Produits :

    cd ../Products
    
  11. Exécutez cette commande pour générer le projet :

    dotnet build
    

    La sortie doit ressembler à cet exemple :

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

Mettre à jour les paramètres Docker et exécuter l’application

  1. Dans le volet TERMINAL , accédez à la racine du dossier dotnet-observability :

    cd ..
    dotnet publish /p:PublishProfile=DefaultContainer
    
  2. Exécutez ces commandes Docker :

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

    Les conteneurs back-end (service Produits) et front-end (service Magasin) doivent être générés. Ensuite, l’application démarre.

  3. Si vous effectuez cet exercice dans un espace de code, sélectionnez l’onglet PORTS en bas de la fenêtre Visual Studio Code. Sélectionnez le lien Ouvrir dans le navigateur à côté du service Front End.

  4. Si vous effectuez cet exercice localement dans Visual Studio Code, dans un nouvel onglet de navigateur, accédez à l’application à l’adresse http://localhost:32000.

  5. Dans l’application, sélectionnez Produits dans la barre de navigation.

    Capture d’écran montrant la page Produits dans l’application eShopLite. La page affiche une liste de produits portant un nom, une description et un bouton pour mettre à jour le stock.

  6. Sélectionnez Mettre à jour le stock pour plusieurs produits. Ensuite, dans la boîte de dialogue, modifiez la valeur du stock, puis sélectionnez Mettre à jour.

  7. Sélectionnez l’onglet TERMINAL et faites défiler les messages. Notez qu’il existe des messages d’OpenTelemetry comme suit :

    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. Appuyez sur Ctrl+C pour arrêter l’application.

Vous avez ajouté OpenTelemetry au service Products . Dans l’unité suivante, vous verrez comment améliorer l’utilisation des données de télémétrie en l’affichant sur des outils tels que Prometheus et Grafana.