ESP8266 dan Visuino: Pelayan Web Suhu dan Kelembapan DHT11: 12 Langkah

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

Modul ESP8266 adalah pengawal kendiri kos rendah yang hebat dengan Wi-Fi terbina dalam, dan saya sudah membuat sebilangan Instruksional mengenai mereka.

DTH11 / DTH21 / DTH22 dan AM2301 adalah gabungan sensor Suhu dan Kelembapan Arduino yang sangat popular, dan saya juga membuat sejumlah Instruksional, termasuk Termometer Pengukur Jauh dan Sensor Kelembapan dengan 2 ESP8266 yang dihubungkan bersama di rangkaian Wi-Fi peribadi mereka sendiri.

Dalam Instructable ini saya akan menunjukkan kepada anda bagaimana anda boleh membuat Pelayan Web Suhu dan Kelembapan dengan ESP8266 dan DHT11 dan menyambung ke rangkaian Wi-Fi anda yang ada dari pelbagai peranti dengan penyemak imbas web.

Langkah 1: Komponen

1. Papan OneNodeMCU ESP8266 (Saya menggunakan versi NodeMCU 0.9, tetapi yang lain, atau bahkan berdiri sendiri ESP-12 atau ESP-01 akan berfungsi)
2. Satu modul Sensor DHT11 yang saya dapat dari set 37 sensor murah ini
3. 3 wayar pelompat Wanita-Wanita

Langkah 2: Sambungkan DHT11 ke Modul NodeMCU ESP8266

1. Sambungkan Daya (Kawat merah), Tanah (Kawat hitam), dan Data (Kawat kelabu) ke Modul DHT11 (Gambar 1 menunjukkan 2 jenis modul sensor DHT11. Seperti yang anda lihat, pin mungkin berbeza, jadi sambungkan dengan teliti!)
2. Sambungkan hujung wayar Ground (wayar hitam) yang lain ke pin Ground modul ESP8266 (Gambar 2)
3. Sambungkan hujung wayar Daya (wayar Merah) yang lain ke pin Kuasa 3.3V modul ESP8266 (Gambar 2)
4. Sambungkan hujung wayar Data yang lain (wayar kelabu) ke pin Digital 2 modul ESP8266 (Gambar 3)
5. Gambar 4 menunjukkan di mana Ground, 3.3V Power, dan Digital 2 pin NodeMCU 0.9

Langkah 3: Mulakan Visuino, dan Pilih Jenis Papan ESP8266

Untuk mula memprogram Arduino, anda perlu memasang Arduino IDE dari sini:

Perlu diketahui bahawa terdapat beberapa bug kritikal dalam Arduino IDE 1.6.6

Pastikan anda memasang 1.6.7 atau lebih tinggi, jika tidak, Instructable ini tidak akan berfungsi!

Sekiranya anda belum selesai, ikuti langkah-langkah dalam Petunjuk ini untuk mengatur Arduino IDE untuk memprogram ESP 8266

Visuino: https://www.visuino.com juga perlu dipasang.

1. Mulakan Visuinoas yang ditunjukkan pada gambar pertama
2. Klik pada butang "Alat" pada komponen Arduino (Gambar 1) di Visuino
3. Apabila dialog muncul, pilih "NodeMCU ESP-12" seperti yang ditunjukkan pada Gambar 2

Langkah 4: Di Visuino: Tetapkan Nama Host dan Titik Akses

Mula-mula kita perlu mengkonfigurasi modul untuk menyambung ke Access Point yang ada dan memberikan HostName padanya sehingga kita dapat mencarinya di rangkaian.

