Нано 33 IoT + EC/pH/ORP + WebAPK: 8 алхам

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

By ufireFollow Зохиогчийн дэлгэрэнгүй:

Тухай: Arduino эсвэл Raspberry Pi төсөлдөө рН, ORP, EC эсвэл давсны хэмжээг хэмжих чадварыг нэмээрэй. Ufire -ийн тухай дэлгэрэнгүй »

EC, рН, ORP, температурыг хэмжих төхөөрөмж. Үүнийг усан сан эсвэл гидропоник тохиргоог хянахад ашиглаж болно. Энэ нь Bluetooth Low Energy -ээр дамжуулан харилцах бөгөөд вэб Bluetooth ашиглан вэб хуудсан дээрх мэдээллийг харуулах болно. Мөн хөгжилтэй байхын тулд бид үүнийг вэбээс суулгах боломжтой Прогрессив Вэб Апп болгон хувиргах болно.

Алхам 1: Эдгээр бүх нэр томъёо юу вэ?

EC/pH/ORP/температур нь усны чанарын хамгийн түгээмэл хэмжигдэхүүнүүдийн нэг юм. Цахилгаан дамжуулах чанарыг (EC) гидропоникийн хувьд шим тэжээлийн уусмал, усны хүчиллэг/суурьт рН -ийг хэмжихэд ашигладаг бөгөөд усыг өөрөө ариутгах чадварыг тодорхойлоход ORP ашигладаг

• Bluetooth Low Energy нь мэдээлэл дамжуулах, хүлээн авахад хялбар утасгүй протокол юм. Энэхүү төсөлд ашигладаг Arduino самбар нь Nano 33 IoT бөгөөд WiFi болон BLE интерфэйстэй.
• Вэб Bluetooth нь Google -ийн Chrome хөтөч (болон Opera) дээр хэрэгжүүлсэн вэб хуудсыг BLE төхөөрөмжтэй шууд холбогдох боломжийг олгодог API -ийн багц юм.
• Прогрессив вэб програмууд нь үндсэн програм шиг ажилладаг вэб хуудсууд юм. Андройд болон iPhone -ийн хувьд тэдгээрийг өөр өөрөөр зохицуулдаг бөгөөд ширээний компьютер дээр өөр өөр байдаг тул та тодорхой зүйл унших хэрэгтэй болно.

Алхам 2: Тоног төхөөрөмж

Тоног төхөөрөмжийг угсрахаас өмнө нэг зүйлийг анхаарч үзэх хэрэгтэй. UFire ISE мэдрэгч төхөөрөмжүүд нь ижил I2C хаягаар ирдэг бөгөөд бид хоёрыг ашигладаг тул нэгийг нь өөрчлөх шаардлагатай болно. Энэ төслийн хувьд бид ISE -ийн самбаруудын нэгийг сонгож, ORP -ийг хэмжихэд ашиглах гэж байна. Энд байгаа алхмуудыг хийсний дараа хаягийг 0x3e болгон өөрчилнө үү.

Хаягийг өөрчилсөн тул техник хангамжийг нэгтгэх нь хялбар болно. Бүх мэдрэгч төхөөрөмжүүд Qwiic холболтын системийг ашигладаг тул бүгдийг гинжин хэлхээгээр холбоно уу. Нэг мэдрэгчийг нано 33 -т холбохын тулд танд Qwiic to Male утас хэрэгтэй болно. Утаснууд нь тууштай, өнгөөр кодлогдсон байдаг. Наногийн GND -т хар, улаан өнгийг +3.3V эсвэл +5V зүү, цэнхэр өнгөөр A4 SDA зүү, A5 дээрх SCL зүү рүү холбоно уу.

Энэ төслийн хувьд температурын мэдээллийг EC мэдрэгчээс авах болно, тиймээс температурын мэдрэгчийг EC хавтан дээр хавсаргахаа мартуузай. Бүх самбар нь температурыг хэмжих чадвартай байдаг. EC, pH, ORP датчикуудыг тохирох мэдрэгч рүү залгахаа бүү мартаарай. Тэд BNC холбогчоор амархан бэхлэгддэг.

