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

2024 Pengarang: John Day | [email protected]. Diubah suai terakhir: 2024-01-30 11:09

Oleh ufireFollow More oleh pengarang:

Tentang: Tambahkan keupayaan untuk mengukur pH, ORP, EC atau kemasinan pada projek Arduino atau Raspberry Pi anda. Lebih Lanjut Mengenai ufire »

Peranti untuk mengukur EC, pH, ORP, dan suhu. Ini dapat digunakan untuk memantau pengaturan kolam atau hidroponik. Ia akan berkomunikasi melalui Bluetooth Low Energy dan memaparkan maklumat di laman web menggunakan Web Bluetooth. Dan untuk keseronokan, kami akan mengubahnya menjadi Aplikasi Web Progresif yang boleh anda pasangkan dari web.

Langkah 1: Apakah Semua Syarat tersebut?

EC / pH / ORP / suhu adalah beberapa ukuran kualiti air yang paling biasa. Kekonduksian elektrik (EC) digunakan dalam hidroponik untuk mengukur larutan nutrien, pH seberapa berasid / asas air, dan ORP digunakan untuk membantu menentukan kemampuan air untuk membasmi kuman

• Tenaga Rendah Bluetooth adalah protokol tanpa wayar untuk menghantar dan menerima maklumat dengan mudah. Papan Arduino yang digunakan dalam projek ini adalah Nano 33 IoT dan dilengkapi dengan antara muka WiFi dan BLE.
• Web Bluetooth adalah sekumpulan API yang dilaksanakan dalam penyemak imbas Chrome Google (dan Opera) yang membolehkan laman web berkomunikasi secara langsung dengan peranti BLE.
• Aplikasi Web Progresif pada dasarnya adalah laman web yang bertindak seperti aplikasi biasa. Android dan iPhone mengendalikannya secara berbeza, dan berbeza di desktop, jadi anda perlu membaca sedikit untuk mengetahui spesifik.

Langkah 2: Perkakasan

Sebelum kita dapat memasang perkakasan, ada satu perkara yang perlu diberi perhatian. Peranti sensor uFire ISE dilengkapi dengan alamat I2C yang sama dan kami menggunakan dua, jadi satu mesti diubah. Untuk projek ini, kami akan memilih salah satu papan ISE dan menggunakannya untuk mengukur ORP. Ikuti langkah-langkah di sini, ubah alamat ke 0x3e.

Sekarang alamatnya diubah, menggabungkan perkakasan menjadi mudah. Semua peranti sensor menggunakan sistem penyambungan Qwiic jadi sambungkan semuanya bersama dalam rantai. Anda memerlukan satu wayar Qwiic ke Male untuk menyambungkan salah satu sensor ke Nano 33. Wayarnya konsisten dan berkod warna. Sambungkan hitam ke GND Nano, merah ke pin + 3.3V atau + 5V, biru ke pin SDA yang A4, dan kuning ke pin SCL pada A5.

Untuk projek ini, maklumat suhu akan datang dari sensor EC, jadi pastikan untuk memasang sensor suhu ke papan EC. Walaupun semua papan mempunyai kemampuan untuk mengukur suhu. Jangan lupa pasangkan probe EC, pH dan ORP ke sensor yang sesuai. Mereka mudah dipasang dengan penyambung BNC.

Sekiranya anda mempunyai kandang, memasukkan semua ini ke dalam adalah idea yang baik, terutamanya memandangkan air akan terlibat.

Langkah 3: Perisian

Bahagian perisian ini terbahagi kepada dua bahagian utama: firmware di Nano 33, dan halaman web.

Aliran asasnya adalah:

• Halaman web menghubungkan ke Nano melalui BLE
• Halaman web menghantar arahan berdasarkan teks untuk meminta maklumat atau mengambil tindakan
• Nano mendengar perintah tersebut, melaksanakannya, dan mengembalikan maklumat
• Halaman web menerima respons dan mengemas kini UI dengan sewajarnya

