يتم التحكم في التشغيل الآلي للمنزل على أساس إنترنت الأشياء باستخدام Raspberry Pi

مرحبًا يا شباب ، مرحبًا بكم في البرنامج التعليمي اليوم ، أحد الأشياء الجيدة حول Raspberry Pi هو القدرة الكبيرة والسهولة التي يمنحك بها الفرصة لتوصيل الأجهزة بالإنترنت خاصةً للمشاريع المتعلقة بأتمتة المنازل. سنقوم اليوم باستكشاف إمكانية التحكم في أجهزة التيار المتردد بنقرة زر واحدة على صفحة ويب باستخدام الإنترنت. باستخدام نظام أتمتة المنزل القائم على إنترنت الأشياء ، يمكنك التحكم في أجهزتك المنزلية من أي مكان في العالم. يمكن تشغيل خادم الويب هذا من أي جهاز يمكنه تشغيل تطبيقات HTML ، مثل الهواتف الذكية والجهاز اللوحي والكمبيوتر وما إلى ذلك.

المكونات المطلوبة:

بالنسبة لهذا المشروع ، ستندرج المتطلبات ضمن فئتين ، الأجهزة والبرامج:

1. متطلبات الأجهزة:

Raspberry Pi 3 (أي إصدار آخر سيكون رائعًا)
بطاقة ذاكرة 8 أو 16 جيجا تعمل بنظام Raspbian Jessie
مرحلات 5 فولت
2n222 الترانزستورات
الثنائيات
أسلاك توصيل
كتل الاتصال
المصابيح المراد اختبارها.
مصباح التيار المتردد للاختبار
الكابلات اللوح والطائر
220 أو 100 أوم المقاوم

II. متطلبات البرنامج:

إلى جانب نظام التشغيل Raspbian Jessie الذي يعمل على raspberry pi ، سنستخدم أيضًا إطار عمل WebIOPi ، ويعمل notepad ++ على جهاز الكمبيوتر الخاص بك و filezila لنسخ الملفات من جهاز الكمبيوتر إلى raspberry pi ، وخاصة ملفات تطبيقات الويب.

كما أنك لست بحاجة إلى كتابة التعليمات البرمجية بلغة Python لمشروع أتمتة المنزل هذا ، فإن WebIOPi ستقوم بكل العمل.

تحضير Raspberry Pi:

إنها عادة من نوع ما بالنسبة لي وأعتقد أنها جيدة ، أول شيء أفعله في كل مرة أرغب في استخدام Raspberry Pi هو تحديث PI. بالنسبة لهذا المشروع ، سيتألف هذا القسم من إجراءات تحديث Pi وتثبيت إطار عمل WebIOPi الذي سيساعدنا في التعامل مع الاتصال من صفحة الويب إلى raspberry pi. ربما يجب أن أذكر أنه يمكن القيام بذلك أيضًا بطريقة أسهل يمكن القول عنها باستخدام عمل إطار Python Flask ، لكن أحد الأشياء المثيرة للاهتمام حول DIY هو عندما تلقي نظرة تحت الغطاء وتقوم بالعمل الصعب. هذا حيث يأتي كل فرحة DIY.

ل تحديث بي التوت أدناه الأوامر ومن ثم إعادة تشغيل RPI.

sudo apt-get update sudo apt-get Upgrade sudo reboot

بعد القيام بذلك ، الشيء التالي بالنسبة لنا هو تثبيت إطار عمل webIOPi.

تأكد من أنك في الدليل الرئيسي باستخدام ؛

مؤتمر نزع السلاح ~

استخدم wget للحصول على الملف من صفحة sourceforge الخاصة بهم ؛

wget

عند انتهاء التنزيل ، استخرج الملف وانتقل إلى الدليل ؛

tar xvzf WebIOPi-0.7.1.tar.gz cd WebIOPi-0.7.1 /

في هذه المرحلة قبل تشغيل الإعداد ، نحتاج إلى تثبيت تصحيح لأن هذا الإصدار من WebIOPi لا يعمل مع raspberry pi 3 الذي أستخدمه ولم أتمكن من العثور على إصدار من WebIOPi يعمل صراحةً مع Pi 3.

تُستخدم الأوامر أدناه لتثبيت التصحيح بينما لا تزال في دليل WebIOPi ، قم بتشغيل ؛

wget https://raw.githubusercontent.com/doublebind/raspi/master/webiopi-pi2bplus.patch patch -p1 -i webiopi-pi2bplus.patch

ثم يمكننا تشغيل تثبيت الإعداد لـ WebIOPi باستخدام ؛

sudo./setup.sh

