جدول المحتويات:

أتمتة المنزل باستخدام البوابة المقيدة: 9 خطوات
أتمتة المنزل باستخدام البوابة المقيدة: 9 خطوات

فيديو: أتمتة المنزل باستخدام البوابة المقيدة: 9 خطوات

فيديو: أتمتة المنزل باستخدام البوابة المقيدة: 9 خطوات
فيديو: في خطوات عملية - حول بيتك (سمارت هوم) بنفسك! 2024, شهر نوفمبر
Anonim
أتمتة المنزل باستخدام بوابة مقيدة
أتمتة المنزل باستخدام بوابة مقيدة
أتمتة المنزل باستخدام بوابة مقيدة
أتمتة المنزل باستخدام بوابة مقيدة
أتمتة المنزل باستخدام بوابة مقيدة
أتمتة المنزل باستخدام بوابة مقيدة

هنا ، سننشئ مشروعًا مثيرًا للاهتمام لأتمتة المنزل المبني على Captive Portal باستخدام nodeMCU من البداية.. فلنبدأ..

الخطوة الأولى: الإقرارات الأولية

الإقرارات الأولية
الإقرارات الأولية

قم بتعريف دبابيس الإدخال والإخراج الخاصة بـ nodeMCU لتنفيذ الإجراء وملفات الرأس والرمز لإنشاء خادم DNS.. يظهر في الصورة..

الخطوة 2: كود Html للواجهة الأمامية بمعنى. صفحة تسجيل الدخول

كود Html للواجهة الأمامية بمعنى. صفحة تسجيل الدخول
كود Html للواجهة الأمامية بمعنى. صفحة تسجيل الدخول

كما هو موضح في الصورة ، قم بتعريف كود html داخل متغير سلسلة نرسله إلى المستخدم النهائي للتحقق من رمز الوصول.

* للقبض على البيانات التي أدخلها المستخدم هنا ، نستخدم جزء الارتساء وعلامة href

* تُستخدم علامة Anchor بشكل أساسي لإضافة صفحة ويب أخرى داخل صفحة الويب وتحدد علامة href وجهة الارتباط.

* ولكن ، هنا نستقبل البيانات التي أدخلها المستخدم في حقل رمز الوصول من خلال Anchor Pane وعلامة href …

كيف ، سوف أذكر طريقتين لالتقاط المدخلات من واجهة الويب إلى نهاية المبرمجين لدينا..

الخطوة 3: استخدام طرق WebServer.arg () و WebServer.on ()

استخدام طرق WebServer.arg () و WebServer.on ()
استخدام طرق WebServer.arg () و WebServer.on ()
استخدام طرق WebServer.arg () و WebServer.on ()
استخدام طرق WebServer.arg () و WebServer.on ()

كما ذكرت في الخطوة السابقة سأخبرك بطريقتين مختلفتين..

1) باستخدام طريقة () webServer.arg:

هنا ، نحدد سمة ضبط تلقائي للصورة مع العنصر كما هو موضح في الصورة ،

ما يفعله ضبط تلقائي للصورة هو أنه سمة منطقية عندما يكون صحيحًا يعني تقديم يضمن تركيز عنصر الإدخال عند تحميل الصفحة.

ثم نسمي طريقة args () على كائن الخادم. ستعيد هذه الطريقة عدد معلمات الاستعلام التي تم تمريرها على HTTP وتطبيق العبارات الشرطية لتنفيذ الإجراءات وفقًا لذلك.

2) عن طريق استخدام و href سمة:

هنا ، نحدد عناصر التحكم الخاصة بنا (مثل الأزرار) داخل ونخصص سلسلة ، حرف ، رابط تريد التحقق من صحته باستخدام العبارات الشرطية ثم نسمي webServer.on () لاستلام المدخلات للتحقق من الصحة.

كما هو موضح..

الخطوة 4: إذا كان نوع بيانات الاعتماد خاطئة

إذا كانت بيانات اعتماد أنواع المستخدم خاطئة
إذا كانت بيانات اعتماد أنواع المستخدم خاطئة

ما فعلته ، ما عليك سوى تغيير رمز صفحة تسجيل الدخول الموجود وإضافة عنوان جديد لإعلام المستخدم بإدخال بيانات اعتماد خاطئة..

تحقق أولاً من بيانات الاعتماد إذا كانت خاطئة وجّه المستخدم إلى صفحة تسجيل دخول معدلة جديدة تعرض رسالة خطأ.

كما هو موضح..

الخطوة 5: كيفية إضافة صورة إلى صفحة الويب الخاصة بك

كيفية إضافة صورة إلى صفحة الويب الخاصة بك
كيفية إضافة صورة إلى صفحة الويب الخاصة بك

إنه أمر بسيط للغاية ، لأننا هنا لا نخزن صورنا في مخزن فعلي حتى نوفر مسارًا لجلب تلك الصورة التي نقوم بها عادةً في حالة صفحة html.

لذا فإن ما نقوم به هو ببساطة تحويل صورنا إلى base64 ولصقها في كود صفحتنا كما هو موضح..

الخطوة 6: ما المكونات التي نحتاجها

1) - nodeMCU

2) - Arduino IDE لفلاش nodeMCU

3) - أسلاك توصيل (F-2-F)

4) وحدة الترحيل

5) - هاتف ذكي أو كمبيوتر محمول يدعم WiFi للاختبار

الخطوة 7: التوصيلات

روابط
روابط

أضف وحدة الترحيل إلى دبابيس الإدخال / الإخراج المعلنة في الكود.

قم بتوصيل ريلاي بالأجهزة الكهربائية التي تريد التحكم فيها كما هو موضح بالصورة..

الخطوة 8: الآن اختبر واستمتع

الآن جرب واستمتع
الآن جرب واستمتع
الآن جرب واستمتع
الآن جرب واستمتع
الآن جرب واستمتع
الآن جرب واستمتع
الآن جرب واستمتع
الآن جرب واستمتع

الخطوة 9: الكود هنا

من فضلك اكتب تعليقاتك القيمة..

موصى به: