Bật tắt đèn qua web với ESP8266

Hướng dẫn điều khiển đèn học thông qua website với ESP8266. Khác với cách thông thường là tạo một server để điều khiển từ xa thì chúng ta sẽ sử dụng ESP8266 để tạo ra một web server nhỏ trên chip, sao đó tạo ra giao diện web để có thể điều khiển đèn

Điều khiển đèn qua web

Chuẩn bị

Cần chuẩn bị phần cứng như:

  • Modul ESP8266v12 hoặc NodeMCU.
  • Nguồn 3.3V
  • Bộ chuyển đổi USB2UART
  • Board test và dây cắm
  • Modul Relay 5V-220 hoặc modul tương tự
  • Đèn học.

Kết nối phần cứng

Phần nối nguồn và chân để nạp chương trình cho ESP vẫn như các bài trước , ở đây có khác một chút là kết nối chân điều khiển relay với chân GPIO5 và kết nối giữa relay và đèn học

Chương trình

Chúng ta sẽ đi luôn vào chương trình lập trình điều khiển đèn. ESP8266 sẽ nhận yêu cầu từ website, trên giao diện web này sẽ có 2 nút nhấn (ON/OFF) để điều khiển tắt mở đèn.

Đầu tiên vẫn là cấu hình cho đúng tên wifi và passwifi, sau đó là tạo server

Khai báo GPIO5 điều khiển relay là Output

Sau khi kết nối và khởi tạo server trong vòng lặp loop(), sẽ được dùng để lắng nghe các kết nối và yêu cầu ở port 80.

Khi nhận được dữ liệu thực hiện kiểm tra xem có yêu cầu bật tắt (on/off) gì không ? Nếu có thì thực hiện thay đổi trạng thái của output thông qua lệnh

Giờ chúng ta sẽ tạo ra giao diện để có thể truy cập vào board thông qua trình duyệt dùng HTML

Tạo 2 nút nhấn trên giao diện và một số lệnh JavaScript để kiểm tra khi nào 2 nút được ấn

Cuối cùng là biên dịch và nạp chương trình xuống ESP8266

Kết quả

Giao diện quản lý và điều khiển khi quan sát trên máy tính và điện thoại

dieukhien_den_esp8266

phone_lamp_esp8266

Bạn có thể tải chương trình tại  Điều khiển đèn

Kết

Thế là chúng ta đã có thể điều khiển thiết bị qua web một cách dễ dàng, bạn có thể phát triển thành điều khiển nhiều thiết bị khác ở trong nhà của mình.

13
Leave a Reply

avatar
7 Comment threads
6 Thread replies
0 Followers
 
Most reacted comment
Hottest comment thread
8 Comment authors
hoangscquânNamnam Recent comment authors

Website này sử dụng Akismet để hạn chế spam. Tìm hiểu bình luận của bạn được duyệt như thế nào.

  Subscribe  
newest oldest most voted
Notify of
toàn
Guest

anh cho em hỏi anh nhúng CSS qua link thế kia là làm thế nào ạ… em cảm ơn trước!!!

Thanh Tai
Guest
Thanh Tai

Bạn tạo một file tên là style.css xong cùng thư mục với file html và chèn theo

kaliz
Guest
kaliz

cho em hỏi lệnh client.flush() là gì vậy ạ

nam
Guest
nam

cho em hỏi, em đang làm trên con ESP 32 nhưng nó chỉ kết nối mạng cục bộ. em dùng mạng khác để kết nối lại ko đc ? em fai làm sao để kết nối bất kỳ wifi nào cũng có thể điều khiển được? em cảm ơn.

Nam
Guest
Nam

Dạ anh ơi cho em hỏi phần tạo giao diện , em chưa biết cách viết với dùng ngôn ngữ gì viết dạ, mong anh chỉ em với, em mới tìm hiểu đây . Em xin cảm ơn dạ

Nam
Guest
Nam

Dạ anh ơi, cách tạo giao diện em chưa hiểu với lại mình dùng ngôn ngữ gì để viet ạ em mới tìm hiểu nên không rõ, anh chỉ giúp em với, em xin cam ơn nhiều dạ

quân
Guest
quân

a ơi phần viết code HTML,JS,CSS như thế nào đấy ạ, a có thể chỉ dẫn được ko ạ, không giờ nhìn vào mớ đấy, muốn sử hay tự viết cũng chả được @@

hoang
Guest
hoang

a ơi cho e hỏi e muốn điều khiển dc 2 thiết bị trở lên thì phải thay đổi code ntn ạ