استمر في قول نعم إذا طُلب منك تثبيت أي تبعيات أثناء تثبيت الإعداد. عند الانتهاء ، أعد تشغيل جهاز pi ؛

sudo إعادة التشغيل

اختبار تثبيت WebIOPi:

قبل القفز إلى المخططات والرموز ، مع إعادة تشغيل Raspberry Pi ، سنحتاج إلى اختبار تثبيت WebIOPi الخاص بنا للتأكد من أن كل شيء يعمل بشكل جيد كما هو مطلوب.

قم بتشغيل الأمر ؛

sudo webiopi -d -c / etc / webiopi / config

بعد إصدار الأمر أعلاه على pi ، قم بتوجيه متصفح الويب لجهاز الكمبيوتر الخاص بك المتصل بـ raspberry pi إلى http: // raspberrypi. mshome.net:8000 or http؛ // thepi'sIPaddress: 8000. سيطالبك النظام باسم المستخدم وكلمة المرور.

اسم المستخدم هو webiopi كلمة المرور هي توت العليق

يمكن إزالة تسجيل الدخول هذا لاحقًا إذا رغبت في ذلك ، ولكن حتى نظام التشغيل الآلي للمنزل الخاص بك يستحق بعض المستوى الإضافي من الأمان لمنع أي شخص لديه أجهزة التحكم في IP وأجهزة IOT في منزلك.

بعد تسجيل الدخول ، انظر حولك ، ثم انقر على رابط رأس GPIO.

بالنسبة لهذا الاختبار ، سنقوم بتوصيل مؤشر LED بـ GPIO 17 ، لذا استمر وقم بتعيين GPIO 17 كإخراج.

بعد الانتهاء من ذلك ، قم بتوصيل المصباح بـ raspberry pi كما هو موضح في المخططات أدناه.

بعد الاتصال ، ارجع إلى صفحة الويب وانقر على زر الدبوس 11 لتشغيل أو إيقاف تشغيل LED. بهذه الطريقة يمكننا التحكم في Raspberry Pi GPIO باستخدام WebIOPi.

بعد الاختبار ، إذا كان كل شيء يعمل كما هو موصوف ، فيمكننا العودة إلى المحطة وإيقاف البرنامج باستخدام CTRL + C. إذا كانت لديك أي مشكلة في هذا الإعداد ، فاضغط علي عبر قسم التعليقات.

يمكن العثور على مزيد من المعلومات حول Webiopi على صفحة Wiki الخاصة به (http://webiopi.trouch.com/INSTALL.html)

مع اكتمال الاختبار ، نكون جاهزين لبدء المشروع الرئيسي.

بناء تطبيق الويب لـ Raspberry Pi Home Automation:

سنقوم هنا بتحرير التكوين الافتراضي لخدمة WebIOPi وإضافة الكود الخاص بنا ليتم تشغيله عند الاتصال. أول شيء سنفعله هو الحصول على filezilla أو أي برنامج نسخ FTP / SCP مثبت على جهاز الكمبيوتر الخاص بنا. ستوافقني على أن الترميز على pi عبر الجهاز أمر مرهق للغاية ، لذا فإن برنامج filezilla أو أي برنامج SCP آخر سيكون مفيدًا في هذه المرحلة. قبل أن نبدأ في كتابة أكواد النصوص البرمجية html و css و java لتطبيق ويب أتمتة المنزل IoT هذا ونقلها إلى Raspberry Pi ، دعنا ننشئ مجلد المشروع حيث ستكون جميع ملفات الويب الخاصة بنا.

تأكد من أنك في الدليل الرئيسي باستخدام ، ثم أنشئ المجلد ، وانتقل إلى المجلد الذي تم إنشاؤه وأنشئ مجلد html في الدليل:

cd ~ mkdir webapp cd webapp mkdir html

قم بإنشاء مجلد للبرامج النصية و CSS والصور داخل مجلد html

mkdir html / css mkdir html / img mkdir html / scripts

من خلال إنشاء ملفاتنا ، ننتقل إلى كتابة الرموز على جهاز الكمبيوتر الخاص بنا ومن ثم الانتقال إلى Pi عبر filezilla.

كود JavaScript:

الجزء الأول من الكود الذي سنكتبه هو جزء جافا سكريبت. إنه نص بسيط للتواصل مع خدمة WebIOPi.

من المهم ملاحظة أنه بالنسبة لهذا المشروع ، سيتألف تطبيق الويب الخاص بنا من أربعة أزرار ، مما يعني أننا نخطط للتحكم في أربعة دبابيس GPIO فقط ، على الرغم من أننا سنتحكم في مرحلتيْن فقط في العرض التوضيحي الخاص بنا. تحقق من الفيديو الكامل في النهاية.

webiopi (). ready (function () {webiopi (). setFunction (17، "out")؛ webiopi (). setFunction (18، "out")؛ webiopi (). setFunction (22، "out")؛ webiopi ().setFunction (23، "out")؛ var content، button؛ content = $ ("# content")؛ button = webiopi (). createGPIOButton (17، "Relay 1")؛ content.append (button) ؛ button = webiopi (). createGPIOButton (18، "Relay 2")؛ content.append (زر) ؛ زر = webiopi (). createGPIOButton (22، "Relay 3")؛ content.append (زر)؛).createGPIOButton (23 ، "Relay 4") ؛ content.append (زر) ؛}) ؛

