Arduino -г HTML/Javascript ашиглан удирдах хялбар арга: 8 алхам

2024 Зохиолч: John Day | [email protected]. Хамгийн сүүлд өөрчлөгдсөн: 2024-01-30 11:04

Энэхүү заавар нь зөвхөн javascript функцийг ашиглан adafruit Huzzah -аас ajax дуудлага хийх замаар arduino -ийг хэрхэн удирдахыг танд харуулах болно. Үндсэндээ та javascript -ийг html хуудсан дээр ашиглах боломжтой бөгөөд энэ нь ajax дуудлага хийх энгийн JavaScript функцтэй html интерфэйсийг хялбархан бичих боломжийг танд олгоно. ESP8266 -ийг arduino -той харилцахыг зөвшөөрөх. Тиймээс бүх тээглүүрүүдийг javascript функцээс тохируулж болно. Үүний нэгэн адил бид JavaScript функцийг ашиглан ямар ч зүүгээс утгыг уншиж болно. Энэ нь html баримтаас arduino -ийг удирдахад хялбар болгоход тусална гэж найдаж байна. Html бичих чадвартай олон хүмүүс байдаг гэж би ойлгосон. Тэдний ихэнх нь java, xcode эсвэл өөр бусад хүрээтэй гар утасны аппликейшн хийх гэж оролдохыг хүсдэггүй. Энэ нь хүмүүст маш хялбар байх болно, учир нь тэдний хийх ёстой зүйл бол тээглүүрээс утгыг тохируулах, уншихын тулд JavaScript функцийг ашиглах явдал юм. Жишээлбэл, бичих нь тийм ч хялбар биш юм

Асаах

Товчлуурыг асаахын тулд. PinMode (12, INPUT) -ийг зарлахаас өөр ямар ч ардуино програмчлал байдаггүй нь гоо үзэсгэлэн юм. Таны тохируулах функцэд. Зүүг зарласан тохиолдолд javascript -ийг бусад бүх зүйлд ашиглаж болно.

document.onload = {

GetJSON ('A0', 1 'return_json')

}

Аналог зүү 0 -ийн утгыг олж, үр дүнг div рүү буцааж өгөхийн тулд үүнийг хийх хэрэгтэй. Тиймээс энэ нь хүмүүст arduino -ийг хянадаг html хуудсуудыг үүсгэх хялбар арга байх ёстой. Arduino тээглүүрийг JavaScript ашиглан тохируулж унших боломжтой интерфэйсийг бий болгох.

Алхам 1: Танд хэрэгтэй зүйл

Би энэ төслийг ESP8266 дээр html хуудсаар дамжуулан arduino -г удирдахыг хүсч буй хүмүүст зориулж бүтээсэн. Энэхүү төслийн зорилго нь javascript функц бүхий arduino дээрх тээглүүрийн утгыг тохируулах энгийн аргыг бий болгох явдал юм. Жишээ нь onclick = "SetPin (12, 1, 0)" нь таны arduino дээрх Pin 12 -ийг Өндөр болгоно.

Энэхүү гарын авлагад яг дагаж мөрдөхийн тулд танд дараах зүйлс хэрэгтэй болно. Гэсэн хэдий ч энэ нь ихэнх arduino болон ESP8266 хослол дээр ажиллах ёстой гэж би бодож байна. Гэсэн хэдий ч надад байгаа зүйлийг дагаж мөрдөхийн тулд танд дараах бүрэлдэхүүн хэсгүүд хэрэгтэй болно.

Arduino Uno - Rx TxAdafruit Huzzah Breakout Board USB to Serial Cable 4 серийн кабелийн 4 бага чадалтай LED -ийн аналог булингартай тестортой аналог гаралт бүхий ямар ч аналог мэдрэгч нь гар утасны хөтөчтэй Arduino номын сантай Wire Wifi Router гар утсыг хийх болно.

Алхам 2: Arduino ID бэлтгэх

Энэ төсөл нь цаг хугацааны хувьд шинэ arduino номын сан, зарим тохиргоог шаарддаг. Би дэлгэц бүрийн дэлгэцийн агшинг оруулахгүй бөгөөд үүнийг тохируулах, ажиллуулахын тулд танд хэрэгтэй байгаа зүйлийг л хийх болно. Би үүнийг хэрэглэгчдэд аль болох хялбар болгохыг хичээсэн.

Код нь ажиллахын тулд олон тооны номын санг ашигладаг. Эхлээд бид энэ жишээн дээр Adafruit Huzzah -ийг ашиглаж байгаа ESP8266 -ийн arduino -ийг тохируулахад анхаарлаа хандуулах болно, учир нь би adafruit бүтээгдэхүүнийг хамгийн найдвартай, хамгийн сайн дэмжлэгтэй гэж үздэг. Adafruit Discord серверээс дэмжлэг авахыг оролдохгүй л бол. Дэмжлэгийн форумд тусламж авах нь танд илүү их аз авчрах болно.

Ямар ч байсан би ESP8266 дээрх дараах номын санг ашиглаж байна

