Cours N8n 1.0.2 Bug pour le sujet : Section 2 - Processeur de Webhook de Commande

Il semble que le cours n8n102 soit conçu pour faire souffrir les apprenants. D’abord, il y a un bug dans la section 1 sur SendToPriorityQueue qui n’a toujours pas été résolu, et maintenant la partie Webhook ne peut tout simplement pas être suivie car la page de test nécessite https alors que le tutoriel utilise http. Je suis donc complètement bloqué dès le début de l’exercice pratique. Voici la capture d’écran de l’erreur json/workflow :

{
“nodes”: [
{
“parameters”: {
“httpMethod”: “POST”,
“path”: “course/n8n102/new-order”,
“authentication”: “headerAuth”,
“responseMode”: “responseNode”,
“options”: {
“allowedOrigins”: “*”
}
},
“type”: “n8n-nodes-base.webhook”,
“typeVersion”: 2.1,
“position”: [
0,
0
],
“id”: “5b647ab0-18c4-41a4-bb01-62fddb40e0d7”,
“name”: “WebhookNewOrder”,
“webhookId”: “cb64f5fc-8c9c-4d7d-abb7-7f3ca5eb7305”,
“credentials”: {
“httpHeaderAuth”: {
“id”: “vMHAPkPKaravjcEZ”,
“name”: “n8n Academy API Key”
}
}
},
{
“parameters”: {
“conditions”: {
“options”: {
“caseSensitive”: true,
“leftValue”: “”,
“typeValidation”: “strict”,
“version”: 3
},
“conditions”: [
{
“id”: “dd887f0b-a710-4f6d-ae7b-4135da5667a8”,
“leftValue”: “={{ $json.body.order_id }}”,
“rightValue”: “”,
“operator”: {
“type”: “string”,
“operation”: “notEmpty”,
“singleValue”: true
}
},
{
“id”: “a7140c1e-23cc-4dba-9662-0059886cdb53”,
“leftValue”: “={{ $json.body.customer_id }}”,
“rightValue”: “”,
“operator”: {
“type”: “string”,
“operation”: “notEmpty”,
“singleValue”: true
}
},
{
“id”: “438dee60-5bcf-4002-927e-280813e11b18”,
“leftValue”: “={{ $json.body.total }}”,
“rightValue”: “”,
“operator”: {
“type”: “number”,
“operation”: “notEmpty”,
“singleValue”: true
}
}
],
“combinator”: “and”
},
“options”: {}
},
“type”: “n8n-nodes-base.if”,
“typeVersion”: 2.3,
“position”: [
208,
0
],
“id”: “9fb45b77-fe7c-4240-848b-deadf5cf8bc7”,
“name”: “ValidateRequiredFields”
},
{
“parameters”: {
“respondWith”: “json”,
“responseBody”: “={\n "status": "accepted",\n "order_id": "{{ $(‘WebhookNewOrder’).item.json.body.order_id }}",\n "message": "Order received and queued for processing"\n}”,
“options”: {
“responseCode”: 200
}
},
“type”: “n8n-nodes-base.respondToWebhook”,
“typeVersion”: 1.5,
“position”: [
416,
-96
],
“id”: “b945dafb-6e2f-461a-8534-414b735b7ab8”,
“name”: “RespondSuccess”
},
{
“parameters”: {
“respondWith”: “json”,
“responseBody”: “={\n "status": "error",\n "message": "Missing required fields: order_id, customer_id, and total are required"\n}”,
“options”: {
“responseCode”: 400
}
},
“type”: “n8n-nodes-base.respondToWebhook”,
“typeVersion”: 1.5,
“position”: [
416,
96
],
“id”: “b23fadc8-b731-444d-bc84-10cb1f7d9f38”,
“name”: “RespondValidationError”
}
],
“connections”: {
“WebhookNewOrder”: {
“main”: [
[
{
“node”: “ValidateRequiredFields”,
“type”: “main”,
“index”: 0
}
]
]
},
“ValidateRequiredFields”: {
“main”: [
[
{
“node”: “RespondSuccess”,
“type”: “main”,
“index”: 0
}
],
[
{
“node”: “RespondValidationError”,
“type”: “main”,
“index”: 0
}
]
]
}
},
“pinData”: {},
“meta”: {
“templateCredsSetupCompleted”: true,
“instanceId”: “1b202188b62737e64678f469a8e86b98e8d2c2147255e95f1e4af4dc019b5e9d”
}
}

@Usman_Waheed, tu peux utiliser ngrok.
N’oublie pas de mettre à jour l’URL du webhook après ça

Qu’est-ce que ngrok ?

ngrok offre à votre installation n8n un sous-domaine https public

Merci, mais ce sera un autre domaine sur lequel il faudra consacrer du temps. N’y a-t-il pas une correction du tutoriel/URL de l’académie N8N ?

@Usman_Waheed si ngrok vous semble trop complexe, essayez localtunnel - une seule commande, pas de compte :

npx localtunnel --port 5678

Cela vous donne une URL HTTPS publique instantanément. Collez-la comme base de votre webhook dans n8n et l’exercice du cours fonctionne. Gardez le terminal ouvert pendant l’exercice, fermez-le quand vous avez terminé.

