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

2024 Kirjoittaja: John Day | [email protected]. Viimeksi muokattu: 2024-01-30 09:01

Seuraa lisää tekijältä:

Tietoja: Lisää mahdollisuus mitata pH, ORP, EC tai suolapitoisuus Arduino- tai Raspberry Pi -projektiisi. Lisätietoja ufireista »

Laite EC: n, pH: n, ORP: n ja lämpötilan mittaamiseen. Sitä voitaisiin käyttää altaan tai vesiviljelyn seurantaan. Se kommunikoi Bluetooth Low Energy -yhteyden kautta ja näyttää tiedot verkkosivulla Web Bluetooth -toiminnon avulla. Ja huvin vuoksi muutamme tämän progressiiviseksi verkkosovellukseksi, jonka voit asentaa verkosta.

Vaihe 1: Mitä nämä ehdot ovat?

EC/pH/ORP/lämpötila ovat yleisimpiä vedenlaatumittauksia. Sähkönjohtavuutta (EC) käytetään hydroponiassa mittaamaan ravinneliuosta, pH: ta, kuinka happama/emäksinen vesi on, ja ORP: tä käytetään määrittämään veden kyky desinfioida itsensä

• Bluetooth Low Energy on langaton protokolla, joka lähettää ja vastaanottaa tietoja helposti. Tässä projektissa käytetty Arduino -kortti on Nano 33 IoT, ja siinä on WiFi- ja BLE -liitännät.
• Web Bluetooth on joukko Googlen Chrome -selaimessa (ja Operassa) toteutettuja sovellusliittymiä, joiden avulla verkkosivu voi kommunikoida suoraan BLE -laitteen kanssa.
• Progressiiviset verkkosovellukset ovat pohjimmiltaan verkkosivuja, jotka toimivat tavallisten sovellusten tavoin. Android ja iPhone käsittelevät niitä eri tavalla, ja ne ovat erilaisia pöytäkoneilla, joten sinun on luettava vähän yksityiskohtia.

Vaihe 2: Laitteisto

Ennen kuin voimme koota laitteiston, on otettava huomioon yksi asia. UFire ISE -anturilaitteilla on sama I2C -osoite ja käytämme kahta, joten yksi on vaihdettava. Tässä hankkeessa aiomme valita yhden ISE -levyistä ja käyttää sitä ORP: n mittaamiseen. Vaihda tässä olevien ohjeiden mukaisesti osoite 0x3e.

Nyt kun osoite on muutettu, laitteiston kokoaminen on helppoa. Kaikki anturilaitteet käyttävät Qwiic connect -järjestelmää, joten kytke kaikki yhteen ketjussa. Tarvitset yhden Qwiic -uros -johdon, jotta voit liittää yhden antureista Nano 33. Johdot ovat johdonmukaisia ja värikoodattuja. Liitä musta Nanon GND: hen, punainen joko +3,3 V: n tai +5 V: n napaan, sininen SDA -nastaan, joka on A4, ja keltainen A5: n SCL -nastaan.

Tässä projektissa se odottaa lämpötilatietojen tulevan EC -anturilta, joten muista kiinnittää lämpötila -anturi EC -korttiin. Kaikilla levyillä on kuitenkin kyky mitata lämpötilaa. Älä unohda kiinnittää EC-, pH- ja ORP -antureita asianmukaisiin antureihin. Ne on helppo kiinnittää BNC -liittimillä.

Jos sinulla on kotelo, kaiken tämän asettaminen sisälle olisi hyvä idea, varsinkin kun otetaan huomioon vesi.

Vaihe 3: Ohjelmisto

Ohjelmisto -osa on jaettu kahteen pääosaan: Nano 33: n laiteohjelmisto ja verkkosivu.

Perusvirtaus on tämä:

• Verkkosivu muodostaa yhteyden nanoon BLE: n kautta
• Verkkosivu lähettää tekstipohjaisia komentoja pyytääkseen tietoja tai tehdäkseen toimenpiteitä
• Nano kuuntelee näitä komentoja, suorittaa ne ja palauttaa tietoja
• Verkkosivu vastaanottaa vastaukset ja päivittää käyttöliittymän vastaavasti

