Nano 33 IoT + EC/pH/ORP + WebAPK: 8 koraka

2024 Autor: John Day | [email protected]. Zadnja izmjena: 2024-01-30 08:06

Autor ufireFollow Još autora:

O: Dodajte mogućnost mjerenja pH, ORP, EC ili saliniteta u svoj Arduino ili Raspberry Pi projekt. Više o ufireu »

Uređaj za mjerenje EC, pH, ORP i temperature. Može se koristiti za nadzor bazena ili hidroponskih postavki. Komunicirat će putem Bluetootha s niskom potrošnjom energije i prikazati informacije na web stranici pomoću web Bluetootha. I radi zabave, ovo ćemo pretvoriti u progresivnu web aplikaciju koju možete instalirati s weba.

Korak 1: Koji su svi ti uslovi?

EC/pH/ORP/temperatura neka su od najčešćih mjerenja kvalitete vode. Električna vodljivost (EC) koristi se u hidroponici za mjerenje hranjive otopine, pH koliko je voda kisela/bazična, a ORP se koristi za utvrđivanje sposobnosti vode da se dezinficira

• Bluetooth Low Energy je bežični protokol za jednostavno slanje i primanje informacija. Arduino ploča koja se koristi u ovom projektu je Nano 33 IoT i dolazi sa WiFi i BLE sučeljima.
• Web Bluetooth je skup API -ja implementiranih u Google -ov Chrome preglednik (i Opera) koji web stranici omogućuju direktnu komunikaciju s BLE uređajem.
• Progresivne web aplikacije u osnovi su web stranice koje se ponašaju poput običnih aplikacija. Android i iPhone različito se nose s njima, a različiti su na stolnim računalima, pa ćete morati malo pročitati radi pojedinosti.

Korak 2: Hardver

Prije nego što možemo sastaviti hardver, moramo se pozabaviti jednom stvari. UFire ISE senzorski uređaji dolaze s istom I2C adresom, a mi koristimo dvije, pa ćemo jednu morati promijeniti. Za ovaj projekt odabrat ćemo jednu od ISE ploča i koristiti je za mjerenje ORP -a. Slijedeći ovdje navedene korake, promijenite adresu u 0x3e.

Sada kada se adresa promijenila, sastavljanje hardvera je jednostavno. Svi senzorski uređaji koriste sistem Qwiic connect, pa samo sve spojite u lanac. Trebat će vam jedna žica Qwiic -Male za povezivanje jednog od senzora na Nano 33. Žice su konzistentne i kodirane u boji. Spojite crno na Nano -ov GND, crveno na +3.3V ili +5V pin, plavo na SDA pin A4, a žuto na SCL pin na A5.

Za ovaj projekt se očekuje da će informacije o temperaturi doći od EC senzora, stoga svakako priključite temperaturni senzor na EC ploču. Sve ploče imaju mogućnost mjerenja temperature. Ne zaboravite spojiti EC, pH i ORP sonde na odgovarajuće senzore. Lako se pričvršćuju pomoću BNC konektora.

Ako imate kućište, bilo bi dobro staviti sve ovo unutra, pogotovo ako uzmete u obzir vodu.

Korak 3: Softver

Softverski dio ovoga podijeljen je u dva glavna odjeljka: firmver na Nano 33 i web stranicu.

Osnovni tok je sljedeći:

• Web stranica se povezuje s Nano -om putem BLE -a
• Web stranica šalje tekstualne komande za traženje informacija ili poduzimanje radnji
• Nano sluša te naredbe, izvršava ih i vraća informacije
• Web stranica prima odgovore i ažurira korisničko sučelje u skladu s tim

Ovo postavljanje omogućuje web stranici da izvrši sve potrebne funkcije koje očekujete, poput mjerenja ili kalibracije senzora.

Korak 4: BLE usluge i karakteristike

Jedna od prvih stvari koju treba naučiti su osnove rada BLE -a.

Postoji mnogo analogija, pa hajde da izaberemo knjigu. Usluga bi bila knjiga, a karakteristika stranice. U ovoj "BLE knjizi" stranice imaju nekoliko neknjižnih svojstava poput mogućnosti da promijene ono što stranica kaže i primanja obavijesti kada se to dogodi.

BLE uređaj može napraviti onoliko usluga koliko želi. Neki su unaprijed definirani i djeluju kao način za standardizaciju uobičajeno korištenih informacija, kao što je Tx Power ili gubitak veze, na specifičnije stvari poput inzulina ili pulsne oksimetrije. Možete i samo napraviti jednu i raditi s njom šta god želite. Oni su definirani u softveru i identificirani su UUID -om. UUID -ove možete napraviti ovdje.

U firmveru za ovaj uređaj postoji jedna usluga, definirana kao:

BLEService uFire_Service ("4805d2d0-af9f-42c1-b950-eae78304c408");

i dve karakteristike:

BLEStringCharacteristic tx_Characteristic ("50fa7d80-440a-44d2-967a-ec7731ec736a", BLENotify, 20);

BLEStringCharacteristic rx_Characteristic ("50fa7d80-440b-44d2-967b-ec7731ec736b", BLEWrite, 20);

Tx_Characteristic će biti mjesto gdje uređaji šalju informacije, poput EC mjerenja, za prikaz web stranice. Rx_Characteristic je mjesto gdje će primati naredbe sa web stranice za izvršavanje.

Ovaj projekt koristi ArduinoBLE biblioteku. Ako pogledate, vidjet ćete da postoji nekoliko različitih načina da se proglasi karakteristika. Ovaj projekt koristi BLEStringCharacteristic jer ćemo se baviti tipom String i jednostavno je lakše, ali možete odabrati i BLECharCharacteristic ili BLEByteCharacteristic među nekolicinom drugih.

Osim toga, postoje neka svojstva kojima možete dati karakteristiku. tx_Characteristic ima opciju BLENotify. To znači da će naša web stranica primiti obavijest kada se promijeni njena vrijednost. rx_Characteristic ima BLEWrite koji će našoj web stranici omogućiti izmjenu. Ima i drugih.

Zatim postoji malo kod-ljepila za povezivanje svih ovih stvari zajedno:

BLE.setLocalName ("uFire BLE");

BLE.setAdvertisedService (uFire_Service); uFire_Service.addCharacteristic (tx_Characteristic); uFire_Service.addCharacteristic (rx_Characteristic); BLE.addService (uFire_Service); rx_Characteristic.setEventHandler (BLEWritten, rxCallback); BLE.advertise ();

To je manje-više samo po sebi razumljivo, ali dotaknimo se nekoliko stvari.

rx_Characteristic.setEventHandler (BLEWritten, rxCallback);

Tamo možete iskoristiti prednost primanja obavijesti o promjeni vrijednosti. Redak govori klasi da izvrši funkciju rxCallback kada se promijeni vrijednost.

BLE.advertise ();

to je ono što pokreće cijelu stvar. BLE uređaj će povremeno slati mali paket informacija koji objavljuje da je vani i dostupan za povezivanje. Bez toga će biti nevidljiv.

Korak 5: Tekstualne naredbe

Kao što je ranije spomenuto, ovaj uređaj će razgovarati s web stranicom putem jednostavnih tekstualnih naredbi. Cijela je stvar laka za implementaciju jer je naporan posao već obavljen. UFire senzori dolaze s bibliotekom zasnovanom na JSON -u i MsgPack -u za slanje i primanje naredbi. Više o naredbama EC i ISE možete pročitati na njihovim stranicama s dokumentacijom.

Ovaj projekt će koristiti JSON jer je s njim malo lakše raditi i čitati ga, za razliku od binarnog formata MsgPack.

Evo primjera kako se sve to povezuje:

• Web stranica od uređaja traži EC mjerenje slanjem ec (ili tačnije pisanjem ec na rx_karakterističnu karakteristiku)
• Uređaj prima naredbu i izvršava je. Zatim šalje odgovor u obliku JSON -a u obliku {"ec": 1.24} pisanjem na tx_Characteristic karakteristiku.
• Web stranica prima informacije i prikazuje ih

Korak 6: Web stranica

Web stranica za ovaj projekt će koristiti Vue.js za front-end. Nije potrebna pozadina. Osim toga, kako bi stvari bile jednostavnije, ne koristi se nikakav sistem za izgradnju. Podijeljen je na uobičajene mape, js za javascript, css za CSS, sredstva za ikone. Njegov html dio nije ništa posebno. Koristi bulma.io za oblikovanje i stvara korisničko sučelje. U odjeljku ćete primijetiti mnogo. Dodaje sve css i ikone, ali i dodaje jedan red posebno.

To učitava našu datoteku manifest.json zbog čega se događaju sve PWA stvari. Deklarira neke informacije koje govore našem telefonu da se ova web stranica može pretvoriti u aplikaciju.

Javascript je mjesto gdje se događa većina zanimljivih stvari. Raščlanjen je na datoteke, app.js sadrži osnove postavljanja Vue web stranice zajedno sa svim varijablama povezanim s korisničkim sučeljem i nekoliko drugih stvari. ble.js ima bluetooth stvari.

Korak 7: Javascript i web Bluetooth

Prvo, ovo radi samo na Chromeu i Operi. Volio bih da drugi preglednici podržavaju ovo, ali iz bilo kojeg razloga, oni to ne podržavaju. Pogledajte app.js i vidjet ćete iste UUID -ove koje smo koristili u svom firmveru. Jedan za uslugu uFire i po jedan za karakteristike tx i rx.

Ako pogledate u ble.js, vidjet ćete funkcije connect () i disconnect ().

Funkcija connect () sadrži logiku za održavanje sinkronizacije korisničkog sučelja, ali uglavnom postavlja stvari za slanje i primanje informacija o karakteristikama.

