MỤC LỤCPHẦN I. TỒNG QUAN11. MÔ TẢ BÀI TOÁN12. MỤC TIÊU ĐỀ TÀI13. ĐỐI TƯỢNG VÀ PHẠM VI14. NỘI DUNG NGHIÊN CỨU1PHẦN II. CƠ SỞ LÝ THUYẾT21. Module linh kiện21.1. Chip ESP8266 NodeMCU xử lý tích hợp thu phát WiFi21.2. Module cảm biến nhiệt độ, độ ẩm DHT1131.3. Module cảm biến lửa 3 chân31.4. Module cảm biến cồn MQ342. Phần mềm IDE và ThingSpeak42.1. Arduino IDE42.2. ThingSpeak53. Các công nghệ ứng dụng63.1. Hệ thống tệp flash giao diện ngoại vi nối tiếp SPIFFS63.2. Giao thức HTTP63.3. Xử lý bất đồng bộ73.4. Các ngôn ngữ, công nghệ web khác8PHẦN III. THIẾT KẾ VÀ CÀI ĐẶT91. Khối điều khiển và cảm biến92. Lập trình và cài đặt102.1. Tập tin JavaScript dùng để tự động cập nhật các chỉ số môi trường102.2. Bản phát thảo Adruino chính của hệ thống113. Mô hình hệ thống và nguyên lý hoạt động154. Kết quả đạt được16PHẦN IV. KẾT LUẬN18TÀI LIỆU THAM KHẢO19
TRƯỜNG ĐẠI HỌC CẦN THƠ KHOA CÔNG NGHỆ THÔNG TIN & TRUYỀN THÔNG NIÊN LUẬN CƠ SỞ HỆ THỐNG ARDUINO GIÁM SÁT CHỈ SỐ MÔI TRƯỜNG TRÊN NỀN TẢNG WEB Giáo viên hướng dẫn: PGS TS Đỗ Thanh Nghị Nhóm thực Đặng Qch Gia Bình B1706973 Nguyễn Lâm Trúc Mai B1706723 Nguyễn Thị Bảo Thư B1710449 Cần Thơ, ngày 01 tháng năm 2020 NHẬN XÉT CỦA GIÁO VIÊN - LỜI CẢM ƠN Trước hết chúng em xin gửi đến quý thầy cô khoa Công Nghệ Thông Tin Truyền Thông, trường Đại Học Cần Thơ lời chúc sức khỏe lời biết ơn sâu sắc Với quan tâm, dạy dỗ bảo chân tình chu đáo quý thầy cơ, giúp chúng em có kiến thức vô quý giá, giúp chúng em hiểu giá trị việc học làm chủ tri thức thổi lên niềm đam mê khám phá nghiên cứu khoa học Để báo cáo đạt kết tốt đẹp, chúng em nhận góp ý hỗ trợ chân thành từ anh chị bạn bè khoa Với tình cảm tốt đẹp, cho phép chúng em bày tỏ lòng biết chân thành đến tất anh chị, bạn bè tạo điều kiện giúp đỡ chúng em trình học tập trình nghiên cứu đề tài Đặc biệt chúng em muốn gửi lời cảm ơn chân thành tới giảng viên Đỗ Thanh Nghị quan tâm giúp đỡ, hướng dẫn nhóm chúng em hồn thành tốt đề tài thời gian qua Với điều kiện thời gian kinh nghiệm hạn chế sinh viên, báo cáo tránh thiếu sót Rất mong nhận bảo, đóng góp ý kiến q thầy để chúng em có điều kiện bổ sung, nâng cao kiến thức mình, phục vụ tốt cơng tác học tập sau Xin chân thành cảm ơn! TÓM TẮT Với đề tài này, nhóm chúng em triển khai nghiên cứu IoT – Internet of Things, lĩnh vực công nghệ phát triển mạnh mẽ Việt Nam giới Đồng thời, nhóm tìm hiểu tham khảo nhiều ứng dụng Arduino đời sống thực tiễn Nhìn thấy lợi ích tiềm phát triển IoT Việt Nam, nhóm chúng em định thực đề tài “Hệ thống Arduino giám sát số môi trường tảng Web” Trong báo cáo niên luận này, chúng em trình bày bước tiếp cận triển khai xây dựng hệ thống IoT thu thập liệu nhiệt độ, độ ẩm, độ cồn có tích hợp chức cảnh báo cháy tảng web Arduino Nhóm khái quát module cảm biến, chip ESP8266 công nghệ ứng dụng để xây dựng website để hiển thị thông số kể trên hình browser cách để bước xây dựng nguyên lý vận hành hệ thống Cụ thể hơn, chúng em trình bày dụng cụ cần thiết chip ESP8266 module cảm biến gồm: DHT11, MQ-3 cảm biến lửa, môi trường Arduino để nạp code, giao thức HTTP ngôn ngữ sử dụng đề tài MỤC LỤC PHẦN I TỒNG QUAN 1 MÔ TẢ BÀI TOÁN MỤC TIÊU ĐỀ TÀI ĐỐI TƯỢNG VÀ PHẠM VI NỘI DUNG NGHIÊN CỨU PHẦN II CƠ SỞ LÝ THUYẾT Module linh kiện 1.1 Chip ESP8266 NodeMCU xử lý tích hợp thu phát WiFi 1.2 Module cảm biến nhiệt độ, độ ẩm DHT11 1.3 Module cảm biến lửa chân 1.4 Module cảm biến cồn MQ-3 Phần mềm IDE ThingSpeak 2.1 Arduino IDE 2.2 ThingSpeak Các công nghệ ứng dụng 3.1 Hệ thống tệp flash giao diện ngoại vi nối tiếp SPIFFS 3.2 Giao thức HTTP 3.3 Xử lý bất đồng 3.4 Các ngôn ngữ, công nghệ web khác PHẦN III THIẾT KẾ VÀ CÀI ĐẶT Khối điều khiển cảm biến Lập trình cài đặt 10 2.1 Tập tin JavaScript dùng để tự động cập nhật số môi trường 10 2.2 ESP8266 sketch 11 Mơ hình hệ thống ngun lý hoạt động 16 Kết đạt 17 PHẦN IV KẾT LUẬN 19 TÀI LIỆU THAM KHẢO 20 PHỤ LỤC Danh mục hình ảnh Hình Chip ESP8266 NodeMCU Hình Sơ đồ chân ESP8266 NodeMCU Hình Module cảm biến nhiệt nhiệt độ DHT11 Hình Module cảm biến lửa chân Hình Module cảm biến cồn MQ-3 Hình Arduino IDE Hình ThingSpeak Hình Cấu trúc thư mục lưu Arduino sketch Hình Nguyên lý hoạt đồng HTTP Hình 10 Minh họa xử lý đơng Hình 11 Minh họa xử lý bất đồng Hình 12 Sơ đồ nối chân khối điều khiển cảm biến Hình 13 Minh họa nguyên lý hoạt động hệ thống Hình 14 Giao diện trang chủ website Hình 15 Giao diện trang hiển thị số mơi trường Hình 16 Giao diện trang hiển thị biểu đồ trực quan tương ứng với thơng số Hình 17 Hộp thoại chức phát cảnh báo cháy 2 3 6 8 10 16 17 18 18 19 Danh mục bảng Bảng Cấu trúc HTTP Request HTTP Response Bảng Bảng thông số nối chân khối điều khiển cảm biến 10 PHẦN I TỒNG QUAN MƠ TẢ BÀI TỐN Với bùng nổ Internet, công nghệ thông tin với tiến khoa học kĩ thuật, ngày có nhiều sản phẩm có tính đa dạng phong phú mà không nhắc tới ứng dụng Internet of Things (IoT) hay gọi Internet vạn vật, xu hướng phát triển mạnh mẽ hứa hẹn phát triển tương lai Lấy ý tưởng cốt lõi kết nối vật thông qua mạng lưới Internet, IoT giúp cho người kiểm sốt đồ vật cách dễ dàng tiện lợi thông qua thiết bị công nghệ đại laptop, smartphone, máy tính bảng,… Bên cạnh đó, nển tảng web tảng phổ biến độ tương thích nó, truy cập web nhiều thiết bị khác vào đâu cần có kết nối Internet Nhận thấy thuận lợi mà IoT web mang lại, nhóm chúng em định thực đề tài “Hệ thống Arduino giám sát số môi trường tảng Web” nhằm mục đích ứng dụng cơng nghệ sẵn có để tạo sản phẩm IoT có chức thu thập thông số môi trường khơng khí có tích hợp cảnh báo cháy chạy tảng web Hệ thống đơn giản có phạm vi ứng dụng rộng lớn Một số ví dụ kể đến hỗ trợ giám sát điều kiện trồng nông sản nông nghiệp, bảo quản thực phẩm, sản phẩm công nhiệp nhiều ứng dụng lĩnh vực khác MỤC TIÊU ĐỀ TÀI Giúp sinh viên có thêm kiến thức công dụng cách sử dụng số linh kiện, vi mạch điều khiển Arduino cơng nghệ web có Đồng thời, tạo ứng dụng web giúp thu thập liệu nhiệt độ, độ ẩm, độ cồn khơng khí đồng thời phát cảnh báo cháy có tính ứng dụng cao thực tiễn ĐỐI TƯỢNG VÀ PHẠM VI Trong đề tài này, nhóm sử dụng chip ESP8266 tích hợp thu phát WiFi điều khiển số cảm biến, có: cảm biến thu thập nhiệt độ độ ẩm DHT11, cảm biến phát lửa cảm biến nồng độ cồn MQ-3 môi trường Arduino Đồng thời, nhóm ứng dụng ngơn ngữ lập trình web gồm HTML, CSS JavaScript số công nghệ web ứng dụng đối tượng XMLHttpRequest (XHR) AJAX lập trình bất đồng NỘI DUNG NGHIÊN CỨU Cài đặt Arduino IDE, board thư viện cần thiết Nghiên cứu thử nghiệm mạch xử lý tích hợp thu phát wifi ESP8266 module cảm biến DHT11, MQ-3 cảm biến lửa Thiết kế lập trình trang web để hiển thị liệu màng hình browser Lập trình server bất đồng ESP8266 PHẦN II CƠ SỞ LÝ THUYẾT MODULE LINH KIỆN 1.1 Chip ESP8266 NodeMCU xử lý tích hợp thu phát WiFi ESP8266 NodeMCU mạch phổ biến việc phát triển dự án IoT, phát triển dựa chip Wifi SoC ESP8266 Ưu điểm ESP8266 NodeMCU sử dụng vi điều khiển mạnh mẽ so với Arduino nguyên thủy Ngoài ra, thiết kế ESP8266 NodeMCU nhỏ gọn, giá rẻ, đơn giản để sử dụng dùng trực tiếp trình biên dịch Arduino (Arduino IDE) để lập trình nạp code thông qua cổng micro USB Điều giúp việc sử dụng lập trình ứng dụng ESP8266 trở nên dễ dàng tiện lợi nhiều Một điểm mạnh module wifi tích hợp sẵn, giúp giảm chi phí lắp đặt việc phát triển hệ thống điều khiển không dây Hình Chip ESP8266 NodeMCU Thơng số kỹ thuật: Ic chính: ESP8266 Wifi SoC, phiên firmware: NodeMCU Lua Chip nạp giao tiếp UART: CP2102 Nguồn cấp: 5V DC Micro USB Vin GPIO giao tiếp mức logic: 3.3V Tích hợp Leb báo trạng thái, nút Reset, nút Flash Hình Sơ đồ chân ESP8266 NodeMCU Chức đề tài: Là mạch xử lý chính, điều khiển cảm biến thu thập thông số từ môi trường đồng thời khối giao tiếp không dây, kết nối WiFi đóng vai trị server để xử lý yêu cầu từ thiết bị client 1.2 Module cảm biến nhiệt độ, độ ẩm DHT11 DHT11 cảm biến có tích hợp chức đo nhiệt độ độ ẩm khơng khí thơng dụng giá thành rẻ dễ sử dụng, lấy liệu thông qua giao tiếp 1-wire (giao tiếp digital 1-wire truyền liệu nhất) Cảm biến tích hợp tiền xử lý tín hiệu giúp liệu nhận xác mà khơng cần phải qua tính tốn Hình Module cảm biến nhiệt nhiệt độ DHT11 Thông số kỹ thuật: Điện áp hoạt động: 3V - 5V (DC), đề tài này, modulde DHT Dãi độ ẩm hoạt động: 20% - 90% RH, sai số ±5%RH Dãi nhiệt độ hoạt động: 0°C ~ 50°C, sai số ±2°C Khoảng cách truyển tối đa: 20m Chuẩn giao tiếp TTL, wire Pins: o VCC: nguồn o DAT: Digital Output o GND: nối đất Chức đề tài: Thu thập số nhiệt độ độ ẩm môi trường 1.3 Module cảm biến lửa chân Cảm biến chuyên dùng để phát lửa sử dụng cảm biến hồng ngoại YG1006 với tốc độ đáp ứng nhanh độ nhạy cao giúp dễ dàng phát lửa nguồn sáng có xạ tương tự nên module thường ứng dụng thiết bị báo cháy Ngồi ra, module cịn tích hợp IC LM393 để so sánh tạo mức tính hiệu chỉnh độ nhạy biến trở Hình Module cảm biến lửa chân Thông số kỹ thuật: Điện áp hoạt động: 3.3V – 5V DC Dòng tiêu thụ: 15 mA Bước sóng phát lửa: 760 nm – 1100 nm Góc quét: - 60°C Khoảng cách phát hiện: m (80cm) Nhiệt độ hoạt động: -25°C – 85°C Kích thước: 3.2 x 1.4 cm Sơ đồ chân: o VCC: nguồn o GND: nối đất o DO: digital output Chức đề tài: Phát lửa phạm vi cho phép 1.4 Module cảm biến cồn MQ-3 Cảm biến MQ-3 làm từ vật liệu SnO2, dùng để đo nồng độ cồn Vật liệu có tính dẫn điện mơi trường khơng khí lại nhạy cảm với cồn hoạt động ổn định thời gian dài Module cảm biến cồn MQ-3 hoạt động dựa nguyên tắc điện trở thay đổi C2H5OH bay tác động lên lớp SnO2 phủ cảm biến, nồng độ cồn cao giá trị cảm biến nhỏ Theo thử nghiệm cho thấy cảm biến phát nồng độ cồn chịu ảnh hưởng bời điều kiện nhiệt độ Khi nhiệt độ bề mặt cảm biến sấy nóng tới 60ºC, thời gian cần thiết để phát nồng độ cồn kéo dài khoảng giây Cũng mơi trường đó, nhiệt độ bề mặt cảm biến 20ºC thời gian phát nồng độ cồn kéo dài từ đến phút [1] Hình Module cảm biến cồn MQ-3 Thông số kĩ thuật: Kích thước: 32 x 22 x 27 mm Chip chính: LM393, MQ-3 cảm biến khí Có dạng tín hiệu đầu dạng Analog TTL Chất phản ứng: Ethanol (C2H5OH) Dải đo: 0.05 – 10 mg/L tương ứng với điện trở – M Ω Điện áp làm việc: 24V Sơ đồ chân: Hình ThingSpeak CÁC CÔNG NGHỆ ỨNG DỤNG 3.1 Hệ thống tệp flash giao diện ngoại vi nối tiếp SPIFFS SPIFFS viết tắt Serial Peripheral Interface Flash File System, hay gọi hệ thống tập tin flash giao diện ngoại vi tối tiếp Đây hệ thống tập tin nhẹ dành cho vi điều khiển chip flash kết nối bus SPI SPIFFS cho phép truy cập thao tác vào nhớ flash cách dễ dàng hệ thống tập tin bình thường máy tính đơn giản hạn chế Hệ thống hỗ trợ nhiều phiên lưu trữ khác (1MB, 2MB 3MB), sử dụng để lưu trữ tài liệu không thường xuyên thay đổi như: trang web, cấu hình, liệu hiệu chuẩn cảm biến, v.v Bằng cách sử dụng SPIFFS tách riêng phần mã nguồn html, css, javascript, image, v.v khỏi mã chương trình phác thảo Arduino (Arduino sketch) Điều phần làm giảm tốc độ thực thi so với việc web nhúng trực tiếp vào flash Tuy nhiên, việc tách mã nguồn trang web giúp chương trình trở nên rõ ràng dễ nhìn, đồng thời, việc thiết kế giao diện, chức website tiện lợi Cấu trúc thư mục lưu phác thảo Arduino: Hình Cấu trúc thư mục lưu Arduino sketch 3.2 Giao thức HTTP HTTP viết tắt từ HyperText Transfer Protocol, nghĩa giao thức truyền tải siêu văn bản, giao thức ứng dụng giao thức TCP/IP dành cho tảng Internet HTTP hoạt động dựa mơ hình client – server, dùng liên lạc thông tin máy chủ cung cấp dịch vụ máy khách sử dụng dịch vụ Trong mô hình này, máy tính người dùng đóng vai trò làm máy khách (client) Sau thao tác người dùng, máy khách gởi yêu cầu (request) đến máy chủ (server) chờ đợi trả lời (response) từ máy chủ Hình Nguyên lý hoạt đồng HTTP Cấu trúc HTTP Request HTTP Response Bảng Cấu trúc HTTP Request HTTP Response HTTP Request HTTP Response Requset line: Status line: Method: phương thức sử Version: phiên HTTP cao mà dụng, thường GET POST, server hỗ trợ cịn có HEAD, PUT, DELETE, … Status code: mã gồm chữ số thể URL: đại định danh tài nguyên trạng thái kết nối Version: phiên HTTP sử Stauts text: mô tả status code dụng, thường 1.1 Header fields: Gồm nhiều trường trường có cấu trúc sau: : cho phép gửi thêm thông tin bổ sung thông điệp yêu cầu phản hồi thông tin máy gửi Message body: thường trống 3.3 Xử lý bất đồng Xử lý đồng (Synchronous) mơ hình quen thuộc lập trình Với xử lý đồng bộ, công việc xếp theo thứ tự định sẵn Trong chương trình đồng bộ, câu lệnh thực theo thứ tự từ xuống dưới, câu lệnh sau thực câu lệnh trước hoàn thành, cần câu lệnh sai chương trình bị dừng lại đồng thời thị thông báo lỗi Hình 10 Minh họa xử lý đông Khác với xử lý đồng xử lý bất đồng (Asynchronous) Trong mơ hình này, cơng việc thực lúc Do vậy, công việc sau chờ đợi cơng việc trước Do đó, có trường hợp cơng việc sau kết thúc trước, cho kết công việc trước cịn thực thi nên kết chương trình khơng theo thứ tự trực quan Tuy nhiên, hạn chế tối đa việc “chờ đời” nên tổng thời gian thực chương trình rút ngắn cách đáng kể Đối với lập trình server, việc xử lý bất đồng khơng tăng thời gian đáp ứng mà cịn khai thác khả xử lý song song, giúp server đáp ứng nhiều kết nối lúc Hình 11 Minh họa xử lý bất đồng Từ ưu điểm trên, nhóm định thiết lập máy chủ HTTP bất đồng ESP8266 để chạy tảng web sử dụng thư viện ESPAsyncWebServer [2], thư viện hỗ trợ lập trình máy chủ HTTP không đồng máy chủ WebSocket 3.4 Các ngôn ngữ, công nghệ web khác Các ngôn ngữ công nghệ web sử dụng đề tài gồm có HTML, CSS, JavaScript AJAX HTML chữ viết tắt cho cụm từ HyperText Markup Language (có nghĩa ngôn ngữ đánh dấu siêu văn bản) ngôn ngữ đánh dấu thiết kế để tạo nên trang web sử dụng để tạo tất website giới HTML mô tả cấu trúc văn hay nội dung trang web, bênh cạnh cịn giúp người lập trình quy định màu sắc, thiết kế thành phần có trang web CSS hay Cascading Style Sheet language, ngôn ngữ tạo phong cách cho trang web, dùng để tạo phong cách định kiểu cho yếu tố viết dạng ngôn ngữ đánh dấu, HTML CSS có chức điều khiển định dạng nhiều trang web lúc để tiết kiệm cơng sức cho người viết web, ngồi giúp tách biệt phần quy định cách hiển thị trang web với nội dung trang Phương thức hoạt động CSS tìm kiếm vùng chọn, tên thẻ HTML, tên ID, class hay nhiều kiểu khác sau áp dụng thuộc tính cần thay đổi lên vùng chọn JavaScript ngơn ngữ lập trình ngơn ngữ kịch cho phép triển khai chức phức tạp trang ví dụ trình chiếu ảnh, đồ họa hoạt hình hay hình thức tương tác, v.v Mơ hình đối tượng tài liệu (DOM) cho phép tạo kiểm soát nội dung trang web động với JS, thay đổi nội dung trang HTML, hiển thị / ẩn phần tử trang HTML, thay đổi thuộc tính HTML phần tử HTML, v.v mà khơng u cầu người dùng tải lại trang web theo cách thủ công AJAX (Asynchronous JavaScript and XML) kỹ thuật thiết kế web giúp cho ứng dụng web hoạt động bất đồng Và đó, yếu tố định AJAX đối tượng XMLHttpRequest Tất trình duyết hỗ trợ đối tượng XMLHttpRequest Đối tượng XMLHttpRequest cho phép trang web cập nhật không đồng cách trao đổi liệu với máy chủ web từ phía sau điều có nghĩa cập nhật phần trang web mà khơng cần tải lại tồn trang PHẦN III THIẾT KẾ VÀ CÀI ĐẶT Khối điều khiển cảm biến Khối điều khiển cảm biến gồm có linh kiện chính: ESP8266, DHT11, MQ-3 cảm biến lửa Trong ESP8266 mạch xử lý chính, giữ nhiệm vụ cấp nguồn, điều khiển nhận liệu từ cảm biến kể Nguồn cấp cho ESP8266 cắm trực tiếp vào cổng URAT vào laptop (5V), cảm biến cấp nguồn thông qua chân ESP8266 Dữ liệu đọc từ chân digital analog có kết nối với cảm biến Sơ đồ nối chân linh kiện khối điều khiển minh họa hình bên dưới: Hình 12 Sơ đồ nối chân khối điều khiển cảm biến Bảng Bảng thông số nối chân khối điều khiển cảm biến STT Sensor Sensor pin DHT11 VCC GND D0 Flame Sensor VCC GND D0 MQ-3 VCC GND A0 D0 ESP8266 Pin 3.3V GND D1 3.3V GND D7 Vin (5V) GND A0 D0 LẬP TRÌNH VÀ CÀI ĐẶT 2.1 Tập tin JavaScript dùng để tự động cập nhật số môi trường Dưới phần mã lệnh tập tin JavaScript dùng để cập nhật số nhiệt độ, độ ẩm nồng độ cồn cách tự động mà không cần phải chạy lại toàn trang web Khai báo biến time lưu trữ thời gian tự động cập nhật biến flame dùng để lưu trữ trạng thái tín hiệu báo cháy var time = 1000; // 1000 millis seconds = second var flame = 1; // flame: 1-Fire, 0-No flame Đoạn mã chương trình sau mô tả việc tự động cập nhật số nhiệt độ, làm tương tự với số độ ẩm nồng độ cồn Sử dụng phương thức setInterval(F(), T) dùng để thiết lập độ trễ cho hàm F nằm tham số mộ khoản thời gian T millisecond Nghĩa hàm function() bên thực thi liên tục giây setInterval(function() { Khởi tạo đối tượng XMLHttpRequest() để chuẩn bị gửi yêu đến server 10 var xhttp = new XMLHttpRequest(); Sau nhận phản hổi từ server, tự động cập nhật giá trị phần tử có id “temperature” tập tin HTML lại cho phù hợp xhttp.onreadystatechange = function() { if (this.readyState == && this.status == 200) document.getElementById("temperature").innerHTML = this.responseText; }; Gửi yêu cầu GET với URL “/temperature” để đọc giá trị nhiệt độ xhttp.open("GET", "/temperature", true); xhttp.send(); }, time); Tương tự trên, đoạn mã dùng để tự động hiển thị cảnh báo cháy màng hình browser có tín hiệu phát lửa setInterval(function() { var xhttp = new XMLHttpRequest(); xhttp.onreadystatechange = function() { if (this.readyState == && this.status == 200) { var newF = this.responseText; if (newF == && newF != flame) document.getElementById('flamemodal').style.display = "flex"; flame = newF; } }; xhttp.open("GET", "/flame", true); xhttp.send(); }, time); 2.2 ESP8266 sketch Thêm thư viện cần thiết #include #include #include #include #include #include Nhập thơng số mạng WiFi để ESP8266 kết nối với Internet const char* ssid = ""; // WiFi SSID const char* password = ""; // WiFi password 11 Định nghĩa biến AsyncWebServer server(80); Định nghĩa biến cần thiết #define dhtPin D1 #define dhtType DHT11 #define flamePin D7 DHT dht(dhtPin, dhtType); float t = 0.0; // temperature float h = 0.0; // humidity float a = 0.0; // alcohol int f = HIGH; // flame: HIGH: no flame; LOW: fire! Định nghĩa thông số liên quan đến kênh ThingSpeak sử dụng const int channelID = 1063062; String writeAPIKey = "RAOKCHK6EQOSPSTR"; // write API key for your ThingSpeak Channel const char* thingspeak_server = "api.thingspeak.com"; WiFiClient client; Hàm processor() có chức xử lý việc gán giá trị thu từ cảm biến vào placeholder tệp HTML Placeholder định nghĩa hai dấu phần trăm, ví dụ: %TEMPERATURE% String processor(const String& var) { if (var == "TEMPERATURE") return String(t); else if (var == "HUMIDITY") return String(h); else if (var == "ALCOHOL") return String(a); else if (var == "FLAME") return String(f); return String(); } Hàm setup(), bắt đầu khởi tạo Serial Monitor thiết lập cảm biến, GPIO làm đầu đọc liệu void setup() { Serial.begin(115200); // Initialize sensor dht.begin(); pinMode(flamePin, INPUT); Khởi tạo SPIFFS // Initialize SPIFFS if (!SPIFFS.begin()) { 12 Serial.println("Error SPIFFS"); return; } Kết nối WiFi cho ESP8266 // Connect to WiFi WiFi.begin(ssid, password); while (WiFi.status() != WL_CONNECTED) { Serial.println("Connecting"); delay(5000); } Serial.println("Connected"); Serial.println(WiFi.localIP()); Sử dụng thư viện ESPAsyncWebServer để cấu hình đường dẫn (route) để máy chủ lắng nghe xử lý HTTP Request Sử dụng phương thức on cho đối tượng server sau: // Route for root / web page server.on("/", HTTP_GET, [](AsyncWebServerRequest *request){ request->send(SPIFFS, "/index.html", String(), false, processor); }); Khi máy chủ nhận yêu cầu đường dẫn gốc “/”, máy gửi tập tin index.html lưu hệ thống tập tin flash ESP8266 đến máy client Tham số cuối hàm send() hàm processor giúp ta thay placholder tương ứng tệp HTML Làm tương tự máy chủ nhận yêu cầu đường dẫn khác: server.on("/index.html", HTTP_GET, [](AsyncWebServerRequest *request) { request->send(SPIFFS, "/index.html", String(), false, processor); }); server.on("/content.html", HTTP_GET, [](AsyncWebServerRequest *request) { request->send(SPIFFS, "/content.html", String(), false, processor); }); server.on("/chart.html", HTTP_GET, [](AsyncWebServerRequest *request) { request->send(SPIFFS, "/chart.html", String(), false, processor); }); Do trang html có sử dụng tham chiếu đến tập tin CSS JavaScript, nên máy khác đưa yêu cầu tập tin Khi đó, máy chủ gửi tập tin tương ứng đến máy khách: 13 server.on("/css/styles.css", HTTP_GET, [](AsyncWebServerRequest *request) { request->send(SPIFFS, "/css/styles.css", "text/css"); }); server.on("/css/index.css", HTTP_GET, [](AsyncWebServerRequest *request) { request->send(SPIFFS, "/css/index.css", "text/css"); }); server.on("/css/content.css", HTTP_GET, [](AsyncWebServerRequest *request) { request->send(SPIFFS, "/css/content.css", "text/css"); }); server.on("/css/chart.css", HTTP_GET, [](AsyncWebServerRequest *request) { request->send(SPIFFS, "/css/chart.css", "text/css"); }); server.on("/script.js", HTTP_GET, [](AsyncWebServerRequest *request) { request->send(SPIFFS, "/script.js", "text/javascript"); }); Trong tập tin JavaScript có sử dụng đoạn mã u cầu thơng số nhiệt độ, độ ẩm, độ cồn tín hiệu có lửa tuyến /temperature, /humidity, /alcohol /flame giây Khi nhận yêu cầu vậy, server gửi giá trị cảm biến lưu biến t, h, a f định nghĩa cập nhật giá trị thường xuyên dạng plain text thông qua phương thức c_str() // Response to XMLHttpRequest server.on("/temperature", HTTP_GET, [](AsyncWebServerRequest *request){ request->send_P(200, "text/plain", String(t).c_str()); }); server.on("/humidity", HTTP_GET, [](AsyncWebServerRequest *request){ request->send_P(200, "text/plain", String(h).c_str()); }); server.on("/alcohol", HTTP_GET, [](AsyncWebServerRequest *request){ request->send_P(200, "text/plain", String(a).c_str()); }); server.on("/flame", HTTP_GET, [](AsyncWebServerRequest *request) { 14 request->send_P(200, "text/plain", String(f).c_str()); }); Dùng phương thức begin() đối tượng server để máy chủ bắt đầu lăng nghe yêu cầu // Start server server.begin(); } Hàm analogToPPM() dùng để chuyển đổi giá trị analog từ MQ-3 sang đơn vị PPM [3] // Caculate analog value to PPM float analogToPPM(float sensor_value) { float sensor_volt = (float) sensor_value / 1024 * 5.0; float RS = ((5 - sensor_volt)/sensor_volt); float R0 = 0.02; float ratio = RS/R0; float lgPPM = (log10(ratio)* (-2.6)) + 2.7; return (pow(10, lgPPM)); } Hàm loop() dùng để cập nhật số từ cảm biến gửi liệu đến ThingSpeak void loop() { delay(1000); //Update every second Đọc thông số từ cảm biến float newT = dht.readTemperature(); float newH = dht.readHumidity(); float newA = analogRead(A0); newA = analogToPPM(newA); int newF = digitalRead(flamePin); Hiển thị cảnh báo có lửa hình Serial f = newF; if (f == LOW) Serial.println("FIRE"); Kiểm tra tính hợp lệ liệu đọc từ cảm biến if (isnan(newT) || isnan(newH)) Serial.println("Fail to read from DHT sensor"); else if (isnan(newA)) Serial.println("Fail to read alcohol value"); else { Cập nhật lại thông số vào biến toàn cục đồng thời hiển thị hình Serial t = newT; h = newH; 15 a = newA; Serial.print(t); Serial.print(" "); Serial.print(h); Serial.print(" "); Serial.println(a); Kết nối với ThingSpeak tiến hành gửi liệu if (client.connect(thingspeak_server, 80)) { String str = "field1=" + String(t, 2) + "&field2=" + String(h, 2) + "&field3=" + String(a, 2); client.print("POST /update HTTP/1.1\n"); client.print("Host: api.thingspeak.com\n"); client.print("Connection: close\n"); client.print("X-THINGSPEAKAPIKEY: " + writeAPIKey + "\n"); client.print("Content-Type: application/x-www-formurlencoded\n"); client.print("Content-Length: "); client.print(str.length()); client.print("\n\n"); client.print(str); client.print("\n\n"); } client.stop(); } MƠ HÌNH HỆ THỐNG VÀ NGUYÊN LÝ HOẠT ĐỘNG Hình 13 Minh họa nguyên lý hoạt động hệ thống Ngồi vai trị chip xử lý chính, giữ nhiệm vụ điều khiển thu thập liệu từ cảm biến, ESP8266 server HTTP bất đồng Khi có yêu cầu từ máy khách, server 16 gửi tài liệu liên quan đến trang web dạng HTTP phản hồi Ngồi hệ thống có sử dụng thêm bên thứ ba ThingSpeak cloud service để hiển thị biểu đồ nhằm trực quan hóa số thu thập Q trình diễn sau, thu thập số liệu, ESP8266 tạo kết nối gửi yêu cầu dạng POST để gửi liệu lên ThingSpeak Website hiển thị biểu đồ hiển thị biểu đồ ThingSpeak thông qua thẻ iframe giao thức HTTP KẾT QUẢ ĐẠT ĐƯỢC Giao diện website hiển thị số mơi trường gồm có trang Trang chủ tên tóm tắt nội dung trang web Hình 14 Giao diện trang chủ website Trang thứ hai có chức hiển thị ba liệu nhiệt độ, độ ẩm độ cồn mơi trường khơng khí, cập nhật thời gian thực 17 Hình 15 Giao diện trang hiển thị số môi trường Trang thứ ba trang hiển thị bảng trình chiếu với số mơi trường trực quan hóa liệu thu thập thông qua biểu đồ tương ứng nhúng từ Thingspeak Hình 16 Giao diện trang hiển thị biểu đồ trực quan tương ứng với thông số Khi hệ thống nhận tín hiệu báo cháy tự động hiển thị hộp thoại cảnh báo cho người dùng Chức hoạt động ba trang kể 18 Hình 17 Hộp thoại chức phát cảnh báo cháy PHẦN IV KẾT LUẬN Sau thời gian tìm hiểu thử nghiệm nhóm xây dựng sản phẩm hệ thống tương đối hồn chỉnh thu thập số từ môi trường hiển thị qua website Đây sản phẩm có tính ứng dụng cao mở rộng nhiều đề tài lĩnh vực khác Qua đề tài chúng em tiếp cận hiểu biết Arduino số công nghệ web sử dụng phổ biến Bên cạnh nhóm chúng em đề xuất số hướng phát triển cho đề tài thêm phần hồn thiện Đầu tiên, nhóm sử dụng Webserver bất đồng lập trình trực tiếp mạch xử lý ESP8266 khai thác ưu điểm ổn định dễ dàng cập nhật, chỉnh sửa trình thử nghiệm sản phẩm, phù hợp với mục tiêu làm quen tìm hiểu lập trình Arduino Tuy nhiên, đặt mục tiêu ứng dụng đề tài vào thực tiễn, hệ thống nên có Webserver nằm ngồi ESP8266 khối nguồn riêng cho ESP8266 để hoạt động độc lập thời gian dài Bên cạnh đó, tùy vào mục đích sử dụng mà linh hoạt thay đổi cảm biến cho phù hợp tích hợp thêm số linh kiện ngoại vi, chẳng hạn hình LCD, đèn LED hay loa 19 TÀI LIỆU THAM KHẢO [1] "MQ-3 Document," [Online] Available: https://www.pololu.com/file/0J310/MQ3.pdf [Accessed 2020] [2] "ESP8266 AsynWebServer README.md," [Online] Available: https://github.com/me-no-dev/ESPAsyncWebServer/blob/master/README.md [Accessed 2020] [3] D Technologies, "Getting right PPM from MQ sensors," 2015 [Online] Available: https://www.youtube.com/watch?v=fBo3Yq9LK1U [Accessed 2020] [4] C Pfister, Getting Started with the Internet of Things, 2011 [5] "Cộng đồng Arduino Việt Nam | Tôi Yêu Arduino," [Online] Available: http://arduino.vn/ [Accessed 2020] [6] B T Sinh, "Khả định hướng phát triển Internet kết nối vạn vật," Viện Chiến lược Chính sách Khoa học & Công nghệ, 2017 [7] "ESP8266 Arduino Core," [Online] Available: https://arduinoesp8266.readthedocs.io/en/latest/filesystem.html [Accessed 2020] [8] "Báo cáo đề tài Thiết kế, thi công mạch đo cảnh báo nồng độ cồn," Khoa Công nghệ điện tử & Truyền thông, Trường ĐH Công nghệ Thông tin & Truyền thông, 2015 [9] Vũ Ngọc Duy Tín, Nguyễn Hồng Quốc Hưng, "Báo cáo Mơ hình Giám sát Điều khiển mơ hình trồng nấm rơm," Trường ĐH SPKT, TP.HCM, 2019 [10] S Santos, "ESP8266 Web Server using SPIFFS (SPI Flash File System) – NodeMCU," [Online] Available: https://randomnerdtutorials.com/esp8266-webserver-spiffs-nodemcu/ [Accessed 2020] [11] "XMLHttpRequest - Web APIs | MDN," 20 2020 [Online] Available: https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest [Accessed 2020] 20