Tämä asetus sallii verkkosivun suorittaa kaikki odotetut toiminnot, kuten mittauksen tai kalibroida anturit.

Vaihe 4: BLE -palvelut ja ominaisuudet

Yksi ensimmäisistä asioista, jotka on opittava, ovat BLE: n toiminnan perusteet.

Analogioita on paljon, joten valitaan kirja. Palvelu olisi kirja ja ominaisuus sivut. Tässä "BLE-kirjassa" sivuilla on muutamia muita kuin kirjan ominaisuuksia, kuten sivun sanamuodon muuttaminen ja ilmoituksen vastaanottaminen, kun se tapahtuu.

BLE -laite voi tehdä niin monta palvelua kuin haluaa. Jotkut ovat ennalta määritettyjä ja toimivat keinona standardoida yleisesti käytettyjä tietoja, kuten Tx Power tai yhteyden katkeaminen, tarkempiin asioihin, kuten insuliiniin tai pulssioksimetriaan. Voit myös tehdä sellaisen ja tehdä sen kanssa mitä haluat. Ne on määritelty ohjelmistossa ja ne tunnistetaan UUID -tunnuksella. Voit tehdä UUID -tunnuksia täällä.

Tämän laitteen laiteohjelmistossa on yksi palvelu, joka määritellään seuraavasti:

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

ja kaksi ominaisuutta:

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

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

Tx_Characteristic on paikka, jossa laitteet lähettävät tietoja, kuten EC -mittaukset, verkkosivun näytettäväksi. Rx_Characteristic on kohta, jossa se vastaanottaa verkkosivulta suoritettavia komentoja.

Tämä projekti käyttää ArduinoBLE -kirjastoa. Jos katsot, näet, että on pari erilaista kuin julistaa ominaisuus. Tässä projektissa käytetään BLEStringCharacteristicia, koska käsittelemme String -tyyppiä ja se on vain helpompaa, mutta voit myös valita BLECharCharacteristic tai BLEByteCharacteristic kourallisen muiden joukosta.

Lisäksi on joitakin ominaisuuksia, joilla voit antaa ominaisuuden. tx_Characteristic on BLENotify -vaihtoehto. Tämä tarkoittaa, että verkkosivumme saavat ilmoituksen, kun sen arvo muuttuu. rx_Characteristicissa on BLEWrite, jonka avulla verkkosivumme voivat muokata sitä. On muitakin.

Sitten on vähän koodiliimaa, joka yhdistää kaikki nämä asiat yhteen:

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.mainos ();

Se on enemmän tai vähemmän itsestään selvää, mutta koskekaamme muutamaan kohtaan.

rx_Characteristic.setEventHandler (BLEWritten, rxCallback);

Tässä voit hyödyntää ilmoitusta arvon muutoksesta. Rivi kehottaa luokkaa suorittamaan rxCallback -funktion, kun arvoa muutetaan.

BLE.mainos ();

siitä koko homma lähtee liikkeelle. BLE -laite lähettää ajoittain pienen tietopaketin, joka ilmoittaa, että se on siellä ja käytettävissä yhdistämiseen. Ilman sitä se on näkymätön.

Vaihe 5: Tekstikomennot

Kuten aiemmin mainittiin, tämä laite puhuu verkkosivulle yksinkertaisten tekstikomentojen avulla. Koko asia on helppo toteuttaa, koska kova työ on jo tehty. UFire -antureissa on JSON- ja MsgPack -pohjainen kirjasto komentojen lähettämistä ja vastaanottamista varten. Voit lukea lisää EC- ja ISE -komennoista niiden dokumentaatiosivuilta.

Tämä projekti käyttää JSONia, koska sen käyttäminen ja lukeminen on hieman helpompaa, toisin kuin binäärinen MsgPack -muoto.

Tässä on esimerkki siitä, miten kaikki liittyy toisiinsa:

• Verkkosivu pyytää laitteelta EC -mittausta lähettämällä ec (tai tarkemmin sanottuna kirjoittamalla ec rx_Characteristic -ominaisuuteen)
• Laite vastaanottaa komennon ja suorittaa sen. Sitten se lähettää takaisin JSON -muotoisen vastauksen {"ec": 1.24} kirjoittamalla tx_Characteristic -ominaisuuteen.
• Verkkosivu vastaanottaa tiedot ja näyttää ne

Vaihe 6: Verkkosivu

Tämän projektin verkkosivu käyttää Vue.js-käyttöliittymää. Taustajärjestelmää ei tarvita. Lisäksi, jotta asiat olisivat hieman yksinkertaisempia, ei käytetä koontiversiota. Se on jaettu tavallisiin kansioihin, js javascriptille, css CSS: lle, resurssit kuvakkeille. Sen html -osa ei ole mitään erityistä. Se käyttää bulma.io -muotoilua ja luo käyttöliittymän. Huomaat paljon osiossa. Se lisää kaikki css ja kuvakkeet, mutta lisää myös yhden rivin erityisesti.

Se lataa manifest.json -tiedostoamme, mikä saa kaikki PWA -asiat tapahtumaan. Se ilmoittaa joitakin tietoja, jotka kertovat puhelimellemme, että tämä verkkosivu voidaan muuttaa sovellukseksi.

Javascriptissa tapahtuu suurin osa mielenkiintoisista asioista. Se on hajotettu tiedostoiksi, app.js sisältää Vue-verkkosivun perustiedot kaikkien käyttöliittymään liittyvien muuttujien ja muutamien muiden asioiden kanssa. ble.js sisältää bluetooth -tavaraa.

Vaihe 7: Javascript ja Web Bluetooth

Ensinnäkin tämä toimii vain Chromessa ja Operassa. Toivoisin muiden selainten tukevan tätä, mutta jostain syystä he eivät. Katso app.js ja näet samat UUID -tunnukset, joita käytimme laiteohjelmistossamme. Yksi uFire -palveluun ja yksi tx- ja rx -ominaisuuksiin.

Jos tarkastelet ble.js -tiedostoa, näet Connect () ja katkaise () -toiminnot.

Connect () -toiminto sisältää jonkin logiikan käyttöliittymän pitämiseksi synkronoituna, mutta se asettaa useimmiten asiat lähettämään ja vastaanottamaan tietoja ominaisuuksista.

Web -Bluetoothin käsittelyssä on joitain erityispiirteitä. Yhteys on aloitettava jollakin fyysisellä käyttäjän vuorovaikutuksella, kuten painikkeen napautuksella. Et voi muodostaa ohjelmallista yhteyttä esimerkiksi verkkosivun lataamisen yhteydessä.

Yhteyden muodostamisen koodi näyttää tältä:

this.device = odota navigator.bluetooth.requestDevice ({

suodattimet: [{namePrefix: "uFire"}], valinnaisetServices: [this.serviceUuid]});

Suodattimet: ja valinnainen Palvelut -osio tarvitaan, jotta jokainen BLE -laite ei näy siellä. Luulisi, että vain suodatinosio olisi hyvä, mutta tarvitset myös valinnaisen Palvelut -osan.

Yllä oleva koodi näyttää yhteysvalintaikkunan. Se on osa Chrome -käyttöliittymää, eikä sitä voi muuttaa. Käyttäjä valitsee luettelosta. Vaikka on vain yksi laite, johon sovellus koskaan muodostaa yhteyden, käyttäjän on silti käytävä tämä valintaikkuna läpi turvallisuusongelmien vuoksi.

Loput koodista määrittävät palvelun ja ominaisuudet. Huomaa, että määritämme takaisinsoittorutiinin, joka on samanlainen kuin laiteohjelmiston ilmoituksen soittopyyntö:

palvelu = odota palvelin.getPrimaryService (this.serviceUuid);

ominaisuus = odota palvelua.getCharacteristic (this.txUuid); odota ominaisuus.startNotifications (); character.addEventListener ("charactervaluechanged", this.value_update);