ESP8266WiFi WiFiClient ESP8266WebServer ArduinoJSONЭнэ нь номын санг татаж авах, суулгах талаар заавар биш боловч эдгээр нь HUZZAH дээр ашиглагддаг номын сан юм. Тиймээс тэдгээрийг олж суулгаарай. Та мөн HUZZAH -ийн самбарын тодорхойлолтыг суулгах хэрэгтэй болно, хэрэв та FILE> Preferences рүү очвол Нэмэлт самбар менежерийн URL -ууд гэсэн талбарт дараах хаягийг нэмж оруулна уу https://arduino.esp8266.com/stable/package_esp8266c… хэрэв танд байгаа бол Энэ талбарт ямар нэгэн зүйл байгаа бол та самбарын нэмэлт url нэмэхийн тулд таслал нэмж оруулаарай. За дарна уу

Багаж хэрэгсэл> Удирдах зөвлөл> ТУЗ -ийн менежер ESP8266 -ийн ESP8266 -ийг суулгахаас илүү ESP8266 -ийг хайхаас илүү.

Гайхалтай одоо бидэнд arduino кодыг ажиллуулахад хэрэгтэй бүх зүйл байгаа эсэхийг шалгаарай. Ардуиногийн нэг тал arduino өөрөө энэ хичээлд зөвхөн 2 номын санг ашигладаг.

SoftwareSerialArduinoJSONТанд аль хэдийн байх ёстой.

Алхам 3: ESP8266 -ийг бэлтгэх

Одоо бид кодыг ESP8266 (Adafruit HUZZAH) дээр байрлуулж, Arduino -тэй холбоход бэлдэх гэж байна. HUZZAH кодыг задалж, ноорогоо нээнэ үү. 11, 12 -р мөрөнд ssid болон нууц үгээ өөрийн дотоод сүлжээнд байгаа WIFI холболтынхоор солино уу. Ноорог файл болон index.h файл гэсэн 2 файл байгааг та анзаарах болно. Index.h файл нь таны утсан дээр гарч ирэх html хадгалагдах газар юм.

Та Wi -Fi сүлжээндээ SSID болон нууц үгээ зөв тохируулсны дараа кодыг эмхэтгэн ESP8266 дээрээ ачаалж болно. HUZZAH дээр та GPIO0 гэсэн товчлуурыг дарж, дараа нь чипийг ачаалагч горимд оруулахын тулд GPIO0 товчлуурыг дарж үлдэх товчийг дарна уу. Хэрэв чипийг bootloader горимд амжилттай оруулсан бол улаан гэрэл асах бөгөөд чип нь bootloader горимд байгааг илтгэнэ.

ESP8266 -тай холбогдохын тулд танд цуваа кабель эсвэл USB -ээс цуваа адаптер эсвэл FDTI чип хэрэгтэй болно. Энэ тохиолдолд би зааврын дагуу adafruit -ийн кабелийг ашиглаж байна. Гэсэн хэдий ч та Tx ба Rx зүү дээр TTL ашиглан хэд хэдэн аргаар чипийг холбох боломжтой. Үүнийг үзэж буй хүмүүс кодоо ачаалахын тулд чип рүү хэрхэн залгахаа мэддэг байх гэж найдаж байна. Ямар ч байсан үргэлжлүүлээд энэ алхамд хавсаргасан зип файл дахь код бүхий чипийг анивчаарай.

Алхам 4: Arduino бэлтгэх

Кодыг arduino дээр ачаалахын тулд самбарынхаа тодорхойлолтыг Arduino/Genuino Uno болгож өөрчилнө үү. Энэ алхамд хавсаргасан файлыг задлахаас илүү. Үүнийг ardunio дээр байршуулаарай. Үнэхээр энгийн, бүх хүнд хэцүү ажлыг аль хэдийн танд зориулж хийсэн. Би аль хэдийн туршилтын явцад алдааны процессыг давсан тул кодоо байршуулах л үлдлээ.

Алхам 5: Бүх зүйлийг хамтад нь холбох

За, утсан холболтын хувьд энд байгаа зүйлийнхээ зураг байна.

Huzzah дээрх Tx -ийг arduino дээр 2 -р зүү рүү холбоно уу. Анхдагч Цуваа Консолыг чөлөөлөхийн тулд би arduino дээрх 2 ба 3 -р зүү дээр өөр сериал сокет үүсгэв.

Pin V+ ба En -ийг arduino -аас 5v -ээр холбоно уу. - Adafruit Huzzah нь 3.3V хүчдэлийн зохицуулагчтай тул эдгээр тээглүүрийг ийм байдлаар залгах нь бүх ESP8266 модульд ажиллахгүй байж магадгүй юм. Та өөрийн хүчдэлийн зохицуулагчийг утсаар холбох хэрэгтэй болж магадгүй юм. Хэрэв та энэ зүйлийг амархан ажиллуулахыг хүсч байвал Huzzah -ийг ашиглахыг зөвлөж байна. GND -ийг arduino -ийн GND -тэй холбоно уу

Таны LED -ийн arduino утсан дээрх 12, 11, 9, 8 -р зүү дээр би бага хүчирхэг LED ашигладаг байсан, учир нь хэт их гүйдэл дамжуулж байгаа нь энэ туршилтыг хялбар байлгахын тулд хэт их хүч авч чаддаг.