يعمل الكود أعلاه عندما يكون WebIOPi جاهزًا.

أدناه شرحنا كود JavaScript:

webiopi (). ready (function (): هذا فقط يوجه نظامنا لإنشاء هذه الوظيفة وتشغيلها عندما يكون webiopi جاهزًا.

webiopi (). setFunction (23، "out") ؛ يساعدنا هذا في إخبار خدمة WebIOPi بتعيين GPIO23 كإخراج. لدينا أربعة أزرار هنا ، يمكنك الحصول على المزيد منها إذا كنت تقوم بتنفيذ المزيد من الأزرار.

محتوى فار ، زر ؛ يخبر هذا الخط نظامنا بإنشاء متغير باسم المحتوى وجعل المتغير زرًا.

المحتوى = $ ("# محتوى") ؛ سيظل متغير المحتوى قيد الاستخدام عبر html و css. لذلك عندما نشير إلى #content ، فإن إطار عمل WebIOPi ينشئ كل شيء مرتبط به.

button = webiopi (). createGPIOButton (17، "Relay 1") ؛ يمكن لـ WebIOPi إنشاء أنواع مختلفة من الأزرار. يساعدنا جزء الكود أعلاه في إخبار خدمة WebIOPi بإنشاء زر GPIO الذي يتحكم في دبوس GPIO في هذه الحالة 17 المسمى "Relay 1". الشيء نفسه ينطبق على الآخرين.

content.append (زر) ؛ قم بإلحاق هذا الرمز بأي رمز آخر للزر الذي تم إنشاؤه إما في ملف html أو في مكان آخر. يمكن إنشاء المزيد من الأزرار وستكون جميعها لها نفس خصائص هذا الزر. هذا مفيد بشكل خاص عند كتابة CSS أو Script.

بعد إنشاء ملفات JS ، نقوم بحفظها ثم نسخها باستخدام filezilla إلى webapp / html / scripts إذا قمت بإنشاء ملفاتك بنفس الطريقة التي قمت بها.

بعد ذلك ، ننتقل إلى إنشاء CSS. يمكنك تنزيل الكود بالكامل من الرابط الوارد في قسم الرمز في النهاية.

كود CSS:

يساعدنا CSS في جعل صفحة ويب أتمتة المنزل IoT Raspberry Pi تبدو جميلة.

كنت أرغب في أن تبدو صفحة الويب مثل الصورة أدناه ، وبالتالي كان علي كتابة ورقة أنماط smarthome.css لتحقيق ذلك.

أدناه شرحنا رمز CSS:

يبدو نص CSS ضخمًا جدًا بحيث لا يمكن تضمينه هنا ، لذا سأختار جزءًا منه وأستخدمه في الانهيار. يمكنك تنزيل ملف CSS الكامل من هنا. CSS سهل ويمكنك فهمه فقط من خلال تصفح كود CSS. يمكنك بسهولة فك هذا الجزء واستخدام كود CSS الخاص بنا على الفور.

يمثل الجزء الأول من البرنامج النصي ورقة الأنماط الخاصة بجسم تطبيق الويب كما هو موضح أدناه ؛

الجسم {لون الخلفية: #ffffff؛ صورة الخلفية: url ('/ img / smart.png') ؛ تكرار الخلفية: لا تكرار ؛ موضع الخلفية: المركز ؛ حجم الخلفية: غطاء ؛ الخط: غامق 18 بكسل / 25 بكسل Arial ، sans-serif ؛ اللون: LightGray ؛ }

أريد أن أصدق أن الكود أعلاه لا يحتاج إلى شرح ، فقمنا بتعيين لون الخلفية كـ #ffffff وهو أبيض ، ثم نضيف صورة خلفية موجودة في موقع المجلد هذا (هل تذكر إعداد المجلد السابق؟) ، ونضمن أن الصورة ليست ' ر كرر عن طريق تعيين خاصية تكرار الخلفية على عدم التكرار ، ثم قم بتوجيه CSS لتركيز الخلفية. ثم ننتقل لتعيين حجم الخلفية والخط واللون.

بعد الانتهاء من الجسم ، كتبنا css للأزرار لتبدو جميلة.

زر {عرض: كتلة ؛ الموقف: نسبي ؛ الهامش: 10 بكسل ؛ الحشو: 0 10 بكسل ؛ محاذاة النص: مركز ؛ زخرفة النص: لا شيء ؛ العرض: 130 بكسل ؛ الارتفاع: 40 بكسل ؛ الخط: غامق 18 بكسل / 25 بكسل Arial ، sans-serif ؛ لون أسود؛ ظل النص: 1px 1px 1px rgba (255255255 ،.22) ؛ -webkit-border-radius: 30px ؛ -moz-border-radius: 30px ؛ نصف قطر الحدود: 30 بكسل ؛

لإبقاء هذا موجزًا ، تم عمل كل شيء آخر في الكود أيضًا لجعله يبدو جيدًا. يمكنك تغييرها لترى ما يحدث ، أعتقد أنه يسمى التعلم من خلال التجربة والخطأ ولكن الشيء الجيد الوحيد في CSS هو التعبير عن الأشياء بلغة إنجليزية بسيطة مما يعني أنه من السهل جدًا فهمها. يحتوي الجزء الآخر من مجموعة الأزرار على بعض الإضافات لظل النص على الزر وظل الزر. كما أن لها تأثير انتقال طفيف يساعدها على أن تبدو جميلة وواقعية عند الضغط على الزر. يتم تحديدها بشكل منفصل لـ webkit و Firefox و Opera وما إلى ذلك فقط لضمان أداء صفحة الويب على النحو الأمثل عبر جميع الأنظمة الأساسية.

الكتلة التالية من التعليمات البرمجية مخصصة لخدمة WebIOPi لإخبارها أن هذا إدخال لخدمة WebIOPi.

ط nput {عرض: كتلة. العرض: 160 بكسل ؛ الارتفاع: 45 بكسل ؛ }

آخر شيء نريد القيام به هو إعطاء نوع من الإشارة عند الضغط على الزر. لذا يمكنك إلقاء نظرة على الشاشة ويتيح لك لون الأزرار معرفة الحالة الحالية. للقيام بذلك ، تم تنفيذ سطر الكود أدناه لكل زر واحد.

# gpio17.LOW {لون الخلفية: رمادي ؛ لون أسود؛ } # gpio17.HIGH {لون الخلفية: أحمر؛ اللون: LightGray. }

سطور الرموز أعلاه تغير ببساطة لون الزر بناءً على حالته الحالية. عندما يكون الزر مغلقًا (منخفض) ، يصبح لون خلفية الأزرار رماديًا لإظهار أنه غير نشط وعندما يكون (مرتفعًا) في وضع التشغيل ، يصبح لون خلفية الزر أحمر.

CSS في الحقيبة ، يتيح الحفظ باسم smarthome.css ، ثم نقله عبر filezilla (أو أي برنامج SCP آخر تريد استخدامه) إلى مجلد الأنماط على raspberry pi وإصلاح القطعة النهائية ، رمز html. تذكر تنزيل CSS كامل من هنا.

كود HTML:

تقوم شفرة html بسحب كل شيء معًا ، جافا سكريبت وورقة الأنماط.

Smart Home

اضغط الزر؛ تلقي لحم الخنزير المقدد

يوجد داخل علامة الرأس بعض الميزات المهمة جدًا.

يمكّن سطر الكود أعلاه من حفظ تطبيق الويب على سطح مكتب محمول يستخدم Chrome أو Safari mobile. يمكن القيام بذلك عبر قائمة الكروم. يمنح هذا التطبيق شعوراً سهلاً بالتشغيل من سطح المكتب المحمول أو المنزل.

يعطي السطر التالي من الكود أدناه نوعًا من الاستجابة لتطبيق الويب. تمكنه من شغل شاشة أي جهاز تم إطلاقه عليه.

يعلن السطر التالي من التعليمات البرمجية العنوان الظاهر على شريط العنوان لصفحة الويب.

Smart Home

تؤدي الأسطر الأربعة التالية من الأكواد وظيفة ربط كود html بالعديد من الموارد التي يحتاجها للعمل على النحو المطلوب.

في السطر الأول فوق المكالمات إطار WebIOPi الرئيسي جافا سكريبت والذي هو الثابت تلوينها في جذر الخادم. يجب استدعاء هذا في كل مرة يتم استخدام WebIOPi.

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

يحتوي قسم النص الأساسي من كود html على علامات فاصلة لضمان محاذاة الأزرار بشكل صحيح مع السطر أدناه لإخبار كود html الخاص بنا بعرض ما هو مكتوب في ملف JavaScript. و معرف = "المحتوى" يجب أن أذكر لكم من إعلان المحتوى لزر لدينا في وقت سابق تحت شفرة جافا سكريبت.

أنت تعرف التدريبات ، كود html مثل index.html وانتقل إلى مجلد html على Pi عبر filezilla. يمكنك تنزيل جميع ملفات CSS و JS و HTML من هنا.

تعديلات خادم WebIOPi لأتمتة المنزل:

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

لتحرير التكوين ، قم بتشغيل ما يلي بإذن الجذر ؛

sudo nano / etc / webiopi / config

ابحث عن قسم http في ملف التكوين ، وتحقق من القسم الذي يوجد به شيء مثل ، #Use doc-root لتغيير موقع ملفات HTML والمورد الافتراضي

قم بالتعليق على أي شيء تحته باستخدام # ثم إذا تم إعداد مجلدك مثل المجلد الخاص بي ، فقم بتوجيه doc-root إلى مسار ملف مشروعك

doc-root = / home / pi / webapp / html

حفظ وخروج. يمكنك أيضًا تغيير المنفذ من 8000 ، في حالة وجود خادم آخر يعمل على pi باستخدام هذا المنفذ. إذا لم تقم بالحفظ والاستقالة ، فنحن نمضي قدمًا.

من المهم ملاحظة أنه يمكنك تغيير كلمة مرور خدمة WebIOPi باستخدام الأمر ؛

sudo webiopi-passwd

سيطالبك بإدخال اسم مستخدم وكلمة مرور جديدين. يمكن أيضًا إزالة هذا تمامًا ولكن الأمن مهم ، أليس كذلك؟

أخيرًا ، قم بتشغيل خدمة WebIOPi بإصدار الأمر التالي:

بدء sudo /etc/init.d/webiopi

يمكن التحقق من حالة الخادم باستخدام ؛

sudo /etc/init.d/webiopi

يمكن إيقاف تشغيله باستخدام ؛

sudo /etc/init.d/webiopi stop

لإعداد WebIOPi للتشغيل عند التمهيد ، استخدم ؛

الإعدادات الافتراضية sudo update-rc.d webiopi

إذا كنت تريد عكسه وإيقاف تشغيله عند التمهيد ، فاستخدم ؛

sudo update-rc.d webiopi إزالة

مخطط الدائرة وشرحها:

بعد الانتهاء من إعداد برنامجنا ، نحن جميعًا على استعداد لبدء إنشاء المخططات لمشروع الأجهزة المنزلية هذا الذي يتحكم فيه الويب.

بينما لم أتمكن من وضع يدي على وحدات الترحيل ، والتي أشعر أنه من الأسهل التعامل معها للهواة. لذلك أرسم هنا المخططات لمرحلات 5 فولت الفردية العادية.

قم بتوصيل دائرتك كما هو موضح في دائرة التآكل أعلاه. يجب أن تلاحظ أن COM و NO (عادةً ما تكون مفتوحة) و NC (إغلاق عادةً) الخاصة بالمرحل الخاص بك قد تكون موجودة في جوانب / نقاط مختلفة. يرجى استخدام ملليمتر لاختبارها. تعلم المزيد عن التتابع هنا.

مع توصيل مكوناتنا ، قم بتشغيل الخادم الخاص بك ، من صفحة ويب ، انتقل إلى عنوان IP الخاص بـ Raspberry Pi الخاص بك وقم بالإشارة إلى المنفذ كما هو موضح سابقًا ، وقم بتسجيل الدخول باستخدام اسم المستخدم وكلمة المرور الخاصين بك ، وسترى صفحة ويب تشبه تمامًا الصورة أدناه.

يمكنك الآن التحكم بسهولة في أربعة تطبيقات منزلية للتيار المتردد لاسلكيًا من أي مكان ، بمجرد النقر على الأزرار. سيعمل هذا من الهاتف المحمول والجهاز اللوحي وما إلى ذلك ، ويمكنك إضافة المزيد من الأزرار والمرحلات للتحكم في المزيد من الأجهزة. تحقق من الفيديو الكامل أدناه.

هذا كل شيء يا رفاق ، شكرًا للبقاء على هذا. إذا كان لديك أي أسئلة ، فقم بإسقاطها في مربع التعليقات.