Postoje neke posebnosti kada se radi o web Bluetoothu. Veza se mora pokrenuti nekom vrstom fizičke korisničke interakcije, poput dodira gumba. Na primjer, ne možete se programski povezati kada se učita web stranica.

Kod za pokretanje veze izgleda ovako:

this.device = čekajte navigator.bluetooth.requestDevice ({

filteri: [{namePrefix: "uFire"}], opcionalneServices: [this.serviceUuid]});

Odjeljak Filtri: i opcionalne usluge su potrebni kako bi se izbjeglo viđenje svakog BLE uređaja vani. Mislili biste da bi samo dio s filterom bio u redu, ali također vam je potreban i opcijski dio Servisi.

Gornji kôd će prikazati dijalog za povezivanje. To je dio Chrome sučelja i ne može se promijeniti. Korisnik će izabrati sa liste. Čak i ako postoji samo jedan uređaj s kojim bi se aplikacija mogla povezati, korisnik će zbog sigurnosnih razloga ipak morati proći kroz ovaj dijaloški okvir za odabir.

Ostatak koda je postavljanje usluge i karakteristika. Imajte na umu da smo postavili rutinu povratnog poziva, slično povratnom pozivu obavijesti firmvera:

service = čekaj server.getPrimaryService (this.serviceUuid);

character = await service.getCharacteristic (this.txUuid); await character.startNotifications (); karakteristika.addEventListener ("karakteristikavaluechanged", this.value_update);

this.value_update će se sada pozivati svaki put kad se pojave nove informacije o tx karakteristici.

Jedna od posljednjih stvari koje postavlja je postavljanje tajmera za ažuriranje informacija svakih 5 sekundi.

value_update () je samo duga funkcija koja čeka da dođu nove JSON informacije i ažurira korisničko sučelje s njom.

ec.js, ph.js i orp.js sadrže mnoge male funkcije koje šalju naredbe za preuzimanje informacija i kalibraciju uređaja.

Da biste ovo pokušali, morate imati na umu da se za korištenje internetskog Bluetootha mora posluživati putem HTTPS -a. Jedna od mnogih opcija za lokalni HTTPS poslužitelj je serve-https. S učitanim firmverom, svime povezanim i web stranicom koja se poslužuje, trebali biste vidjeti da sve radi.

Korak 8: PWA dio

Postoji nekoliko koraka za pretvaranje web stranice u stvarnu aplikaciju. Progresivne web aplikacije mogu učiniti mnogo više nego što ih ovaj projekt koristi.

• Instalacija web stranice
• Nakon instaliranja, moguć je pristup van mreže
• Pokrenuta i radi kao normalna aplikacija sa ikonom aplikacije pravilnog izgleda

Za početak ćemo morati generirati hrpu datoteka. Prva je datoteka manifest.json. Postoji nekoliko web lokacija koje će to učiniti umjesto vas, App Manifest Generator, koji je jedan od njih.

Nekoliko stvari koje treba razumjeti:

• Obim primene je važan. Postavio sam ovu web stranicu na adresu ufire.co/uFire-BLE/. To znači da je opseg moje aplikacije /uFire-BLE /.
• Početni URL je takođe važan. To je put do vaše određene web stranice s već pretpostavljenom osnovnom domenom. Zato što sam ovo stavio na ufire.co/uFire-BLE/, početni URL je/uFire-BLE/.
• Način prikaza će odrediti kako aplikacija izgleda, Samostalna će učiniti da izgleda kao obična aplikacija bez ikakvih Chrome tipki ili sučelja.

Na kraju ćete dobiti json datoteku. Mora se postaviti u korijenu web stranice, zajedno s index.html.

Sljedeća stvar koja vam je potrebna je uslužni radnik. Opet, oni mogu učiniti mnogo, ali ovaj će projekt koristiti samo predmemoriranje kako bi ovoj aplikaciji omogućio pristup izvan mreže. Implementacija uslužnog radnika uglavnom je predodžba. Ovaj projekt je koristio Googleov primjer i promijenio popis datoteka koje se keširaju. Ne možete keširati datoteke izvan svoje domene.

Idite na FavIcon Generator i napravite ikone.

Posljednja stvar je dodati neki kôd u funkciju Vue mount ().

montirano: function () {if ('serviceWorker' u navigatoru) {navigator.serviceWorker.register ('service-worker.js'); }}

Ovo će registrirati radnika u pregledniku.

Možete provjeriti radi li sve, a ako ne, možda shvatiti zašto će pomoću Lighthousea analizirati web mjesto i reći vam svakakve stvari.

Ako je sve uspjelo, kada posjetite web stranicu, Chrome će vas pitati želite li je instalirati s skočnim bannerom. Možete ga vidjeti u akciji na ufire.co/uFire-BLE/ ako koristite Chrome za mobilne uređaje. Ako ste na radnoj površini, možete pronaći stavku menija da biste je instalirali.