Хэрэв та хашаа байшинтай бол энэ бүгдийг дотор нь оруулах нь сайн хэрэг болно, ялангуяа ус оролцоно гэж бодож байна.

Алхам 3: Програм хангамж

Үүний програм хангамжийн хэсгийг хоёр үндсэн хэсэгт хуваадаг: Nano 33 дээрх програм хангамж ба вэб хуудас.

Үндсэн урсгал нь дараах байдалтай байна.

• Вэб хуудас нь нано руу BLE -ээр холбогддог
• Вэб хуудас нь мэдээлэл хүсэх эсвэл арга хэмжээ авахын тулд текст дээр суурилсан тушаалыг илгээдэг
• Нано эдгээр тушаалуудыг сонсож, тэдгээрийг гүйцэтгэж, мэдээллийг буцааж өгдөг
• Вэб хуудас нь хариултуудыг хүлээн авч, UI -ийг зохих ёсоор шинэчилдэг

Энэхүү тохиргоо нь вэб хуудсыг хэмжих эсвэл мэдрэгчийг тохируулах гэх мэт шаардлагатай бүх функцийг гүйцэтгэх боломжийг олгодог.

Алхам 4: BLE үйлчилгээ ба шинж чанар

Хамгийн түрүүнд сурч мэдэх зүйл бол BLE хэрхэн ажилладаг тухай үндсэн ойлголтууд юм.

Аналоги зөндөө байгаа тул номыг сонгоё. Үйлчилгээ бол ном, шинж чанар нь хуудсууд байх болно. Энэхүү "BLE ном" -д хуудсууд нь хуудасны хэлсэн зүйлийг өөрчлөх, ийм зүйл тохиолдвол мэдэгдэл хүлээн авах гэх мэт хэд хэдэн номын бус шинж чанартай байдаг.

BLE төхөөрөмж нь хүссэн хэмжээгээрээ үйлчилгээ үзүүлэх боломжтой. Заримыг урьдчилан тодорхойлсон бөгөөд Tx Power эсвэл холболт тасрах гэх мэт түгээмэл хэрэглэгддэг мэдээллийг инсулин эсвэл импульсийн оксиметр гэх мэт илүү тодорхой зүйлд стандартчилах арга болдог. Та мөн үүнийг хийж, хүссэн зүйлээ хийж болно. Тэд програм хангамжид тодорхойлогддог бөгөөд UUID -ээр тодорхойлогддог. Та энд UUID хийх боломжтой.

Энэ төхөөрөмжийн програм хангамжийн програмд дараахь үйлчилгээгээр тодорхойлогддог.

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

ба хоёр шинж чанар:

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

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

Tx_Characteristic нь төхөөрөмжүүдийг вэб хуудсыг харуулахын тулд EC хэмжилт гэх мэт мэдээллийг илгээдэг газар байх болно. Rx_Characteristic нь вэб хуудсаас гүйцэтгэх тушаалуудыг хүлээж авах газар юм.

Энэ төсөл нь ArduinoBLE номын санг ашигладаг. Хэрэв та харвал шинж чанараа зарлахад өөр өөр хосууд байгааг олж харах болно. Энэ төсөл нь BLEStringCharacteristic -ийг ашигладаг, учир нь бид String төрөлтэй харьцах болно, гэхдээ энэ нь илүү хялбар болно, гэхдээ та BLECharCharacteristic эсвэл BLEByteCharacteristic -ийг цөөн хэдэн хүмүүсийн дундаас сонгож болно.

