Automasi Rumah Menggunakan Portal Tangkap: 9 Langkah

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

Di sini, kita akan membuat projek automasi rumah berasaskan Captive Portal yang sangat menarik menggunakan nodeMCU dari awal.. Jadi, mari kita mulakan..

Langkah 1: Pernyataan Awal

Menyatakan pin IO nodeMCU untuk melakukan Tindakan, Fail Header dan kod untuk membuat pelayan DNS..tunjukkan dalam gambar..

Langkah 2: Html Code untuk Front End I.e. Halaman Log Masuk

Seperti yang ditunjukkan dalam gambar, nyatakan kod html dalam variabel rentetan yang kami kirimkan kepada pengguna akhir untuk pengesahan Kod Akses.

* Untuk menangkap data yang dimasukkan oleh pengguna di sini kami menggunakan anchor pane dan tag href

* Pada dasarnya tag Anchor digunakan untuk menambahkan laman web lain dalam laman web dan tag href menentukan tujuan pautan.

* Tetapi, di sini kami menerima data yang dimasukkan oleh pengguna dalam bidang Kod Akses melalui Anchor Pane dan tag href…

bagaimana, saya akan menyebutkan mengenai dua kaedah menangkap input dari antara muka web hingga alat pengaturcara kita berakhir..

Langkah 3: Penggunaan Kaedah WebServer.arg () dan WebServer.on ()

Seperti yang saya nyatakan pada langkah sebelumnya saya akan memberitahu anda dua kaedah yang berbeza..

1) Dengan menggunakan kaedah webServer.arg ():

Di sini, kami menentukan atribut autofokus bersama elemen seperti yang ditunjukkan dalam gambar, Apa yang autofokus lakukan adalah bahawa ia adalah atribut boolean apabila benar bermaksud menunjukkannya memastikan bahawa elemen input menjadi fokus ketika halaman dimuat.

dan kemudian, kita memanggil kaedah args () pada objek pelayan. Kaedah ini akan mengembalikan bilangan parameter pertanyaan yang diteruskan pada HTTP dan menerapkan pernyataan bersyarat untuk melakukan tindakan yang sesuai.

2) Dengan menggunakan dan atribut href:

Di sini, kami menentukan elemen kawalan kami (seperti butang) di dalamnya dan memberikan rentetan, char, link yang anda ingin mengesahkannya menggunakan pernyataan bersyarat dan kemudian kami memanggil webServer.on () untuk menerima input untuk pengesahan.

Seperti yang ditunjukkan..

Langkah 4: Sekiranya Jenis Pengguna Keliru Salah

Apa yang telah saya lakukan, ubah kod halaman log masuk yang ada dan tambahkan tajuk baru yang memaklumkan bahawa pengguna telah memasukkan kelayakan yang salah..

Pertama mengesahkan kelayakan jika salah mengarahkan pengguna ke halaman log masuk yang baru diedit yang menunjukkan mesej ralat.

Seperti yang ditunjukkan..

Langkah 5: Cara Menambah Imej ke Halaman Web Anda

Ini sangat mudah, kerana di sini kita tidak menyimpan gambar kita ke storan fizikal sehingga kita menyediakan jalan untuk mengambil gambar yang biasanya kita lakukan sekiranya halaman html.

jadi apa yang kita buat hanyalah menukar gambar kita menjadi base64 dan menampalnya dalam kod halaman kita Seperti yang ditunjukkan..

Langkah 6: Apa Komponen yang Kita Perlu

1) - nodeMCU

2) - Arduino IDE untuk flash nodeMCU

3) -jumper wayar (F-2-F)

4) -Relay Module

5) -Sebuah telefon pintar atau komputer riba yang membolehkan WiFi untuk diuji

Langkah 7: Sambungan

Tambahkan modul geganti ke pin IO yang dinyatakan dalam kod.

Sambungkan Relay ke peralatan elektrik yang ingin anda kendalikan seperti yang ditunjukkan dalam gambar..

Langkah 8: Sekarang Uji dan Nikmati

Langkah 9: Kod Di Sini

Sila tulis komen berharga anda..