منهج الأتمتة والنو-كود: من أول سير عمل إلى أول عميل ← الدرس 3

Webhook وJSON: كيف تتكلم الأدوات مع بعض

بتطلع من هالدرس وأنت قادر على: تستقبل طلباً حقيقياً بصيغة JSON على Webhook وتقرأ حقوله وتبني منها رسالة مرتبة.

المدة: فيديو 13 دقيقة + تمرين حتى 20 دقيقة · آخر تحقق من الروابط والفيديو: 2 تشرين الأول 2026

ليش هالدرس مهم

كل ربط بين أداتين تقريباً بيصير بطريقتين: إما أداة بتسأل الثانية بشكل دوري، أو الثانية بتبعت خبر فوري. الخبر الفوري اسمه Webhook، وهو أساس أي أتمتة بتشتغل لحظة وصول الطلب.

والبيانات اللي بتنتقل بصيغة JSON، وهي شكل مرتب بسيط: أسماء حقول وقيم. اللي بيقرأ JSON بسهولة بيحلّ مشاكل الربط بنص الوقت اللي بياخده غيره.

هالدرس هو الفاصل بين الهاوي والمحترف بهالمجال: الهاوي بيعتمد على الأزرار الجاهزة، والمحترف بيفهم وين البيانات وكيف تشكلها.

الفيديو

القناة: Abdulhameed Shaheen | عبد الحميد شاهين · المدة: 13:07 · انتبه لـالتفريق بين الـAPI والـWebhook، وسجّل بالسجل بجملة واحدة من كلامك: مين بيبدأ الاتصال بكل واحد منهم.

الشرح خطوة بخطوة

تخيّل مطعماً بالشام. الـAPI متل إنك تتصل بالمطعم وتسأل «شو جاهز؟». الـWebhook متل إن المطعم يتصل فيك لما يخلص طلبك. بالأولى أنت اللي بتسأل، وبالتانية الخبر بيجيك لحاله. بالأتمتة، الخبر الفوري أسرع وأوفر.

والـJSON هو شكل الرسالة. مثال بسيط لطلب: اسم الزبون، المنتج، الكمية، والمدينة، كلها داخل أقواس مجعّدة بصيغة اسم ثم قيمة. ما في أكثر من هيك.