Нэмж дурдахад та шинж чанараа өгөх зарим шинж чанарууд байдаг. tx_Characteristic нь BLENotify -ийг сонголт болгон ашигладаг. Энэ нь үнэ цэнэ өөрчлөгдөхөд манай вэб хуудас мэдэгдэл хүлээн авна гэсэн үг юм. rx_Characteristic нь манай вэб хуудсыг өөрчлөх боломжийг олгодог BLEWrite програмтай. Бусад нь байдаг.

Дараа нь энэ бүх зүйлийг хооронд нь холбохын тулд жаахан код цавуу байна:

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

Энэ нь их бага хэмжээгээр өөрийгөө тайлбарлаж байгаа боловч цөөн хэдэн зүйлд хүрье.

rx_Characteristic.setEventHandler (BLEWritten, rxCallback);

Өөрчлөгдсөн үнэ цэнийн талаар танд мэдэгдэх давуу талыг ашигладаг газар. Шугам нь утгыг өөрчлөх үед rxCallback функцийг гүйцэтгэхийг ангийнханд хэлдэг.

BLE.advertis ();

бүх зүйл эхэлж байгаа юм. BLE төхөөрөмж нь тэнд байгаа бөгөөд холбогдох боломжтой гэдгээ зарлах жижиг мэдээллийн багцыг үе үе явуулж байх болно. Үүнгүйгээр энэ нь үл үзэгдэх болно.

Алхам 5: Текст командууд

Өмнө дурьдсанчлан, энэ төхөөрөмж нь вэб хуудастай энгийн текст командыг ашиглан ярих болно. Хэцүү ажил аль хэдийн хийгдсэн тул бүх зүйлийг хэрэгжүүлэхэд хялбар байдаг. UFire мэдрэгч нь JSON болон MsgPack дээр суурилсан номын сантай бөгөөд командыг илгээх, хүлээн авах боломжтой. Та EC болон ISE командуудын талаар илүү ихийг тэдний баримт бичгийн хуудаснаас уншиж болно.

Энэ төсөл нь JSON -ийг ашиглах болно, учир нь хоёртын форматтай MsgPack форматаас ялгаатай нь ажиллахад хялбар бөгөөд уншихад хялбар байдаг.

Энэ бүхэн хэрхэн хоорондоо уялдаатай байгаагийн жишээг энд харуулав.

• Вэб хуудас нь төхөөрөмжөөс EC хэмжилт хийхийг хүсдэг.
• Төхөөрөмж нь тушаалыг хүлээн авч, түүнийг гүйцэтгэдэг. Дараа нь tx_Characteristic шинж чанар руу бичих замаар JSON форматтай {"ec": 1.24} хариуг буцааж илгээдэг.
• Вэб хуудас нь мэдээллийг хүлээн авч харуулдаг

Алхам 6: Вэб хуудас

Энэхүү төслийн вэб хуудас нь урд хэсэгт Vue.js-ийг ашиглах болно. Арын хэсэг шаардлагагүй. Нэмж хэлэхэд, бүх зүйлийг арай хялбар болгохын тулд бүтээх системийг ашигладаггүй. Энэ нь ердийн хавтас, javascript -д зориулсан js, CSS -д зориулсан CSS, дүрс тэмдгүүдэд зориулагдсан өмчүүдэд хуваагддаг. Html хэсэг нь онцгой зүйл биш юм. Энэ нь bulma.io -ийг сарлагийн саваг ашиглахад хэрэглэгчийн интерфэйсийг бий болгодог. Та энэ хэсэгт маш их зүйлийг анзаарах болно. Энэ нь бүх CSS болон дүрсүүдийг нэмж байгаа боловч нэг мөрийг нэмж оруулсан болно.

Энэ нь манай manifest.json файлыг ачаалж байгаа бөгөөд энэ нь PWA -ийн бүх зүйлийг хийдэг. Энэ нь манай вэбсайтыг апп болгон хувиргах боломжтой гэсэн зарим мэдээллийг зарлаж байна.