Penyediaan ini membolehkan laman web melakukan semua fungsi yang diperlukan yang anda harapkan, seperti melakukan pengukuran atau mengkalibrasi sensor.

Langkah 4: Perkhidmatan dan Karakteristik BLE

Salah satu perkara pertama yang perlu dipelajari adalah asas bagaimana BLE berfungsi.

Terdapat banyak analogi, jadi mari pilih buku. Perkhidmatan akan menjadi buku, dan ciri khas adalah halaman. Dalam "buku BLE" ini, halaman mempunyai beberapa sifat bukan buku seperti dapat mengubah apa yang dikatakan halaman dan menerima pemberitahuan apabila ia berlaku.

Peranti BLE boleh membuat seberapa banyak perkhidmatan yang diinginkan. Sebilangannya telah ditentukan dan bertindak sebagai cara untuk menyeragamkan maklumat yang biasa digunakan seperti Tx Power atau kehilangan sambungan, kepada perkara yang lebih spesifik seperti Insulin atau Pulse Oximetry. Anda juga boleh membuatnya dan melakukan apa sahaja yang anda mahukan dengannya. Mereka didefinisikan dalam perisian dan dikenal pasti dengan UUID. Anda boleh membuat UUID di sini.

Dalam firmware untuk peranti ini, ada satu perkhidmatan, yang ditakrifkan sebagai:

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

dan dua ciri:

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

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

Tx_Characteristic adalah tempat peranti menghantar maklumat, seperti pengukuran EC, agar laman web dapat dipaparkan. Rx_Characteristic adalah di mana ia akan menerima perintah dari laman web untuk dilaksanakan.

Projek ini menggunakan perpustakaan ArduinoBLE. Sekiranya anda melihat, anda akan melihat ada pasangan yang berbeza untuk menyatakan ciri. Projek ini menggunakan BLEStringCharacteristic kerana kita akan berurusan dengan jenis String dan lebih mudah, tetapi anda juga boleh memilih BLECharCharacteristic atau BLEByteCharacteristic dari sebilangan kecil.

Selain itu, terdapat beberapa sifat yang boleh anda berikan ciri. tx_Characteristic mempunyai BLEN memberi notifikasi sebagai pilihan. Ini bermaksud bahawa laman web kami akan menerima pemberitahuan apabila nilainya berubah. rx_Characteristic mempunyai BLEWrite yang membolehkan laman web kami mengubahnya. Ada yang lain.

Kemudian ada sedikit gam untuk mengaitkan semua perkara ini:

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

Ini lebih kurang jelas, tetapi mari kita menyentuh beberapa perkara.

rx_Characteristic.setEventHandler (BLEWritten, rxCallback);

Adakah tempat anda mengambil kesempatan untuk diberitahu tentang nilai yang diubah. Garis memberitahu kelas untuk melaksanakan fungsi rxCallback apabila nilainya diubah.

BLE. iklan ();

adalah yang memulakan semuanya. Peranti BLE secara berkala akan menghantar sebilangan kecil maklumat yang mengumumkan bahawa ia ada di luar sana dan tersedia untuk disambungkan. Tanpa itu, ia tidak akan dapat dilihat.

Langkah 5: Perintah Teks

Seperti yang telah disebutkan sebelumnya, peranti ini akan bercakap dengan laman web melalui perintah teks yang mudah. Keseluruhannya mudah dilaksanakan kerana kerja keras sudah dilakukan. Sensor uFire dilengkapi dengan perpustakaan berasaskan JSON dan MsgPack untuk menghantar dan menerima arahan. Anda boleh membaca lebih lanjut mengenai arahan EC dan ISE di halaman dokumentasi mereka.

Projek ini akan menggunakan JSON kerana sedikit lebih mudah untuk digunakan dan dibaca, tidak seperti format MsgPack yang bersifat binari.