1. ارجع لسير عملك الأول بـn8n وأنشئ سير عمل جديد باسم «استقبال طلب». احذف عقدة التشغيل اليدوي وأضف مكانها عقدة Webhook. شو رح تشوف على الشاشة: عقدة بمقبض على اليسار وإعدادات على اليمين، فيها خانة مسار (Path) وطريقة (Method).إذا ما ظهرلك: إذا ما لقيتها، ابحث بكلمة webhook وليس بالعربية.
2. اضبط الطريقة على POST، واكتب بخانة المسار كلمة بسيطة مثل order. شو رح تشوف على الشاشة: تحت العقدة بتظهر تبويبات: Test URL وProduction URL، كل واحد برابط مختلف.إذا ما ظهرلك: إذا الرابط ما بيظهر، احفظ الـworkflow أولاً.
3. انسخ Test URL واضغط Listen for test event. هيك العقدة بتنتظر طلباً واحداً بس. شو رح تشوف على الشاشة: العقدة بتضل بحالة انتظار وبتلف مؤشر صغير.إذا ما ظهرلك: الـTest URL بيشتغل فقط لما العقدة بحالة الانتظار؛ إذا انتهت المهلة اضغط الزر مرة ثانية.
4. افتح PowerShell وأرسل طلباً بأمر curl.exe بنفس صيغة المثال تحت الخطوات، ثم ارجع للوحة. شو رح تشوف على الشاشة: العقدة بتنتقل من الانتظار لحالة النجاح، وبتظهر بياناتك داخل تبويب الإخراج.إذا ما ظهرلك: إذا ظهر خطأ اتصال، تأكد إن n8n شغال وإن الرقم بالرابط 5678 مطابق للي فتحته.
5. افتح تبويب JSON بالإخراج. لاحظ إن بياناتك بتكون تحت مفتاح اسمه body، وبجانبه مفاتيح تانية للرؤوس والاستعلام. شو رح تشوف على الشاشة: كتلة JSON فيها body وheaders وquery، وجواً body حقولك: الاسم والمنتج والكمية.إذا ما ظهرلك: إذا ما شفت body، الغالب إن الطلب ما انبعت كـJSON؛ تأكد من الترويسة Content-Type.
6. أضف عقدة Edit Fields بعد الـWebhook وأنشئ حقلاً جديداً اسمه message. بالقيمة اكتب جملة فيها تعبير: اسم الزبون وبعده المنتج. شو رح تشوف على الشاشة: خانة القيمة بتتحول للون مختلف لما تدخل تعبيراً، وبتشوف المعاينة تحتها.إذا ما ظهرلك: التعبير بيبدأ بقوسين مجعّدين مضاعفين؛ إذا ظهر النص حرفياً، فعّل وضع Expression للحقل.
7. جرّب إرسال الطلب ثانية بحقل ناقص (احذف المدينة). شوف كيف بيتصرف التعبير عندما الحقل غير موجود. شو رح تشوف على الشاشة: إما قيمة فاضية، أو رسالة خطأ، وهاد بيعتمد على إعدادات العقدة.إذا ما ظهرلك: هالتجربة بتعلمك إن الطلبات الحقيقية بتجي ناقصة أحياناً؛ سجّل ما شفته بالسجل.
8. اضغط حفظ ثم فعّل سير العمل (Active أو Publish بحسب إصدارك). هلق الرابط الثاني، Production URL، صار شغالاً بدون ما تضغط زر الانتظار. شو رح تشوف على الشاشة: زر التفعيل بيتحول للون مختلف، وبتتغير تسمية الرابط من اختبار لإنتاج.إذا ما ظهرلك: إذا ما اشتغل، افتح تبويب Executions وراقب إن كان فيه تنفيذ جديد وصل.
9. جرّب إرسال طلب لرابط الإنتاج، وافتح Executions وشوف التنفيذ المحفوظ مع بياناته الكاملة. شو رح تشوف على الشاشة: سطر جديد بقائمة التنفيذات بحالة ناجحة، وبتقدر تفتحه وتشوف كل عقدة بدخلها وخرجها.إذا ما ظهرلك: إذا ما ظهر، راجع إن الحفظ تم وإن الرابط بدون كلمة test.

أمر الإرسال التجريبي

الأمر التالي بيرسل طلباً بسيطاً لعقدة الـWebhook. غيّر الجزء الأخير من الرابط لمسارك. بويندوز بنستخدم curl.exe بالضبط (مو curl لحاله، لأن PowerShell بيحوّله لأمر مختلف):

curl.exe -X POST "http://localhost:5678/webhook-test/order" -H "Content-Type: application/json" -d "{\"name\":\"متجر الشام\",\"item\":\"عطر عود\",\"qty\":2,\"city\":\"دمشق\"}"

بعد التفعيل بتبدّل كلمة webhook-test بكلمة webhook وبتستعمل رابط الإنتاج.

قراءة JSON بدون رهبة

• الأقواس المجعّدة {} بتمثل كتلة حقول، والمعقوفة [] بتمثل قائمة عناصر.
• كل حقل: اسم بين علامتي تنصيص، نقطتان، ثم القيمة.
• النص بين علامتي تنصيص، الرقم بدونهما.
• الحقل ممكن يحتوي كتلة داخلية، وبتوصله بنقطة: body ثم name.

وبـn8n بتكتب الوصول للحقل هيك: {{ $json.body.name }}. الجزء بين القوسين بيعني «خذ من البيانات الحالية، من كتلة body، حقل name».

لماذا لا نستعمل أي رابط علني الآن؟

رابط الـWebhook المحلي بيشتغل فقط من جهازك، وهاد بيكفي للتعلم. لما تحط الأتمتة على سيرفر بعنوان علني، أي موقع أو نموذج برّا جهازك بيقدر يبعت لك. ولهالسبب، الـWebhook المكشوف لازم يتحمى بمفتاح أو ترويسة سرية. بنأجل الموضوع للدرس السابع.

فحص سريع

مستند الدرس

انسخ هالخلاصة لملاحظاتك، أو اطبعها من مستند المنهج الكامل.

احفظ كـPDF

وصلات ذات صلة: مسار الأتمتة · مشروع ربط نموذج طلبات · قاموس الفريلانس · أخطاء الأتمتة القاتلة

التالي