JavaScript бол ихэнх сонирхолтой зүйл тохиолддог. Үүнийг файл болгон хуваасан бөгөөд app.js нь Vue вэб хуудсыг UI-тэй холбоотой бүх хувьсагч болон бусад цөөн хэдэн зүйлтэй хамт авах үндсийг агуулдаг. ble.js нь bluetooth төхөөрөмжтэй.

Алхам 7: Javascript ба вэб Bluetooth

Нэгдүгээрт, энэ нь зөвхөн Chrome болон Opera дээр ажилладаг. Бусад хөтчүүд үүнийг дэмжиж өгөхийг хүсч байна, гэхдээ ямар ч шалтгаанаар дэмждэггүй. App.js -ийг үзээд бидний програм хангамжид ашигласан UUID -ийг харах болно. Нэг нь uFire үйлчилгээнд, нэг нь tx ба rx шинж чанарт зориулагдсан болно.

Хэрэв та ble.js -ийг үзвэл connect () ба disconnect () функцийг харах болно.

Connect () функц нь UI -ийг синхрончлох логикийг агуулдаг боловч ихэнхдээ шинж чанаруудын талаар мэдээлэл илгээх, хүлээн авахад тохируулдаг.

Вэб Bluetooth -тэй ажиллахдаа зарим онцлог шинж чанарууд байдаг. Холболтыг товчлуурыг дарах гэх мэт хэрэглэгчийн бие махбодийн харилцан үйлчлэлээр эхлүүлэх ёстой. Жишээлбэл, вэб хуудсыг ачаалах үед та програмаар холбогдож чадахгүй.

Холболтыг эхлүүлэх код дараах байдлаар харагдаж байна.

this.device = navigator.bluetooth.requestDevice хүлээж байна ({

шүүлтүүрүүд: [{namePrefix: "uFire"}], optionalServices: [this.serviceUuid]});

BLE төхөөрөмж бүрийг тэндээс харахгүй байхын тулд шүүлтүүрүүд болон нэмэлт үйлчилгээний хэсгүүд шаардлагатай болно. Та зөвхөн шүүлтүүр хэсэг нь зүгээр байх гэж бодож байна, гэхдээ танд нэмэлт үйлчилгээний хэсэг бас хэрэгтэй болно.

Дээрх код нь холболтын харилцах цонхыг харуулах болно. Энэ нь Chrome интерфэйсийн нэг хэсэг бөгөөд үүнийг өөрчлөх боломжгүй юм. Хэрэглэгч жагсаалтаас сонгох болно. Апп -д холбогдох ганц төхөөрөмж байсан ч гэсэн аюулгүй байдлын үүднээс хэрэглэгч энэ сонголтын цонхыг давах шаардлагатай хэвээр байна.

Кодын үлдсэн хэсэг нь үйлчилгээ, шинж чанарыг тохируулах явдал юм. Бид firmware -ийн мэдэгдэл буцааж дууддагтай адил дуудлага хийх горимыг тохируулсан болохыг анхаарна уу.

үйлчилгээ = server.getPrimaryService (this.serviceUuid) хүлээж байна;

шинж чанар = үйлчилгээ хүлээж байна.getCharacteristic (this.txUuid); шинж чанарыг хүлээж байна.startNotifications (); шинж чанар.addEventListener ("шинж чанарын үнэ цэнийг өөрчилсөн", энэ. үнэ цэнэ_ шинэчлэлт);

this.value_update одоо tx шинж чанарын талаар шинэ мэдээлэл гарах бүрт дуудагдах болно.

Хамгийн сүүлд хийдэг зүйл бол 5 секунд тутамд мэдээллийг шинэчлэх таймерыг тохируулах явдал юм.

value_update () нь JSON -ийн шинэ мэдээлэл орж ирэхийг хүлээж, интерфэйсийг шинэчилдэг урт функц юм.

ec.js, ph.js, orp.js нь мэдээлэл авах, төхөөрөмжүүдийг тохируулах командыг илгээдэг олон жижиг функцуудыг агуулдаг.