Arduino дээрх A0 аналог Pin 0 -ээс илүү би Turpitity шалгагчийн гаралтын шугамыг залгасан. Гэсэн хэдий ч та аналог унших боломжийг олгодог аливаа мэдрэгчийн гаралтыг залгаж болно. Үүнийг залгахын тулд та үүнийг хийх хэрэгтэй.

Алхам 6: Вэб хуудсанд нэвтрэх

Одоо та arduino -г утастай болгож, бүх зүйлийг самбар дээрээ ачаалж байгаа тул та гар утсан дээрээ html -ийг үзэх боломжтой болно. Одоо би таныг Huzzah дээрх кодонд оруулсан SSID болон нууц үгээ тохируулсан wifi чиглүүлэгчтэйгээ холбогдохыг хүсч байна. Таны чиглүүлэгч таны төхөөрөмжид ямар IP хаяг оноосон болохыг олж мэдэх хэрэгтэй. Ихэвчлэн, хэрэв та чиглүүлэгчийн тохиргоонд нэвтэрсэн бол үйлчлүүлэгчдийн жагсаалт байх ёстой. Энэ нь таны Wifi холболттой холбогдсон бүх төхөөрөмжийн IP хаягийг харуулна. Гэсэн хэдий ч, хэрэв та энэ IP хаягийг олж чадахгүй бол түүнийг arduino -аас салгаад цуваа кабелиар дахин ажиллуулж болно. Хэрэв та төхөөрөмж дээрх цуваа консолыг нээвэл өөр аргаар олж чадахгүй бол энэ нь IP хаягийг цуваа консол дахь төхөөрөмжид хэвлэх болно. Ямар ч байсан та гар утсаараа ижил Wifi сүлжээнд холбогдсон байна. Гар утасны вэб хөтөчөө Huzzah -ийн IP хаягаар зааж өгнө үү. Үүнтэй төстэй зүйл харагдаж магадгүй юм. https://192.168.0.107 эсвэл үүнтэй төстэй зүйл. Тэнд би 4 LED -ийг асаах, унтраах, аналог мэдрэгчийн утгыг унших үндсэн хуудсыг оруулсан болно.

Алхам 7: Javascipt ашиглах

ESP8266Code ноорог дахь index.h нэртэй файлд энэ нь arduino засварлагчийн тусдаа таб хэлбэрээр гарч ирэх ёстой. Миний хийсэн үндсэн жишээг эндээс харж болно. Үндсэндээ энэ нь иймэрхүү байдлаар ажилладаг.

SetPin (12, 1, 0); SetPin ({Pin Number}, {Value 1 High 0 Low}, {IsAnalog 1 Yes 0 No})

Энэ нь дижитал зүү 12 -ийн утгыг өндөр болгоно

SetPin (4, 0, 0);

Энэ нь дижитал зүү 4 -ийн утгыг хамгийн бага болгоно

SetPin (A2, 439, 1) Энэ нь аналог Pin 2 -ийн утгыг 439 болгоно

Үүний нэгэн адил GetJSON функц нь зүүгээс хүссэн утгыг буцааж өгч, заасан div Id -ээр устгасан html -д байрлуулах болно.

GetJSON ('A0', 1, 'resp_i') GetJSON ({Pin Number}, {IsAnalog 1 Yes 0 No}, {HTML Of HTML Element to return result))

Энэ нь arduino руу аналог зүү 0 -ийн утгыг асууж, үр дүнг resp_iGetJSON ID (12, 0, 'mydiv') ашиглан Div руу буцаах хүсэлтийг илгээнэ. Энэ нь arduino -оос дижитал зүү 0 -ийн утгыг олж, үр дүнг html элемент болон mydiv -ийн ID -тай буцааж өгөхийг хүсэх болно.

Алхам 8: Дэмжлэг

Миний скрипт үүнийг ашиглахыг хүссэн хүмүүст тусална гэж найдаж байна. Би бусад хүмүүст миний хийж чадахгүй байгаа бүх чадварыг судлах болно гэж найдаж энд маш энгийн html жишээг ашигласан. Гэсэн хэдий ч энэ нь html хуудасны ачаалал болон ийм төрлийн зүйлгүйгээр arduino -ийг хянахад ajax -ийг хэрхэн ашиглаж болохыг харуулах ёстой.

Хэрэв танд ямар нэгэн сэтгэгдэл байвал надаас асуугаарай, би хариулахын тулд чадах бүхнээ хийх болно. Би энэ функцийг илүү өргөжүүлэхийг хүсч байна, гэхдээ цаг хугацаа, мөнгөгүй болсон. Гэсэн хэдий ч би файлуудыг ESP8266 дээр биш ердийн вэб сервер дээр хадгалдаг илүү бат бөх хэрэгжүүлэхийн төлөө ажиллаж байна.

Цаг зав гарган миний кодыг харсанд баярлалаа.

Жон Андерсон над руу имэйл илгээнэ үү

Вермонт Интернет Дизайн ХХК

www.vermontinternetdesign.com