- Apa itu AJAX?
- Bagaimana AJAX Berfungsi?
- Komponen Diperlukan untuk membina Pelayan Web Berasaskan AJAX dan ESP8266
- Pelayan Web Ajax dan ESP8266 - Diagram Litar
- Kod Pelayan Web Berasaskan AJAX untuk ESP8266
Dalam banyak aplikasi IoT, terdapat situasi di mana data sensor perlu dipantau secara berterusan, dan cara termudah untuk melakukannya adalah dengan mengaktifkan pelayan web ESP8266 yang melayani laman web HTML; tetapi masalah dengan metodologi ini adalah bahawa penyemak imbas web perlu disegarkan pada selang waktu tertentu untuk mendapatkan data sensor yang dikemas kini. Ini bukan sahaja tidak cekap tetapi memerlukan banyak pusingan jam di mana tugas-tugas lain dapat dilakukan. Penyelesaian untuk masalah ini dikenali sebagai "Asynchronous JavaScript and XML" atau AJAX secara ringkas. Dengan menggunakan AJAX, kita dapat memantau data masa nyata tanpa menyegarkan keseluruhan halaman web, ini bukan hanya menjimatkan masa, tetapi juga menjimatkan kitaran jam yang berharga. Ikuti dan dalam artikel ini, anda akan belajar bagaimana melaksanakan pelayan web berasaskan AJAX di ESP8266.
Apa itu AJAX?
Seperti yang telah kita bahas sebelumnya, AJAX adalah singkatan dari "Asynchronous JavaScript and XML" yang dapat digunakan untuk mengemas kini sebagian halaman web tanpa memuatkan kembali halaman entail. Ia melakukannya dengan meminta dan menerima data dari pelayan secara spontan. Fungsi AJAX adalah untuk mengemas kini kandungan web secara serentak. Ini bermaksud penyemak imbas web pengguna tidak perlu memuat semula seluruh laman web apabila hanya sebahagian kandungan di halaman yang perlu diperbarui.
Contoh sehari-hari AJAX akan menjadi ciri cadangan Google, ketika kita menaip di bar carian Google, Google mula mencadangkan rentetan carian yang berkaitan. Selama proses ini, halaman web tidak dimuat semula, tetapi maklumat yang perlu diubah dikemas kini di latar belakang menggunakan AJAX.
Bagaimana AJAX Berfungsi?
AJAX hanya menggunakan gabungan-
- XML (Bahasa Markup yang Boleh Diperluas)
- JavaScript dan HTML
- XML (Bahasa Markup yang Boleh Diperluas):
XML adalah bahasa markup. XML kebanyakannya digunakan untuk menerima data pelayan dengan format tertentu. Walaupun dapat menerima data dalam bentuk teks biasa. Apabila pengguna mengunjungi laman web dan peristiwa berlaku, dalam hal kami, itu adalah "Tekan butang", JavaScript membuat objek XMLHttpRequest, yang kemudian memindahkan maklumat dalam format XML antara penyemak imbas web dan pelayan web. Objek XMLHttpRequest mengirimkan permintaan untuk data halaman yang diperbarui ke pelayan web, pelayan memproses permintaan, respons dibuat di sisi pelayan dan dikirim kembali ke penyemak imbas, yang kemudian menggunakan JavaScript untuk memproses respons dan menampilkannya di halaman web.
- JavaScript dan HTML:
JavaScript melakukan proses kemas kini di AJAX. Permintaan untuk kandungan yang diperbarui diformat dalam XML untuk membuatnya dapat dimengerti, dan JavaScript menyegarkan kandungan untuk pengguna yang melihat halaman yang dikemas kini.
AJAX Bekerja:
Seperti yang ditunjukkan dalam rajah di atas, untuk permintaan AJAX, penyemak imbas menghantar XMLHttpRequest ke pelayan menggunakan javascript. Objek ini merangkumi data yang memberitahu pelayan apa yang diminta. Pelayan bertindak balas dengan hanya data yang diminta dari pihak klien. Kemudian penyemak imbas menerima data, hanya mengemas kini bahagian halaman yang perlu dikemas kini dan bukannya memuatkan keseluruhan halaman web.
Komponen Diperlukan untuk membina Pelayan Web Berasaskan AJAX dan ESP8266
Oleh kerana kami sedang membina projek untuk menunjukkan kemampuan esp8266 untuk menangani AJAX, keperluan komponennya sangat kecil, anda dapat menjumpai kebanyakan dari mereka di kedai hobi tempatan anda.
- NodeMCU X 1
- Sensor suhu LM35 X 1
- LED X 1
- Papan Roti X 1
- Pelompat X 4
- Kabel Pengaturcaraan X 1
Pelayan Web Ajax dan ESP8266 - Diagram Litar
Gambarajah litar untuk pelayan web berasaskan AJAX ditunjukkan di bawah.
Oleh kerana litarnya sangat mudah, tidak banyak yang dapat dijelaskan mengenainya. Kami telah menyambungkan LED dengan perintang penghad 150 Ohms pada Pin D0 dari ESP8266, seperti yang anda lihat, kita boleh menukarnya menggunakan pelayan web. Seterusnya, kami mempunyai sensor suhu LM35 kami di mana kami akan membaca nilai suhu dan mengemas kini ke laman web. Sensor suhu dikuasakan dari rel 3.3V, dan kerana LM35 adalah sensor analog, kami telah menggunakan pin A0 dari papan ESP8266 untuk mengukur data. jika anda menemui sensor suhu LM35 untuk pertama kalinya, atau jika anda ingin mengetahui lebih lanjut mengenai sensor kecil yang sangat sejuk ini, anda boleh menyemak catatan kami sebelumnya di Digital Thermometer Using NodeMCU dan LM35 di mana kami membincangkan cara kerja sensor ini di perincian.
Kod Pelayan Web Berasaskan AJAX untuk ESP8266
Sebelum kita melangkah lebih jauh, mari kita selami program ini untuk memahami bagaimana pelayan web NodeMCU kita akan berfungsi. Tetapi sebelum itu, pastikan anda mempunyai persediaan Arduino IDE untuk ESP8266. Sekiranya anda tidak mempunyai persediaan, anda boleh mengikuti bahagian seterusnya, jika tidak, anda boleh melewatkan bahagian ini. Sekiranya anda berminat untuk mempelajari lebih lanjut mengenai pelayan laman web dan projek berasaskan IoT, anda boleh menyemak siaran kami sebelumnya di mana kami telah membincangkan