Berikut adalah contoh bagaimana semuanya bersatu:

• Halaman web meminta alat untuk pengukuran EC dengan menghantar ec (atau lebih khusus menulis ec ke ciri rx_Characteristic)
• Peranti menerima arahan dan melaksanakannya. Ia kemudian menghantar kembali respons berformat JSON dari {"ec": 1.24} dengan menuliskan kepada ciri tx_Characteristic.
• Halaman web menerima maklumat dan memaparkannya

Langkah 6: Halaman Web

Halaman web untuk projek ini akan menggunakan Vue.js untuk bahagian depan. Tidak memerlukan backend. Selain itu, untuk membuat sesuatu menjadi lebih sederhana, tidak ada sistem binaan yang digunakan. Ia dibahagikan kepada folder biasa, js untuk javascript, css untuk CSS, aset untuk ikon. Bahagian html daripadanya tidak istimewa. Ia menggunakan bulma.io untuk menggayakan dan membuat antara muka pengguna. Anda akan melihat banyak perkara di bahagian ini. Ia menambah semua css dan ikon, tetapi juga menambahkan satu baris secara khusus.

Itu memuatkan fail manifest.json kami yang menjadikan semua perkara PWA berlaku. Ini menyatakan beberapa maklumat yang memberitahu bahawa laman web ini laman web kami dapat diubah menjadi aplikasi.

Javascript adalah tempat kebanyakan perkara menarik berlaku. Ia dipecah menjadi fail, app.js mengandungi asas-asas mendapatkan laman web Vue bersama dengan semua pemboleh ubah yang berkaitan dengan UI dan beberapa perkara lain. ble.js mempunyai barangan bluetooth.

Langkah 7: Javascript dan Bluetooth Web

Pertama, ini hanya berfungsi pada Chrome dan Opera. Saya berharap penyemak imbas lain menyokong ini, tetapi atas sebab apa pun, mereka tidak. Lihat app.js dan anda akan melihat UUID yang sama yang kami gunakan dalam firmware kami. Satu untuk Perkhidmatan uFire, dan masing-masing untuk ciri tx dan rx.

Sekarang jika anda melihat di ble.js, anda akan melihat fungsi sambung () dan putuskan ().

Fungsi connect () mengandungi beberapa logik untuk memastikan UI sentiasa diselaraskan, tetapi kebanyakannya mengatur untuk menghantar dan menerima maklumat mengenai ciri-ciri tersebut.

Terdapat beberapa keistimewaan ketika berurusan dengan Web Bluetooth. Sambungan mesti dimulakan dengan semacam interaksi pengguna fizikal, seperti mengetuk butang. Anda tidak dapat menyambung secara program ketika laman web dimuat, misalnya.

Kod untuk memulakan sambungan kelihatan seperti ini:

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

penapis: [{namePrefix: "uFire"}], pilihanServices: [this.serviceUuid]});

Bahagian penapis: dan pilihanServis diperlukan untuk mengelakkan melihat setiap peranti BLE di luar sana. Anda fikir hanya bahagian penapis yang baik, tetapi anda juga memerlukan bahagian Perkhidmatan pilihan.

Kod di atas akan menunjukkan dialog sambungan. Ini adalah sebahagian daripada antara muka Chrome dan tidak dapat diubah. Pengguna akan memilih dari senarai. Walaupun hanya ada satu peranti yang akan disambungkan oleh aplikasi, pengguna masih perlu melalui dialog pemilihan ini, kerana masalah keselamatan.

Selebihnya kod adalah menetapkan perkhidmatan dan ciri. Perhatikan bahawa kami mengatur rutin panggilan balik, serupa dengan panggilan balik pemberitahuan firmware:

perkhidmatan = tunggu server.getPrimaryService (this.serviceUuid);

