Skip to content

LAB : Création d'un pipeline via Webhook après un push#

Présentation#

Un webhook est un mécanisme qui permet à un service (comme GitHub) de notifier automatiquement un autre système (comme Jenkins) lorsqu’un événement se produit comme par exemple, un git push.

Lorsqu’un développeur pousse du code, GitHub envoie une requête HTTP (le webhook) à Jenkins, qui déclenche le pipeline automatiquement. De ce fait on aura plus besoin de lancer le job manuellement sur Jenkins : le déclenchement du pipeline se fait tout seule.

Objectifs:#

  • Configuration du WebHook sur Github
  • Mise en place d'une pipeline jenkins délenché via Webhook Github
  • Automatisation du build d'application à chaque push sur Github

Prérequis#

  • Connaissance de Docker et GIT
  • Instance docker fonctionnel
  • Editeur de code
  • Utilitaire installé sur la machine: git
  • Avoir un compte sur Github
  • Avoir un proxy nginx fonctionnel (voir lab deploy reverse proxy sur la section 03-conteneurisation)
  • Avoir un jenkins de fonctionnel voir lab précèdent

Déroulement du Lab#

Etape 1 : Utilisation de Ngrok pour exposer publiquement l'url de notre Jenkinst#

N.B : Cette étape ne sera pas nécessaire si vous utilisez un jenkins qui est installé sur un cloud public tel que AWS et que l'url de connexion vers jenkins est sur un DNS public.

Cependant pour une utilisation de jenkins en local capable de déclencher des jobs de façon automatisé depuis Github, il sera necessaire d'exposer une url d'accès publique à notre jenkins. Pour cela, on va utiliser l'outil ngrok qui va créer un tunnel entre notre jenkins local et internet pour nous permettre ainsi de l'exposer et le rendre atteignable par les webhook de Github.

  • Installer ngrok en fonction de son système d'exploitation, voir lien --> https://dashboard.ngrok.com/get-started/setup/linux

Exemple sur Linux :

curl -sSL https://ngrok-agent.s3.amazonaws.com/ngrok.asc \
    | sudo tee /etc/apt/trusted.gpg.d/ngrok.asc >/dev/null \
    && echo "deb https://ngrok-agent.s3.amazonaws.com buster main" \
    | sudo tee /etc/apt/sources.list.d/ngrok.list \
    && sudo apt update \
    && sudo apt install ngrok
  • Une fois installé, créer un compte sur ngrok à l'aide de ce lien --> https://dashboard.ngrok.com/get-started/setup

  • Une fois le compte créé et confirmé, se rendre sur ce lien pour récupérer le token d'authentification à ngrok --> https://dashboard.ngrok.com/get-started/your-authtoken
  • Cliquer sur Show Authtoken puis copier la commande d'ajout du token sur notre système

  • Exécuter la commande copiée sur notre machine depuis laquelle on a installé ngrok et sur laquelle tourne notre jenkins
ngrok config add-authtoken <mon token>
  • Démarrer ngrok avec la commande ci-dessous qui va créer une url publique qui va rediriger tout le traffic vers notre localhost et sur le port 80
ngrok http 80
  • Une fois démarré, une url sera génèrée dynamiquement

  • Renseigner cette url dans la configuration du proxy nginx présent dans le fichier lecloudfacile-devops-labs/ginx-proxy/conf.d/jenkins.conf

Il suffira juste de modifier la ligne contenant server_name jenkins.lcf.io en rajoutant l'url de ngrok génèrée pprécèdemment. Dans notre exemple, cela donnera ce contenu ci-dessous 

server {
    listen 80;
    server_name jenkins.lcf.io 0d74-92-91-191-251.ngrok-free.app;

    location / {
        proxy_pass http://jenkins:8080;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
    }
}
  • Recharger la conf du proxy avec la commande :
docker exec -ti proxy nginx -s reload
  • Se rendre sur l'url ngrok https://0d74-92-91-191-251.ngrok-free.app/ et confirmer qu'il redirige bien sur jenkins

Etape 2 : Configuration du Webhook sur Github#

Dans cette partie, on va essayer de créer un webhook sur le projet Github du lab précèdent permettant de déclencher une execution de job jenkins à chaque push sur la branche de main

  • Se rendre sur le projet Github springboot-react-app, puis dans les Settings du projet et cliquer sur Webhooks

  • Cliquer sur Add webhook à droite
  • Ensuite dans le champ Payload URL, renseigner l'url de connexion à Jenkins via ngrok suivi de /github-webhook comme dans l'image ci-dessous (tout en adaptant l'url à la votre)
https://0d74-92-91-191-251.ngrok-free.app/github-webhook/

  • Ensuite cliquer sur Add webhook pour créer le Webhook

Etape 3 : Mise en place du job Jenkins déclenché via le Webhook sur Github#

Dans cette étape on va créer un nouveau job de type pipeline qui se basera sur le repo Github sur lequel on vient de configurer le webhook

  • D'abord installer le plugin Github Integration plugin

  • Créer un nouveau job de type pipeline et lui donner le nom build-springboot-webhook

  • Dans la section Triggers, sélectionner GitHub hook trigger for GITScm polling

  • Dans la section Pipeline, sélectionner Pipeline script from SCM, puis sélectionner Git
  • Renseigner l'url du repo github et sélectionner le credential de connexion à Github
  • Dans la section Branches to build renseigner */main pour lui dire de considèrer que la branche main

  • Ensuite cliquer sur Save

Etape 4 : Push de code depuis Github pour déclencher le job Jenkins de façon automatisé#

  • Faire une modification sur la branche main. Exemple : rajouter du contenu dans le fichier Readme.md
  • On peut voir, à la suite de notre push, qu'un job s'est déclenché automatiquement sur à notre push sur la branche main

  • Et dans Console output, on peut voir que le job a été déclenché suite à un push depuis Github