Je suis complètement perdu à : Collez-le comme votre base webhook dans n8n et l’exercice du cours fonctionne.
De votre commande npx, j’ai obtenu l’URL (et le terminal est ouvert) : https://blue-deer-press.loca.lt

alors où exactement dois-je mettre cette URL, je ne vois aucun champ « Base URL », nulle part dans le nœud webhook ou nulle part dans l’exercice, ou dois-je mettre cette URL dans la zone de texte de la page de test (Webhook Tester - n8n Academy | N8N102)

???

@Usman_Waheed, pour répondre directement à ta dernière question, tu ne colles pas l’URL de localtunnel directement dans le nœud webhook.

Voici exactement ce qu’il faut faire :

Étape 1 : Dans n8n, va dans Paramètres → Général et trouve le champ « Webhook URL » ou « n8n URL ». Remplace ce qui s’y trouve par ton URL de localtunnel : https://blue-deer-press.loca.lt

Étape 2 : Enregistre, puis retourne à ton nœud WebhookNewOrder et clique sur « Copy Webhook URL » — il devrait maintenant afficher ton URL de localtunnel au lieu de localhost.

Étape 3 : Colle l’URL de webhook copiée dans la page de test du cours à l’adresse learn.app.n8n.cloud/webhook/course/n8n102/webhook-tester comme URL cible.

Étape 4 : Assure-toi que ton workflow est en mode « Listen for test event » — clique sur le nœud de déclenchement et appuie sur ce bouton avant d’appuyer sur envoyer dans la page de test.

Un conseil avec localtunnel : il affiche parfois une page d’avertissement du navigateur à la première visite. Si les requêtes ne passent pas, ouvre d’abord https://blue-deer-press.loca.lt dans ton navigateur et accepte l’invite, puis réessaie le test.

Il n’y a aucun paramètre comme celui-ci nulle part, j’ai cliqué sur tous ceux de cette capture d’écran mais aucun ne mentionne les paramètres d’URL Webhook, il n’y a pas non plus de paramètres « Général ». Voir cette capture d’écran

J’ai essayé avec Gemini pour me guider étape par étape sur ngrok, c’était court et facile à faire, merci mon test est réussi ce qui m’a permis de continuer le cours.

Comment l’avez-vous résolu avec ngrok ?

Gemini a envoyé ces étapes, je les ai suivies et cela a résolu le problème :
Pour obtenir cette URL https:// et réussir ce module Academy, vous devez utiliser un service de tunneling tiers gratuit. La norme industrielle (et ce que n8n recommande officiellement maintenant pour le développement local) est ngrok.

Voici le moyen le plus rapide de contourner cet obstacle :

Étape 1 : Maintenir n8n en fonctionnement

Laissez votre fenêtre d’invite de commandes actuelle ouverte. Votre instance n8n fonctionne parfaitement sur http://localhost:5678, et nous devons la garder active pour recevoir les données.

Étape 2 : Configurer ngrok

Nous allons créer un pont sécurisé et temporaire depuis Internet public directement vers votre port local 5678.

  1. Allez sur ngrok.com et créez un compte gratuit.

  2. Téléchargez la version Windows et extrayez le fichier .exe.

  3. Ouvrez une nouvelle invite de commandes dans le dossier où vous avez extrait ngrok.

  4. Connectez votre compte en collant la commande d’authentification affichée sur votre tableau de bord ngrok (elle ressemble à ceci) : ngrok config add-authtoken YOUR_AUTHTOKEN_HERE

  5. Démarrez le tunnel pointant vers le port de n8n : ngrok http 5678

Étape 3 : Construire votre nouvelle URL Webhook

Lorsque vous exécutez cette commande, ngrok affichera un écran avec une URL de redirection qui ressemble à https://1234-abcd.ngrok-free.app.

Vous n’avez pas besoin que l’interface utilisateur de n8n affiche physiquement cette URL pour que le test fonctionne. Vous devez simplement combiner votre nouveau domaine ngrok sécurisé avec le chemin spécifique de votre webhook.

  • Votre domaine ngrok : https://1234-abcd.ngrok-free.app (remplacez ceci par votre URL ngrok réelle)

  • Votre chemin webhook : /webhook/course/n8n102/new-order

  • Votre URL de production FINALE : https://1234-abcd.ngrok-free.app/webhook/course/n8n102/new-order

Étape 4 : Réussir l’évaluation Academy

  1. Retournez au testeur Webhook n8n Academy.

  2. Collez votre URL de production FINALE nouvellement construite (celle commençant par https://) dans la zone « Your Webhook URL ».

  3. Assurez-vous que votre nœud Webhook dans n8n est défini sur Listen for test event.

  4. Cliquez sur Run Step 1 Tests sur la page Academy.

Le testeur Academy validera avec succès le lien HTTPS, enverra la charge utile via ngrok, et ngrok la livrera directement dans votre workflow n8n local !

Remarque : Si vous vouliez vraiment que n8n affiche cette nouvelle URL dans l’interface utilisateur du nœud Webhook, vous devriez arrêter n8n et le redémarrer en passant une variable d’environnement (par exemple, set WEBHOOK_URL=https://your-ngrok-url.app && npx n8n start). Cependant, pour réussir ce test Academy, coller manuellement l’URL ngrok combinée dans le testeur est beaucoup plus rapide et réalise exactement la même chose.