ciri = tunggu perkhidmatan.getCharacteristic (this.txUuid); tunggu ciri.startNotifications (); characteristic.addEventListener ("characteristicvaluechanged", this.value_update);

ini.value_update sekarang akan dipanggil setiap kali ada maklumat baru mengenai ciri tx.

Salah satu perkara terakhir yang dilakukannya ialah menetapkan pemasa untuk mengemas kini maklumat setiap 5 saat.

value_update () hanyalah fungsi panjang yang menunggu maklumat JSON baru masuk dan mengemas kini UI dengannya.

ec.js, ph.js, dan orp.js mengandungi banyak fungsi kecil yang menghantar arahan untuk mengambil maklumat dan menentukurkan peranti.

Untuk mencuba ini, anda harus ingat bahawa untuk menggunakan Web Bluetooth, ia mesti diserahkan melalui HTTPS. Salah satu daripada banyak pilihan untuk pelayan HTTPS tempatan ialah melayani-https. Dengan firmware yang dimuat naik, semua yang disambungkan, dan halaman web disajikan, anda semestinya dapat melihat semuanya berfungsi.

Langkah 8: Bahagian PWA

Terdapat beberapa langkah untuk menjadikan laman web menjadi aplikasi sebenar. Aplikasi Web Progresif dapat melakukan lebih banyak daripada yang digunakan oleh projek ini.

• Pemasangan laman web
• Setelah dipasang, akses luar talian adalah mungkin
• Bermula dan berjalan sebagai aplikasi biasa dengan ikon aplikasi biasa

Untuk memulakan, kita perlu menghasilkan banyak fail. Yang pertama ialah fail manifest.json. Terdapat sebilangan kecil laman web yang akan melakukan ini untuk anda, App Manifest Generator, yang menjadi salah satu daripadanya.

Beberapa perkara yang perlu difahami:

• Skop permohonan adalah penting. Saya meletakkan laman web ini di ufire.co/uFire-BLE/. Ini bermaksud skop aplikasi saya adalah / uFire-BLE /.
• URL Mula juga penting. Ini adalah jalan ke laman web khusus anda dengan domain asas yang sudah diandaikan. Oleh kerana saya meletakkan ini di ufire.co/uFire-BLE/, URL permulaannya juga / uFire-BLE / juga.
• Mode Paparan akan menentukan bagaimana aplikasi terlihat, Standalone akan membuatnya menjadi aplikasi biasa tanpa butang atau antara muka Chrome.

Anda akan berakhir dengan fail json. Ia mesti diletakkan di akar laman web, bersama dengan index.html.

Perkara seterusnya yang anda perlukan adalah Pekerja Perkhidmatan. Sekali lagi, mereka dapat melakukan banyak perkara, tetapi projek ini hanya akan menggunakan cache untuk membolehkan aplikasi ini diakses di luar talian. Pelaksanaan pekerja perkhidmatan kebanyakannya adalah boilerplate. Projek ini menggunakan contoh Google dan mengubah senarai fail untuk di-cache. Anda tidak dapat menyimpan cache fail di luar domain anda.

Pergi ke FavIcon Generator dan buat beberapa ikon.

Perkara terakhir adalah menambahkan beberapa kod dalam fungsi Vue mount ().

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

Ini akan mendaftarkan pekerja dengan penyemak imbas.

Anda boleh memastikan bahawa semuanya berfungsi, dan jika tidak, mungkin mengetahui mengapa dengan menggunakan Rumah Api, ia akan menganalisis laman web dan memberitahu anda pelbagai perkara.

Sekiranya semuanya berfungsi, semasa anda pergi ke laman web, Chrome akan bertanya sama ada anda mahu memasangnya dengan sepanduk pop timbul. Anda dapat melihatnya dalam tindakan di ufire.co/uFire-BLE/ jika anda menggunakan Chrome mudah alih. Sekiranya anda menggunakan desktop, anda dapat mencari item menu untuk memasangnya.