Exercice : Créer un fichier Docker Compose pour l’orchestration

Effectué

L’entreprise d’équipement pour extérieur Contoso dispose de deux services qu’elle souhaite regrouper afin de générer et déployer une unique unité. L’entreprise décide d’utiliser Docker Compose pour générer les services ensemble.

Dans cet exercice, vous créez un fichier YAML Docker Compose. Vous utilisez ensuite l’utilitaire Docker Compose pour générer les images conteneur Docker et les exécuter.

Se connecter au codespace

Si vous vous êtes déconnecté du codespace que vous avez utilisé dans l’exercice précédent, reconnectez-vous maintenant :

  1. Ouvrez un navigateur et accédez au référentiel eShopLite.
  2. Sélectionnez Code, puis l’onglet Codespaces.
  3. Sélectionnez le codespace que vous avez créé dans l’exercice précédent. GitHub ouvre le codespace.
  4. Accédez au répertoire /dotnet-docker.

Créer le fichier Docker Compose

Utilisez le fichier docker-compose afin de configurer des images pour les services back-end et front-end :

  1. Dans le dossier dotnet-docker du codespace (celui où se trouve README.md), ouvrez le fichier nommé ./dotnet-docker/docker-compose.yml. Ce fichier est vide.

  2. Ajoutez le code suivant au fichier docker-compose.yml :

    version: '3.4'
    
    services: 
    
        frontend:
            image: store:latest
            environment: 
                - ProductEndpoint=http://backend:8080
            ports:
                - "32000:8080"
            depends_on: 
                - backend
        backend:
            image: products:latest
            ports: 
                - "32001:8080"
    

    Ce code effectue plusieurs tâches :

    • Il crée le site web front-end et le nomme frontend.
    • Le code définit une variable d’environnement pour le site web : ProductEndpoint=http://backend:8080. Ce code indique la façon dont le front-end recherche le service back-end des Produits.
    • Le code ouvre un port et déclare sa dépendance au service back-end.
    • Le service back-end nommé backend est ensuite créé.
    • La dernière commande indique quel port ouvrir.
  3. En comparaison, le fichier docker-compose.yml que vous devriez utiliser si vous aviez des dockerfiles :

    version: '3.4'
    
    services: 
    
        frontend:
            image: storeimage
            build:
                context: .
                dockerfile: ./Store/Dockerfile
            environment: 
               - ProductEndpoint=http://backend:8080
            ports:
               - "32000:8080"
            depends_on: 
               - backend
        backend:
            image: productservice
            build: 
                context: .
                dockerfile: ./Products/Dockerfile
            ports: 
               - "32001:8080"
    

    Le code est presque identique. La seule différence est la nécessité d’avoir les phases de build qui pointent vers chaque dockerfile.

Générer les images et exécuter les conteneurs

À présent, utilisez Docker Compose pour générer et démarrer les composants front-end et back end.

  1. Pour générer les images conteneur avec la prise en charge des conteneurs .NET, sélectionnez l’onglet Terminal, puis exécutez la commande suivante :

    dotnet publish /p:PublishProfile=DefaultContainer
    
  2. Pour démarrer le site web front-end et l’API web back end, exécutez cette commande :

    docker compose up
    
  3. Une sortie apparaît, puis le site web et l’API web s’exécutent. Vous devriez voir une sortie semblable à cet exemple :

    [+] Running 2/0
        ✔ Container finished-files-backend-1   Created                                                                                   0.0s 
        ✔ Container finished-files-frontend-1  Created                                                                                   0.0s 
    Attaching to backend-1, frontend-1
    ...
    backend-1   | info: Microsoft.Hosting.Lifetime[0]
    backend-1   |       Hosting environment: Production
    backend-1   | info: Microsoft.Hosting.Lifetime[0]
    backend-1   |       Content root path: /app
    

    A screenshot of the codespace ports tab.

  4. Pour tester le service front-end, sélectionnez l’onglet Ports. Ensuite, à droite de l’adresse locale du port Front End, sélectionnez l’icône du globe. Le navigateur affiche la page d’accueil.

  5. Sélectionnez Produits. Le catalogue affiche la marchandise de Contoso.

    A screenshot of the eSHopLite webshop products.