1. Di Object Inspector, kembangkan properti "Modul", kemudian sub properti "WiFi"
2. Dalam Object Inspector tetapkan nilai harta "HostName" ke "dht11server" (Gambar 1)
3. Di Object Inspector, kembangkan sub properti "AccessPoints" "WiFi", dan klik pada butang "…" di sebelah nilainya (Gambar 2)
4. Dalam editor "AccessPoins", pilih "WiFi Access Point" di pandangan kanan, dan kemudian klik pada butang "+" di sebelah kiri untuk menambahkan titik akses (Gambar 2)
5. Dalam Pemeriksa Objek, tetapkan nilai harta "SSID" ke SSID Hotspot Wi-Fi anda (Titik Akses) (Gambar 4)
6. Sekiranya Hotspot Wi-Fi (Titik Akses) anda memerlukan kata laluan, Di Objek Pemeriksa, tetapkan kata laluan dalam nilai harta "Kata Laluan" (Gambar 4)
7. Tutup dialog "AccessPoints"

Langkah 5: Di Visuino: Tambahkan Socket Server TCP / IP untuk Komunikasi

Seterusnya kita perlu menambahkan soket Pelayan TCP / IP untuk komunikasi.

1. Dalam Pemeriksa Objek, klik pada butang "…" di sebelah nilai sub harta "Soket" WiFi (Gambar 1)
2. Dalam editor Sockets pilih "TCP / IP Server", dan kemudian klik pada butang "+" (Gambar 2) untuk menambah satu (Gambar 3)
3. Tutup dialog "Soket"

Langkah 6: Di Visuino: Tambahkan DTH11 dan Komponen Teks Berformat Dengan 2 Saluran Analog

Untuk mengawal dan membaca Suhu dan Kelembapan dari DHT11, kita perlu menambahkan komponennya di Visuino.

Kita juga perlu menghasilkan laman web dari data. Halaman ini hanyalah dokumen teks HTML, jadi kita dapat menggunakan komponen Teks Berformat untuk membuatnya.

1. Ketik "dht" di kotak Penapis pada Kotak Alat Komponen kemudian pilih komponen "Kelembapan dan Termometer DHT11 / 21/22 / AM2301" (Gambar 1), dan lepaskan di kawasan reka bentuk
2. Ketik "borang" di kotak Penapis pada Kotak Alat Komponen kemudian pilih komponen "Teks Berformat" (Gambar 2), dan lepaskan di kawasan reka bentuk
3. Klik pada butang "Alat" komponen FormattedText1 (Gambar 3)
4. Dalam editor Elemen, pilih Elemen Analog di sebelah kanan, dan klik 2 kali pada butang "+" di sebelah kiri (Gambar 4), untuk menambah 2 daripadanya (Gambar 5)
5. Tutup penyunting "Elemen"

Langkah 7: Dalam Visuino: Tetapkan Teks Berformat untuk Respons Pelayan

Kita perlu menentukan teks HTML yang akan dihasilkan ketika pelanggan web menyambung ke pelayan.

Kami akan menentukan sambungan yang akan ditutup setelah data yang saya hantar, dan juga akan mengarahkan penyemak imbas menyambung semula (Refresh) setelah 5 saat dengan menambahkan "Refresh: 5" ke dokumen. Dengan cara ini laman web akan disegarkan setiap 5 saat.

1. Di Kawasan Reka Bentuk, pilih komponen FormattedText1 (Gambar 1)
2. Dalam Pemeriksa Objek pilih harta "Teks", dan klik pada butang "…" di sebelah nilainya (Gambar 1)
3. Dalam jenis "Text" editor: "HTTP / 1.1 200 OK" "Content-Type: text / html" "Connection: close" "Refresh: 5" "" """"""" Suhu:% 0 "" Kelembapan:% 1 "" "" (Gambar 2)% 0 akan diganti dengan nilai dari AnalogElement1, dan% 1 akan diganti dengan nilai dari AnalogElement2
4. Klik pada butang OK untuk menutup dialog

Langkah 8: Di Visuino: Sambungkan Komponen DHT11

1. Sambungkan pin output "Suhu" komponen HumidityThermometer1 ke pin "In" AnalogElement1 komponen FormattedText1 (Gambar 1)
2. Sambungkan pin keluaran "Kelembapan" komponen HumidityThermometer1 ke pin "In" AnalogElement2 komponen FormattedText1 (Gambar 2)
3. Sambungkan pin "Sensor" komponen HumidityThermometer1 ke pin input "Digital" saluran "Digital [2]" komponen Arduino (Gambar 3)

