**מ**

מדריך - בניית רובוט הנשלט מרחוק באמצעות ESP32, Firebase ואפליקציית ווב

בפרויקט זה נבנה רובוט הנשלט מרחוק מכל מקום בעולם, באמצעות בקר ESP32 , שירות הענן Firebase של גוגל ואפליקציית ווב פשוטה.
השיטה מתאימה למשתמשים בעלי ניסיון בסיסי בעבודה עם Arduino ואינה דורשת שינויי הגדרות בנתב, התקנת תוכנות נוספות או שימוש בשירותים בתשלום.

ניתן להשתמש בטכניקות שיתוארו במדריך זה, גם לפרויקטים אחרים שאינם רובוטים, כגון הפעלה של אורות או מזגן כאשר אתם מחוץ לבית.

מדריך זה כתוב בשיטת ה"שכבות" , כלומר כל דוגמא מוסיפה משהו על הדוגמא שלפניה, והדוגמא האחרונה היא הפרויקט המלא. מומלץ לעשות את התהליך המלא כיוון שיש לפרויקט הרבה חלקים, ובדרך זו אם תיתקעו בשלב כלשהו יהיה הרבה יותר קל למצוא את מקור הבעיה.

שלב 1 – הקמת שירות ענן

1. ניצור פרויקט חדש ב-Firebase באמצעות חשבון גוגל (חינם וללא צורך בכרטיס אשראי).
2. נגדיר שם לפרויקט ונאשר את יצירתו.
3. נבחר בשירות Realtime Database לזרימת נתונים מהירה.
4. ניצור מסד נתונים חדש במצב Test Mode שיאפשר גישה חופשית (לא מאובטחת!) למסד המידע שלנו משך חודש .
5. נשמור בצד את קישור ה Database (URL) על ידי לחיצה על האייקון של שרשרת (לא העתקה של הטקסט שמופיע על המסך!)
6. ניגש לתפריט בקרת גישה Authentication , ניגש לתפריט sign-in method ונפעיל את האפשרות לגישה עבור משתמש אנונימי
7. ניגש להגדרות הפרויקט ע"י לחיצה על גלגל השינייים ו-project settings, נעתיק את מפתח הגישה Web API key. ונשמור בצד

אזהרה – הפרויקט כרגע לא מאובטח כלל! כל מי שימצא את הפרטים ששמרתם בצד יוכל לגשת למסד המידע, לצפות בו ולשנות את המידע. אבל, לא ניתן לחסום לכם את הגישה, שינוי פרטי הגישה נעשה רק בעזרת חשבון הגוגל שלכם. בהמשך נרחיב כיצד להגדיר גישה באמצעות שם משתמש וסיסמה לצורך שיפור רמת האבטחה.

שלב 2 – חיבור ESP32 לשירות ענן

1. נשתמש בלוח ESP32 בסביבת הפיתוח Arduino IDE ניתן גם להשתמש בסביבת platformIO חלק מהדוגמאות כוללות קוד גם לסביבה זו.
2. נתקין ספריית Firebase דרך Library Manager.. לפרויקט זה השתמשתי בספריה בשם Firebase Arduino Client Library for ESP8266 and ESP32 by Mobizt גרסא 4.4.9
3. נטען דוגמת קוד קיימת של חיבור ל-Realtime Database עם גישה אנונימית – Examples🡪Authentications🡪SignInAsGuest🡪AnonymousSignin
4. נזין בשדות המתאימים בקוד את פרטי רשת ה Wi-Fi , את ה Database URL ואת ה- Web API Key
5. נעלה את הקוד ל-ESP32 ונבדוק באתר של Firebase כי מתבצעת קריאה וכתיבה של נתונים לדוגמה: משתנה בשם test_int

שלב 3 – פיתוח אפליקציית ווב שמתקשרת עם הענן

1. האפליקציה תפותח בשפת JavaScript ותוטמע בקובץ HTML יחיד כך שניתן לפתוח אותו בכל דפדפן כאפליקציית WEB או שאפשר להעלותו ישירות לאחסון ברשת.

אזהרה – קובץ הקוד של האפליקציה כולל את המפתחות הסודיים שיאפשרו לכל אחד לגשת למסד המידע שלכם, לצפות במידע, לעשות נזק ואפילו לגרום לגבייה של תשלום אם הזנתם כרטיס אשראי.

1. באפליקציה נרצה שיהיו כמה לחצנים , שלחיצה על כל אחד מהם תגרום לעדכון משתנים ב-Realtime Database . כמו כן משהו שיוכל לקרוא נתון פשוט מהרובוט ולהציג אותו. במקרה זה בחרתי משהו פשוט מאוד - לחצן שמחליף את הטקסט והצבע שלו בהתאם למשתנה שנקרא status.
2. נשתמש במודל שפה - לדוגמה ChatGPT או Claude , ליצירת קוד בסיסי לאפליקציה. אני כתבתי את הפרומפט הבא-

i

Create a complete HTML file with embedded JavaScript for a Firebase application. The app should have multiple buttons that update different parameters in a Firebase Realtime Database. Include the following features:
1. Firebase initialization with configuration placeholders
2. 3 Buttons, when each button is clicked, a parameter in the database is given a different value
3. Basic status display that is determined by reading value of a variable in the database
4. Simple, clean CSS styling
5. All code should be self-contained in a single HTML file
6. Use Firebase v9 syntax with module imports from CDN