Үүнийг туршихын тулд Вэб Bluetooth ашиглахын тулд үүнийг HTTPS -ээр дамжуулах ёстой гэдгийг санах хэрэгтэй. Орон нутгийн HTTPS серверийн олон сонголтуудын нэг бол service-https юм. Програм хангамжийг байршуулж, бүх зүйлийг холбож, вэб хуудсыг ашигласнаар та ажиллаж байгаа бүх зүйлийг харах боломжтой байх ёстой.

Алхам 8: PWA хэсэг

Вэб хуудсыг жинхэнэ апп болгох хэд хэдэн алхам байдаг. Прогрессив Вэб Аппликейшн нь энэ төслийн ашигласнаас хамаагүй ихийг хийж чадна.

• Вэб хуудас суурилуулах
• Суулгасны дараа офлайн хандалт хийх боломжтой
• Тогтмол харагддаг апп дүрс бүхий ердийн апп хэлбэрээр ажиллаж эхэлсэн

Эхлэхийн тулд бид олон тооны файл үүсгэх шаардлагатай болно. Эхнийх нь manifest.json файл юм. Апп Манифест Генератор, тэдний нэг болох танд үүнийг хийх цөөн хэдэн сайтууд байна.

Ойлгох ёстой хэдэн зүйл:

• Хэрэглээний хамрах хүрээ чухал юм. Би энэ вэб хуудсыг ufire.co/uFire-BLE/ дээр тавьсан. Энэ нь миний хэрэглээний хамрах хүрээ нь /uFire-BLE /гэсэн үг юм.
• Эхлэх URL нь бас чухал юм. Энэ бол үндсэн домэйныг аль хэдийн авч үзсэн вэбсайт руу чиглүүлэх зам юм. Тиймээс би үүнийг ufire.co/uFire-BLE/ хаягаар оруулсан тул эхлэлийн URL нь/uFire-BLE/бас байна.
• Дэлгэцийн горим нь програм хэрхэн харагдахыг тодорхойлох бөгөөд бие даасан байдал нь Chrome -ийн ямар ч товчлуур, интерфейсгүй ердийн апп шиг харагдуулах болно.

Та json файлтай болно. Үүнийг вэб хуудасны эхэнд index.html хаягийн хамт байрлуулах ёстой.

Дараагийн зүйл бол үйлчилгээний ажилтан юм. Дахин хэлэхэд тэд маш их зүйлийг хийж чадна, гэхдээ энэ төсөл нь энэ аппликейшнийг офлайн горимд ашиглахын тулд зөвхөн кэшийг ашиглах болно. Үйлчилгээний ажилтны хэрэгжилт нь ихэвчлэн зуух юм. Энэ төсөл нь Google -ийн жишээг ашиглан кэш хийх файлуудын жагсаалтыг өөрчилсөн. Та өөрийн домэйнаас гадуур файлуудыг кэш хийх боломжгүй.

FavIcon Generator руу ороод хэдэн дүрс бэлдээрэй.

Хамгийн сүүлд хийх зүйл бол Vue mounted () функцэд зарим код нэмэх явдал юм.

холбогдсон: function () {if ('serviceWorker' in navigator) {navigator.serviceWorker.register ('service-worker.js'); }}

Энэ нь ажилчдыг хөтөч дээр бүртгэх болно.

Та бүх зүйл ажиллаж байгаа эсэхийг шалгаж болно, хэрэв үгүй бол Lighthouse -ийг ашигласнаар энэ нь сайтыг шинжилж, танд янз бүрийн зүйлийг хэлэх болно.

Хэрэв бүх зүйл үр дүнтэй болсон бол вэб хуудас руу ороход Chrome танд попап баннер ашиглан суулгахыг хүсэх болно. Хэрэв та мобайл Chrome дээр байгаа бол үүнийг ufire.co/uFire-BLE/ дээрээс харж болно. Хэрэв та ширээний компьютер дээр байгаа бол үүнийг суулгах цэсийг олох боломжтой.