Langkah 9: Di Visuino: Tambah dan Sambungkan Komponen Edge Detect

Kita perlu menghantar teks HTML setiap kali ada sambungan baru. Sebelum menghantar, kita perlu menunggu sedikit kerana penyemak imbas web harus menghantar permintaan sebelum mereka berharap dapat melihat hasilnya. Untuk melakukan itu, kita akan menggunakan komponen Delay yang disambungkan ke pin "Connected" pada TCP / IP Server Socket.

1. Ketik "kelewatan" di kotak Penapis pada Kotak Alat Komponen kemudian pilih komponen "Kelewatan" (Gambar 1), dan lepaskan di kawasan reka bentuk
2. Dalam Properties tetapkan nilai harta "Interval (uS)" ke 200000 (Gambar 2)
3. Sambungkan pin "Bersambung" dari "Modul. WiFi. Sockets. TCPServer1" komponen "NodeMCU ESP-12", ke pin "In" komponen Delay1 (Gambar 3)
4. Sambungkan pin "Keluar" komponen Delay1 ke pin input "Jam" komponen FormattedText1 (Gambar 4)

Langkah 10: Di Visuino: Sambungkan Komponen Teks Berformat, dan Tambah dan Sambungkan Komponen Kelewatan

1. Sambungkan pin "Keluar" komponen FormattedText1 ke pin "In" pada modul "Modul. WiFi. Sockets. TCPServer1" komponen "NodeMCU ESP-12" (Gambar 1)
2. Ketik "kelewatan" di kotak Penapis pada Kotak Alat Komponen kemudian pilih komponen "Kelewatan" (Gambar 2), dan lepaskan di kawasan reka bentuk
3. Sambungkan pin "Keluar" komponen FormattedText1 ke pin "In" komponen Delay2 (Gambar 3)
4. Sambungkan pin "Keluar" komponen Delay2 ke pin input "Putuskan sambungan" "Modul. WiFi. Sockets. TCPServer1" komponen "NodeMCU ESP-12" (Gambar 4)

Komponen Kelewatan akan memutuskan soket sejurus teks dihantar.

Langkah 11: Hasilkan, Susun, dan Muat Naik Kod Arduino

1. Di Visuino, Tekan F9 atau klik pada butang yang ditunjukkan pada Gambar 1 untuk menghasilkan kod Arduino, dan buka Arduino IDE
2. Sambungkan modulNodeMCU dengan kabel USB ke komputer
3. Pilih jenis papan dan port bersiri seperti yang telah saya tunjukkan dalam Instruktif ini
4. Di Arduino IDE, klik pada butang Upload, untuk menyusun dan memuat naik kod (Gambar 2)

Langkah 12: Dan Main …

Tahniah! Anda telah membuat Pelayan Web Suhu dan Kelembapan Wi-Fi.

Pada Gambar 1 dan dalam Video anda dapat melihat projek yang dihubungkan dan dihidupkan. Saya menggunakan Power Bank USB kecil untuk menghidupkan modul.

Pastikan dalam projek pada Langkah 4 anda telah memasukkan SSID dan Kata Laluan yang betul untuk tempat liputan Wi-Fi anda

Sekiranya anda membuka penyemak imbas web di komputer atau peranti mudah alih anda, dan taip:

dht11server./

Dan tekan Enter, anda akan melihat suhu dan kelembapan yang diukur oleh modul. Bacaan akan disegarkan setiap 5 saat seperti yang ditentukan dalam Langkah 7.

Pastikan untuk menambahkan Titik di hujung nama, jika tidak Windows tidak dapat menyelesaikan nama domain

Pada Gambar 2 anda dapat melihat gambarajah Visuino yang lengkap.

Juga dilampirkan adalah projek Visuino, yang saya buat untuk Instructable ini. Anda boleh memuat turun dan membukanya di Visuino: