Mündəricat:
- Addım 1: Nə lazımdır
- Addım 2: Arduino ID -nin hazırlanması
- Addım 3: ESP8266 -nın hazırlanması
- Addım 4: Arduino hazırlayın
- Addım 5: Hər şeyi birlikdə birləşdirin
- Addım 6: Veb səhifəsinə daxil olmaq
- Addım 7: Javascipt istifadə edin
- Addım 8: Dəstək
Video: Arduino -nu HTML/Javascript ilə idarə etməyin asan yolu: 8 addım
2024 Müəllif: John Day | [email protected]. Son dəyişdirildi: 2024-01-30 07:47
Bu təlimat, yalnız javascript funksiyalarından istifadə edərək bir adafruit Huzzahdan bir ajax zəng ilə bir arduino idarə etməyi göstərir. Əsasən javascriptdən html səhifəsində istifadə edə bilərsiniz ki, bu da ajax geri çağırışından istifadə edən sadə javascript funksiyaları ilə html interfeyslərini asanlıqla yazmağa imkan verəcəkdir. ESP8266 -nın arduino ilə ünsiyyət qurmasına icazə vermək. Buna görə, bütün sancaqlar bir JavaScript funksiyasından təyin edilə bilər. Eyni şəkildə, JavaScript funksiyasından istifadə edərək hər hansı bir pindən də dəyər oxuya bilərik. Ümid edirəm ki, bu, bir html sənədindən bir arduino idarə etməyi asanlaşdırmağa kömək edir. Orada html yaza biləcək bir çox insanın olduğunu anladım. Bir çoxu java və ya xcode və ya başqa bir çərçivə ilə bir cib telefonu tətbiq etməkdə çətinlik çəkmək istəmir. Bu, insanları çox asanlaşdıracaq, çünki etməli olduqları şey sancaqlardakı dəyərləri təyin etmək və oxumaq üçün bir JavaScript funksiyasından istifadə etməkdir. Məsələn, yazmaq o qədər də asan deyil
Yandırmaq
Bir düyməni açmaq üçün. PinMode (12, INPUT) elan etməkdən başqa başqa bir arduino proqramlaşdırmasının olmaması gözəllikdir; Quraşdırma funksiyanızda. Pin elan edildiyi müddətdə, JavaScript hər şey üçün istifadə edilə bilər.
document.onload = {
GetJSON ('A0', 1 'return_json')
}
0 analog pininin dəyərini əldə etmək və nəticəni div -ə qaytarmaq üçün etməlisiniz. Bu, insanların arduinoya nəzarət edən html səhifələri yarada bilmələri üçün asan bir yol olmalıdır. Arduino pinlərinin JavaScript ilə qurulub oxunması üçün bir interfeys yaradın.
Addım 1: Nə lazımdır
Bu layihəni ESP8266 üzərindəki html səhifəsi ilə arduino sisteminə nəzarət etmək istəyən istifadəçilər üçün hazırladım. Bu layihənin məqsədi, javascript funksiyası ilə arduino üzərindəki sancaqlar dəyərlərini təyin etmək üçün sadə bir üsul yaratmaqdır. Məsələn onclick = "SetPin (12, 1, 0)", arduino -da Pin 12 -ni Yüksək olaraq təyin edəcək.
Bu təlimat üçün tam olaraq davam etmək üçün aşağıdakı maddələrə ehtiyacınız olacaq. Bununla birlikdə, əksər arduino və ESP8266 birləşmələrində işləməli olduğunu düşünürəm. Ancaq burada olanları tam olaraq izləmək üçün aşağıdakı komponentlərə ehtiyacınız olacaq.
Arduino Uno - Rx TxAdafruit Huzzah Breakout Board USB -dən Serial Kabelə 4 aşağı gücə malik LED -in Analog Bulanıklığı test cihazı olan hər hansı bir arduino ilə işləməlidir - analoq çıxışı təmin edən hər hansı bir analoq, Mobil Tarayıcı Arduino Kitabxanaları ilə Wifi Wifi Router Cib Telefonu edəcək.
Addım 2: Arduino ID -nin hazırlanması
Bu layihə yeni bir arduino kitabxanaları və bəzi konfiqurasiyalara ehtiyac duyur. Hər ekranın ekran görüntüsünü çəkməyəcəyəm və bunu konfiqurasiya etmək və işə salmaq üçün lazım olanı keçəcəyəm. İstifadəçi üçün mümkün qədər asanlaşdırmağa çalışdım.
Kod işləmək üçün bir çox kitabxanadan istifadə edir. Əvvəlcə bu nümunədə Adafruit Huzzah istifadə etdiyim ESP8266 üçün arduino qurmağa diqqət edəcəyik, çünki adafruit məhsullarını ən etibarlı və ən yaxşı dəstəyə sahib olduğumu görürəm. Adafruit Discord serverindən dəstək almağa çalışmadığınız müddətcə. Dəstək forumlarında kömək almaqdan daha çox şans qazanacaqsınız.
Hər halda, ESP8266 -da aşağıdakı kitabxanalardan istifadə edirəm
ESP8266WiFi WiFiClient ESP8266WebServer ArduinoJSONBu kitabxanaların necə yüklənib qurulacağına dair bir dərs deyildir, lakin bunlar HUZZAH -da istifadə olunan kitabxanalardır. Buna görə də onları tapın və quraşdırın. HUZZAH üçün lövhə təriflərini də quraşdırmalısınız, buna görə də FILE> Tercihlər bölməsinə keçsəniz Əlavə Panolar Menecer URL -lərini yazan qutuya aşağıdakıları əlavə edin https://arduino.esp8266.com/stable/package_esp8266c… bu sahədə bir şey, əlavə bir lövhə url əlavə etmək üçün orada vergül əlavə etməyinizə əmin olun. Tamam vurun gedin
Alətlər> İdarə Heyəti> Lövhələr Meneceri ESP8266 Birliyi tərəfindən ESP8266 qurmaqdan daha çox ESP8266 axtarışından daha çoxdur.
Əla indi arduino kodunun işləməsi üçün lazım olan hər şeyə sahib olduğumuzdan əmin olun. Arduino -dan biri arduino -nun özü bu dərs üçün yalnız 2 kitabxanadan istifadə edir.
SoftwareSerialArduinoJSONHələ də sahib olmalısınız.
Addım 3: ESP8266 -nın hazırlanması
İndi kodu ESP8266 (Adafruit HUZZAH) üzərinə qoyub Arduinoya qoşulmaq üçün hazırlayacağıq. HUZZAH kodunu açın və eskizi açın. 11 və 12 -ci sətirlərdə ssid və şifrənizi yerli şəbəkənizdəki WIFI bağlantınızın şifrəsinə dəyişdirin. Eskiz faylı və index.h faylında 2 fayl olduğunu görəcəksiniz. İndex.h faylı telefonunuzda görünəcək html -in saxlanıldığı yerdir.
Wi -Fi -ya düzgün SSID və şifrəni təyin etdikdən sonra kodu tərtib edib ESP8266 -ya yükləyə bilərsiniz. HUZZAH -da, GPIO0 etiketli Düyməni basıb saxlamalısınız, sonra çipi yükləyici rejiminə keçirmək üçün GPIO0 düyməsini buraxmaqdansa, qalan düyməni sıxmalısınız. Çip uğurla yükləyici rejiminə keçirilərsə, çipin yükləyici rejimində olduğunu göstərən qırmızı işıq yanacaq.
ESP8266 -ya qoşulmaq üçün seriyalı kabel və ya USB -dən Serial adapterə və ya FDTI çipinə ehtiyacınız olacaq. Bu vəziyyətdə təlimatlarda qeyd edildiyi kimi adafruit kabelindən istifadə edirəm. Bununla birlikdə, Tx və Rx pinlərində TTL istifadə edərək çipə bir neçə yolla qoşula bilərsiniz. Ümid edirəm ki, buna baxan insanlar kodu yükləmək üçün çipə necə bağlanacaqlarını bilirlər. Hər halda davam edin və bu addıma əlavə edilmiş zip sənədindəki kodu olan çipi yandırın.
Addım 4: Arduino hazırlayın
Kodu arduinoya yükləmək üçün lövhənizin tərifini Arduino/Genuino Uno olaraq dəyişdirin. Bu addıma əlavə edilmiş faylı açın. Ardunio -ya yükləyin. Həqiqətən də olduqca sadə, bütün ağır işlər artıq sizin üçün edilmişdir. Mən artıq sınaq prosesində bir səhv prosesindən keçmişəm, buna görə də kodu yükləmək kifayətdir.
Addım 5: Hər şeyi birlikdə birləşdirin
Yaxşı, kabellər üçün burada olanların yuxarıda bir şəkli var.
Huzzahdakı Tx'yi arduino'ya 2 Pin'e bağlayın. Arzuino'da Pin 3'ü Huzza'daki Rx'e bağlayın. Varsayılan Serial Konsolunu boşaltmaq üçün arduinoda 2 və 3 pinlərdə başqa bir serial yuvası yaratdım.
Pin V+ və En -i arduinodan 5v -ə qoşun. - Adafruit Huzzah, 3,3v gərginlikli bir tənzimləyiciyə malikdir, buna görə də bu pinləri bu şəkildə bağlamaq bütün ESP8266 modulları ilə işləməyə bilər. Öz gərginlik tənzimləyicinizə tel bağlamağınız lazım ola bilər. Bir şeyi asanlıqla işlətmək istəyirsinizsə, Huzzahdan istifadə etməyi məsləhət görürəm. GND -ni arduinonun GND -yə bağlayın
LEDlərinizdəki arduino telindəki 12, 11, 9, 8 sancaqlarında burada aşağı enerjili LED -lərdən istifadə etdim, çünki çox cərəyan çəkənlər bu təcrübəni sadə saxlamaq üçün çox güc çəkə bilər.
Arduino üzərindəki A0 analog Pin 0 -dan daha çox Turpitity test cihazımın çıxış xəttinə qoşdum. Bununla birlikdə, analoq oxu verəcək hər hansı bir sensorun çıxışını qoşa bilərsiniz. Bunu bağlamaq üçün etməli olduğunuz şey budur.
Addım 6: Veb səhifəsinə daxil olmaq
Arduino -nu bağladığınıza və hər şeyi lövhələrinizə yüklədiyinizə görə, cib telefonunuzdakı html -ni görmək üçün lazımdır. İndi Huzzahdakı kodda SSID və şifrənizi təyin etdiyiniz eyni wifi routerə qoşulmanızı istəyirəm. Routerinizin cihazınıza hansı IP ünvanını təyin etdiyini başa düşməlisiniz. Adətən, marşrutlaşdırıcıların konfiqurasiyasına daxil olsanız, müştəri siyahısı olmalıdır. Wi -Fi bağlantınıza qoşulmuş bütün cihazların IP ünvanlarını göstərir. Ancaq bu IP ünvanını tapa bilmirsinizsə, onu arduinodan ayırıb serial kabel ilə yenidən işlədə bilərsiniz. Cihazdakı serial konsolunu açarsanız, başqa bir şəkildə tapa bilməyəcəyiniz halda, IP ünvanını serial konsolda cihaza yazdıracaq. Hər halda cib telefonunuzla eyni Wifi şəbəkəsinə qoşulduqda. Mobil veb brauzerinizi Hüzzahın ip ünvanına işarə edin. Hansı ki, yəqin buna bənzəyir. https://192.168.0.107 və ya çox oxşar bir şey. Orada 4 Led -i yandırıb söndürməyinizə, analoq sensorun dəyərini oxumağınıza imkan verəcək bir əsas səhifə qoydum.
Addım 7: Javascipt istifadə edin
ESP8266Code eskizində index.h adlanan faylda, arduino redaktorunda ayrı bir sekmə kimi görünməlidir. Burada hazırladığım əsas nümunəni görə bilərsiniz. Əsasən işləmə üsulu belədir.
SetPin (12, 1, 0); SetPin ({Pin nömrəsi}, {Dəyər 1 Yüksək 0 Aşağı}, {IsAnalog 1 Bəli 0 Xeyr})
Bu rəqəmsal pin 12 -nin dəyərini yüksək olaraq təyin edəcək
SetPin (4, 0, 0);
Bu rəqəmsal pin 4 -ün dəyərini aşağıya qoyacaq
SetPin (A2, 439, 1) Bu, Analog Pin 2 -nin dəyərini 439 olaraq təyin edəcək
Eyni şəkildə, GetJSON funksiyası bir pindən tələb olunan bir dəyəri qaytaracaq və onu müəyyən div Id ilə silinmiş html -ə yerləşdirəcək.
GetJSON ('A0', 1, 'resp_i') GetJSON ({Pin nömrəsi}, {IsAnalog 1 Bəli 0 Xeyr}, Nəticəni qaytarmaq üçün HTML Elementi})
Bu, arduino -ya 0 analoq pininin dəyərini soruşmaq və nəticəni resp_iGetJSON ID ilə Div -ə qaytarmaq üçün bir sorğu göndərəcək (12, 0, 'mydiv'); Bu, arduino -dan rəqəmsal pin 0 dəyərini əldə etməsini və nəticəni mydiv və Id ilə html elementinə qaytarmasını istəyəcək.
Addım 8: Dəstək
Ümid edirəm ssenarim istifadə etmək istəyənlərə kömək edəcək. Başqa insanların bacarmadığım bütün imkanları araşdıracaqları ümidi ilə burada çox sadə bir html nümunəsi istifadə etdim. Bununla birlikdə, bu, ajaxın html səhifə yükləmələri və bu xarakterli şeylər olmadan bir arduino idarə etmək üçün necə istifadə olunacağını nümayiş etdirməlidir.
Hər hansı bir şərhiniz varsa, xahiş edirəm məndən soruşun, cavablandırmaq üçün əlimdən gələni edəcəyəm. Bunun funksionallığını daha da genişləndirmək istərdim, amma vaxtım və pulum tükəndi. Bununla birlikdə, faylları ESP8266 -da deyil, adi bir veb serverində saxlayan daha güclü bir tətbiq üzərində işləyirəm.
Kodumu görmək üçün vaxt ayırdığınız üçün təşəkkür edirəm.
John Anderson Mənə E -poçt göndər
Vermont İnternet Dizayn MMC
www.vermontinternetdesign.com
Tövsiyə:
Arduino ilə Servo Motoru Nəzarət etməyin Super Asan Yolu: 8 addım
Arduino ilə Servo Motoru İdarə Etməyin Super Asan Yolu: Bu dərslikdə Servo Motor və Arduino UNO və Visuinodan istifadə edərək servo motor dərəcəsi mövqeyini yalnız bir neçə komponentdən istifadə edərək bu layihəni Super Sadə hala gətirəcəyik
Texniki Göyərtə ilə Makey Makey istifadə etməyin asan yolu: 5 addım
Texniki Göyərtə ilə Makey Makey istifadə etməyin asan yolu: Salam. Bu yaxınlarda bu yarışmada həqiqətən sərin, lakin çətin görünən bir texnologiya göyərtəsi hazırlayan bir proqram gördüm, buna görə də texnologiya göyərtəsi ilə oyun oynamaq üçün asan bir yol hazırladım. Təlimatımı bəyənirsinizsə, makey makey yarışmasında ona səs verin
Avtomobilinizdən məlumat əldə etməyin asan bir yolu: 4 addım
Vasitənizdən Məlumat Almanın Asan Bir Yolu: Burada avtomobilinizin OBD-II konnektoru ilə GPS məlumatlarını əldə etməyin asan bir yolunu təqdim edirik. İkinci Gəmidə Diaqnostika OBD-II, bir avtomobilin özünü tanıma və hesabat qabiliyyətinə aid bir avtomobil terminidir. OBD sistemləri
Arduino -ya RC Avtomobilini İdarə etməyin Yeni Bir Yolu: 7 Addım (Şəkillərlə birlikdə)
Arduino -ya RC Avtomobilini İdarə etməyin Yeni Bir Yolu: Arduino idarə olunan avtomobillərlə bir az iş görmüşəm, amma işlədiyim maşınlar həmişə yavaş və metodik olub. Arduino öyrənərkən bu əladır, amma bir az daha əyləncəli bir şey istədim. RC avtomobilinə daxil olun. RC avtomobilləri sözün həqiqi mənasında
SMD LED -lərinə maqnit telini lehim etməyin daha asan bir yolu: 5 addım
SMD LED-lərinə Maqnit Telini Lehimləməyin Daha asan bir yolu: Bu Təlimat səthə quraşdırılmış LED-lərə incə maqnit tel bağlamağın daha asan bir üsulunu təsvir edir. Bu, "kömək əlləri" istifadə etməyi göstərən təlimatlandırılan Fireflies Kavanozuna cavabdır. Bu işi görmək üçün klip çəkin. Düşünürəm ki, mənim metodum çox asandır