1. כאשר נקבל את התוצאה, נשמור את קובץ ה HTML שהתקבל, ונערוך בו את פרטי הקישור Database URL וה-Web API Key . נלחץ על הקובץ כדי לפתוח אותו בדפדפן.
2. נבדוק באתר firebase שהאפליקציה מעדכנת נתונים , ושאם מעדכנים נתון ב-Firebase שהאפליקציה מאזינה לו, הוא משתקף באפליקציה

שלב 4 – בדיקת תקשורת בזמן אמת בין הרובוט לאפליקציה

1. כדי לאפשר תגובה מיידית ללחיצות, נשתמש בפונקצייתStream של Firebase, המאזינה לשינויים בזמן אמת.

2. בסביבת ארדואינו נפתח דוגמה STEP_2_simple_test אשר עושה שימוש ב-Stream. קוד זה מבוסס על הדוגמא - Examples🡪RTDB🡪DataChangesListener🡪Callback

3. נוודא שכאשר לוחצים על לחצנים באפליקציה, המשתנים בענן מתעדכנים ,והבקר מדפיס את המספר המתאים לכפתור שלחצנו. אם הצלחתם, כרגע יצרתם תקשורת בסיסית בין האפליקציה שלכם לבקר ה-ESP32.

4. יש עם זה בעיה, שאם נלחץ על אותו לחצן כמה פעמים, זה לא יגרום לעדכון. כדי לשפר את זה, נוסיף מנגנון לניהול "תור" של פקודות:

   • כל לחיצה באפליקציה תשלח פקודה ל Firebase בשיטה שנקראת push , שיטה זו יוצרת עבור כל לחיצה רשומה חדשה עם מזהה ייחודי (רצף ארוך של אותיות ומספרים) . אם תבדקו בקוד האפליקציה שבדוגמאות, ניתן לראות בשורה 31 הפקודה התחלפה מ-set בדוגמא שלב 2 ל-push בשלב 3.
   • לאחר ביצוע הפקודה, ה-ESP32 ימחק את הרשומה המתאימה.

5. נוסיף מנגנון בקרת כניסה למסד המידע שלנו, לשיפור האבטחה:

   • בתפריט הגדרות גישה Authentication ניכנס לתפריט sign in method ונפעיל שיטת Email/Password
   • ניתן לייצר ולשנות משתמשים וסיסמאות דרך תפריט users. כתובת המייל לא צריכה להיות אמיתית.
   • א

   שלב 5 – בניית הרובוט והפעלה שלב 5 – בניית הרובוט והפעלה

   1. גוף הרובוט נבנה בהדפסה תלת-ממד על בסיס פרויקט SMARS מאתר שיתוף קבצי הדפסת תלת מימד.
   2. הבקר שנבחר לפרויקט הוא XIAO ESP32-S3 Sense כיוון שהוא קטן, כולל מצלמה ומיקרופון מובנים וחיבור שמאפשר פעולה על סוללת ליתיום וגם טעינה של הסוללה.
   3. רכיבים נוספים:
      • שני מנועי DC זעירים עם גיר מסוג N20
      • מגבר H-bridge כפול לשני מנועים, במקרה זה L9110 אבל אפשר להשתמש באחרים כגון L298
   4. הרכבה:
      • חיבור גלגלים ומנועים על גוף הרובוט
      • חיבור המנועים למגבר
      • חיבור הבקר למגבר המנועים וחיבור הסוללה (ע"פ שרטוט החיבורים)
   5. נצרוב את קוד בתיקייה STEP_3_queue_no_image לבקר – הקוד מאזין לפקודות ב-Firebase, מזיז את המנועים חצי שנייה עבור כל לחיצה, ומעדכן את הסטטוס (idle/running). קוד זה מתאים גם אם יש לכם בקר ללא מצלמה. כאשר פותחים את האפליקציה בדפדפן או עושים refresh, האפליקציה תעדכן את הסטטוס ל-offline, והרובוט יעדכן את הסטטוס ל-idle כל כמה שניות, גם כאשר הוא לא מקבל פקודות. באופן זה ניתן לדעת שהרובוט תקין ומוכן לנסיעה.
   6. הוספת שידור תמונות מהמצלמה לאפליקציה דרך הענן:
      • נצרוב את הקוד בתיקייה STEP_4_queue_with_camera, קוד זה כולל צילום תמונה מהמצלמה ושליחתה ל-Firebase.
      • המצלמה יודעת גם לדחוס את התמונה, מה שמאפשר לנו לקבל תמונה יחסית קטנה – סביבות 9kB. ניתן לשלוט על איכות התמונה ורמת הדחיסה ע"י פרמטרים בקוד:
        • הפרמטר config.jpeg_quality קובע את רמת הדחיסה 0-63, גבוה יותר יהיה דחוס יותר
        • הפרמטר config.frame_size קובע את גודל התמונה בפיקסלים
        • שינוי פרמטרים אלה ישפיע על גודל הקובץ וקצב העדכון (התוצאות שלי הן 1–2 פריימים לשנייה באיכות QVGA ורמת דחיסה 30).
      • לצורך העלאה היה צורך להמיר את קובץ התמונה למשהו שנקרא בסיס 64, כדי לעמוד בסטנדרטים של Firebase. זאת כיוון שאנחנו עושים פה קצת "רמאות" ומעלים את התמונה כמחרוזת, וקובץ התמונה כולל תווים שאינם נחשבים טקסט.
      • הרובוט מחובר לענן, נשלט מהאפליקציה בזמן אמת, ומספק שידור תמונה חיה.