- מה זה AJAX?
- איך AJAX עובד?
- רכיבים נדרשים לבניית שרת האינטרנט מבוסס AJAX ו- ESP8266
- שרת האינטרנט של Ajax ו- ESP8266 - דיאגרמת מעגלים
- קוד שרת אינטרנט מבוסס AJAX עבור ESP8266
ביישומי IoT רבים, ישנם מצבים בהם נתוני החיישנים צריכים לעקוב באופן רציף, והדרך הפשוטה ביותר לעשות זאת היא על ידי הפעלת שרת אינטרנט ESP8266 המשרת דף אינטרנט HTML; אך הבעיה במתודולוגיה זו היא שיש לרענן את דפדפן האינטרנט במרווח זמן מסוים כדי לקבל נתוני חיישנים מעודכנים. זה לא רק לא יעיל אלא לוקח הרבה מחזורי שעון שבהם ניתן לבצע משימות אחרות. הפתרון לבעיה זו מכונה "JavaScript אסינכרוני ו- XML" או בקיצור AJAX. באמצעות AJAX, אנו יכולים לפקח על נתונים בזמן אמת מבלי לרענן את כל דף האינטרנט, זה לא רק חוסך זמן, אלא גם חוסך מחזורי שעון יקרים. עקוב אחר המאמר ובמאמר זה תלמד כיצד ליישם שרת אינטרנט מבוסס AJAX ב- ESP8266.
מה זה AJAX?
כפי שדברנו קודם, AJAX מייצג "JavaScript אסינכרוני ו- XML" אשר ניתן להשתמש בהם לעדכון חלק מדף האינטרנט מבלי לטעון מחדש את דף ה- entail. היא עושה זאת על ידי בקשה וקבלת נתונים מהשרת באופן ספונטני. הפונקציה של AJAX היא לעדכן תוכן אינטרנט בצורה אסינכרונית. המשמעות היא שדפדפן האינטרנט של המשתמש אינו צריך לרענן דף אינטרנט שלם כאשר רק חלק מהתוכן בדף צריך לעדכן.
דוגמה יומיומית ל- AJAX תהיה תכונת ההצעות של גוגל, כאשר אנו מקלידים בשורת החיפוש של גוגל, גוגל מתחילה להציע מחרוזות חיפוש קשורות. במהלך תהליך זה, דף האינטרנט לא נטען מחדש, אך המידע שצריך לשנות מתעדכן ברקע באמצעות AJAX.
איך AJAX עובד?
AJAX פשוט משתמשת בשילוב של-
- XML (שפת סימון ניתנת להרחבה)
- JavaScript ו- HTML
- XML (שפת סימון ניתנת להרחבה):
XML היא שפת סימון. XML משמש בעיקר לקבלת נתוני שרת בפורמט ספציפי. למרות שהוא יכול לקבל נתונים בצורה של טקסט רגיל. כאשר משתמש מבקר בדף אינטרנט ואירוע מתרחש, במקרה שלנו מדובר ב"לחיצה על כפתור ", JavaScript יוצר אובייקט XMLHttpRequest, ואז מעביר מידע בפורמט XML בין דפדפן אינטרנט לשרת אינטרנט. האובייקט XMLHttpRequest שולח בקשה לנתוני עמוד מעודכנים לשרת האינטרנט, השרת מעבד את הבקשה, תגובה נוצרת בצד השרת ונשלחת חזרה לדפדפן, ואז משתמש ב- JavaScript כדי לעבד את התגובה ולהציג אותה בדף האינטרנט..
- JavaScript ו- HTML:
JavaScript מבצע את תהליך העדכון ב- AJAX. הבקשה לתוכן מעודכן מעוצבת ב- XML כדי להבינה, ו- JavaScript מרענן את התוכן עבור המשתמש הצופה בדף המעודכן.
AJAX עובד:
כפי שמוצג בתרשים לעיל, לבקשת AJAX, הדפדפן שולח XMLHttpRequest לשרת באמצעות javascript. אובייקט זה כולל נתונים המספרים לשרת מה מבוקש. השרת מגיב רק עם הנתונים שהתבקשו מצד הלקוח. ואז הדפדפן מקבל את הנתונים, מעדכן רק את החלק של הדף שצריך לעדכן במקום לטעון מחדש את כל דף האינטרנט.
רכיבים נדרשים לבניית שרת האינטרנט מבוסס AJAX ו- ESP8266
כשאנחנו בונים את הפרויקט כדי להדגים את היכולת של esp8266 להתמודד עם AJAX, דרישת הרכיב מאוד זעירה, אתה יכול למצוא את רוב אלה בחנות התחביבים המקומית שלך.
- NodeMCU X 1
- חיישן טמפרטורה LM35 X 1
- נורית X 1
- לוח לחם X 1
- מגשרים X 4
- כבל תכנות X 1
שרת האינטרנט של Ajax ו- ESP8266 - דיאגרמת מעגלים
תרשים המעגל עבור שרת האינטרנט מבוסס AJAX מוצג להלן.
מכיוון שהמעגל פשוט מאוד, אין הרבה מה להסביר עליו. חיברנו נורית LED עם נגן הגבלת זרם של 150 אוהם לסיכה D0 של ה- ESP8266, כפי שתראה, נוכל להחליף אותה באמצעות שרת האינטרנט. לאחר מכן, יש לנו את חיישן הטמפרטורה LM35 שלנו דרכו נקרא את ערך הטמפרטורה ונעדכן אותו לדף האינטרנט. חיישן הטמפרטורה מופעל ממעקה 3.3V, וכיוון שה- LM35 הוא חיישן אנלוגי, השתמשנו בסיכה A0 של לוח ESP8266 למדידת הנתונים. אם נתקלת בחיישן הטמפרטורה LM35 בפעם הראשונה, או אם ברצונך ללמוד עוד על חיישן קטן ומגניב זה, תוכל לבדוק את ההודעה הקודמת שלנו על מדחום דיגיטלי באמצעות NodeMCU ו- LM35, שם דנו בעבודה של חיישן זה ב פרט.
קוד שרת אינטרנט מבוסס AJAX עבור ESP8266
לפני שנמשיך הלאה, בואו נצלול היישר לתוכנית כדי להבין כיצד שרת האינטרנט NodeMCU שלנו יעבוד. אך לפני כן, אנא ודא שיש לך את ההתקנה של Arduino IDE עבור ESP8266, אם אין לך את ההתקנה, אתה יכול לעקוב אחר החלק הבא, אחרת אתה יכול פשוט לדלג על החלק הזה. אם אתה מעוניין ללמוד עוד על שרת אינטרנט ופרויקטים מבוססי IoT, תוכל לבדוק את הפוסט הקודם שבו דנו