this.value_update kutsutaan nyt joka kerta, kun tx -ominaisuudesta on uutta tietoa.

Yksi viimeisistä asioista on asettaa ajastin päivittämään tiedot 5 sekunnin välein.

value_update () on vain pitkä toiminto, joka odottaa uusien JSON -tietojen saapumista ja päivittää käyttöliittymän sen avulla.

ec.js, ph.js ja orp.js sisältävät monia pieniä toimintoja, jotka lähettävät komentoja tietojen noutamiseksi ja laitteiden kalibroimiseksi.

Jos haluat kokeilla tätä, sinun on pidettävä mielessä, että jos haluat käyttää Web Bluetoothia, se on näytettävä HTTPS -yhteyden kautta. Yksi monista paikallisen HTTPS-palvelimen vaihtoehdoista on serve-https. Kun laiteohjelmisto on ladattu, kaikki yhdistetty ja verkkosivua näytetään, sinun pitäisi nähdä kaikki toimivat.

Vaihe 8: PWA -osa

Voit muuttaa verkkosivun todelliseksi sovellukseksi muutamalla tavalla. Progressiiviset verkkosovellukset voivat tehdä paljon enemmän kuin mihin tämä projekti käyttää.

• Verkkosivun asennus
• Asennuksen jälkeen offline -käyttö on mahdollista
• Käynnistyi ja toimii normaalina sovelluksena, jossa on tavallisen näköinen sovelluskuvake

Aloittaaksemme meidän on luotava joukko tiedostoja. Ensimmäinen on manifest.json -tiedosto. On kourallinen sivustoja, jotka tekevät tämän puolestasi, App Manifest Generator, yksi niistä.

Pari asiaa on ymmärrettävä:

• Sovelluksen laajuus on tärkeä. Laitoin tämän verkkosivun osoitteeseen ufire.co/uFire-BLE/. Tämä tarkoittaa, että sovellusalueeni on /uFire-BLE /.
• Aloitus -URL -osoite on myös tärkeä. Se on polku tietylle verkkosivullesi, jonka perusverkkotunnus on jo oletettu. Joten koska laitoin tämän osoitteeseen ufire.co/uFire-BLE/, aloitus-URL-osoite on/uFire-BLE/too.
• Näyttötila määrittää, miltä sovellus näyttää, Standalone näyttää sen olevan tavallinen sovellus ilman Chrome -painikkeita tai käyttöliittymää.

Päädyt json -tiedostoon. Se on sijoitettava verkkosivun juureen yhdessä index.html -tiedoston kanssa.

Seuraava asia, jonka tarvitset, on huoltotyöntekijä. Jälleen he voivat tehdä paljon, mutta tämä projekti käyttää vain välimuistia, jotta tämä sovellus voidaan käyttää offline -tilassa. Huoltotyöntekijän toteutus on pääosin kattilalevyä. Tämä projekti käytti Googlen esimerkkiä ja muutti välimuistissa olevien tiedostojen luettelon. Et voi tallentaa tiedostoja välimuistiin verkkotunnuksesi ulkopuolella.

Siirry FavIcon -generaattoriin ja tee joitain kuvakkeita.

Viimeinen asia on lisätä koodi Vue -asennettuun () -toimintoon.

asennettu: function () {if ('serviceWorker' navigaattorissa) {navigator.serviceWorker.register ('service-worker.js'); }}

Tämä rekisteröi työntekijän selaimeen.

Voit tarkistaa, että kaikki toimii, ja jos ei, ehkä selvitä miksi käyttämällä Lighthousia, se analysoi sivuston ja kertoo sinulle kaikenlaisia asioita.

Jos kaikki toimi, Chrome kysyy, kun menet verkkosivulle, haluatko asentaa sen ponnahdusbannerin avulla. Näet sen toiminnassa osoitteessa ufire.co/uFire-BLE/, jos käytät Chrome-mobiililaitetta. Jos käytät työpöytää, voit etsiä valikkokohdan sen asentamiseksi.