báo cáo đồ án IOT | Đại hoc Xây Dựng Hà Nội

lOMoARcPSD| 45222017
Đồồ án đồồ h a Máy Tínhọ
ĐẠI HỌC XÂY DỰNG
KHOA CÔNG NGHỆ THÔNG TIN ĐỒ ÁN
ĐỀ TÀI: Ứng dụng theo dõi nhiệt độ, độ ẩm sử dụng cảm biến DHT11
GVHD: GV Phan Thái Trung Vũ Đăng Hiệp
Phạm Thếế Cường Hà Nội – 10/12/2020 Trang 1 lOMoARcPSD| 45222017
Đồồ án đồồ h a Máy Tínhọ Ghi Ngày
Công việc đã kiểm tra
Công việc giao buổi sau chú Giới thiệu đề tài,
 Tìm hiểu các đề tài, hướng hướng dẫn làm báo dẫn báo cáo 20/11/2020 cáo về Đồ án Đồ họa Máy tính
Đăng kí đề tài Đồ án
 Bản thảo thuyết minh: Theo Đồ họa Máy tính
hướng dẫn. mềm thuyết minh vào thư mục hạn đến thứ 27/11/2020  Nộp bản Sáu 10/12.
 Các nội dung khác như: sản
phẩm nếu có: Gửi riêng vào thư mục
 Hoàn thiện đề tài, nộp báo và 04 / 12/202
Nộp bản thảo đồ án để thầy xem hướng dẫn
sản phẩm (nếu có sản phẩm) 0 chỉnh sửa 11/12/2020 Mục Lục
I TỔNG QUAN ĐỀ TÀI 4 1. ĐẶT VẤN ĐỀ 4
2. ĐỊNH HƯỚNG THIẾT KẾ 4
II PHÂN TÍCH VÀ THIẾT KẾ 5
1. TÁC NHÂN VÀ CHỨC NĂNG 5 2. THIẾT BỊ 6
3. SƠ ĐỒ LẮP ĐẶT 8
III. CHẠY THIẾT BỊ 10 1. CODE ADUINO 10 Trang 2 lOMoARcPSD| 45222017
Đồồ án đồồ h a Máy Tínhọ
2. KẾT NỐI HIVEMQ 13 3. UPLOAD CODE 14
IV. GIAO DIỆN ỨNG DỤNG VÀ HƯỚNG DẪN SỬ DỤNG 19
1. GIAO DIỆN KHỞI ĐỘNG 19
2. GIAO DIỆN XEM NHIỆT ĐỘ ĐỘ ẨM 20
3. GIAO DIỆN DỮ LIỆU 21
4. GIAO DIỆN DỮ LIỆU NHIỆT ĐỘ, ĐỘ ẨM THEO NGÀY 22 V. Source code 23 1. Home.page.html 23 2. Sensor.page.html 23 3. Data.page.html 24
4. Data-detail.page.html 25 5. index.html 26 6. filebase.ts 26 VI. Kết luận 27
VII. Tài liệu tham khảo 27 Danh mục hình ảnh
Ảnh 1. Cảm biến nhiệt độ độ ẩm DHT11 Ảnh 2. Modern Wifi ESP8266 Ảnh 3. Dây data Ảnh 4. Board Ảnh 5. Dây nối
Ảnh 6. Lắp đặt thiết bị Ảnh 7. Code Arduino Ảnh 8. Chọn board Ảnh 9 Chọn cổng Ảnh 10. Kết nối HiveMQ Ảnh 11. Tạo testtopic Trang 3 lOMoARcPSD| 45222017
Đồồ án đồồ h a Máy Tínhọ Ảnh 12. Upload code Ảnh 13. Serial Monitor
Ảnh 14. Dữ liệu đẩy lên testtopic
Ảnh 15. Dữ liệu trên firebase
Ảnh 16. Chi tiết dữ liệu trên firebase
Ảnh 17. Giao diện khởi động
Ảnh 18. Giao diện xem nhiệt độ, độ ẩm
Ảnh 19. Giao diện dữ liệu
Ảnh 20. Giao diện chi tiết dữ liệu I TỔNG QUAN ĐỀ TÀI 1. ĐẶT VẤN ĐỀ
Thứ nhất: Hiện nay hiện tượng cháy nổ diễn ra rất thường xuyên, phức tạp và gây hậu
quả rất nghiêm trọng. Hiện tượng này gây ra thiệt hại nghiêm trọng về người, tài sản kéo
theo nhiều hệ lụy cho môi trường và xã hội gây hoang mang trong dư luận. Đặc biệt việc
cháy nổ hình thành do những nguyên nhân có thể rất nhỏ, tuy nhiên do không được phát
hiện kịp thời dẫn đến bùng phát gây hậu quả nghiêm trọng. Điều này đặt ra nhu cầu về một
công cụ có thể cảnh báo trước những nguy cơ cháy nổ, để có phương án kịp thời phòng
tránh. Và một ứng dụng theo dõi nhiệt độ từ xa có thể đáp ứng nhu cầu này. Nó giúp chúng
ta cập nhật liên tục nhiệt độ tại bất kì đâu chúng ta muốn theo dõi, đặc biệt là những nơi có
nguy cơ cháy nổ cao. Nếu có sự tăng bất thường của nhiệt độ tức là có nguy cơ xảy ra cháy
nổ. Khi nắm được thông tin cập nhật, chúng ta sẽ kịp thời đưa ra được giải pháp để khắc phục.
Thứ hai: Với sự thay đổi thất thường của khí hậu hiện nay, việc nắm được chính xác
nhiệt độ và độ ẩm của môi trường sống giúp chúng ta chủ động được cách thức sinh hoạt
phù hợp để dáp ứng nhu cầu của cơ thể trong các điều kiện môi trường khác nhau. Ví dụ
như vào một ngày khô hanh chúng ta có thể nắm được và chủ động cung cấp đủ nước cho
cơ thể... Điều này thực sự quan trọng khi bạn cần để chăm sóc trẻ em hoặc người già. Trang 4 lOMoARcPSD| 45222017
Đồồ án đồồ h a Máy Tínhọ
Như vậy, với ứng dụng theo dõi nhiệt độ chúng ta đã giải quyết được cả hai vấn đề nêu
trên. Nó thực sự là một ứng dụng cần thiết cho bất kì người dùng nào bỏi tính thực tế và hiệu quả nó mang lại.
2. ĐỊNH HƯỚNG THIẾT KẾ
Quá trình xây dựng ứng dụng sẽ không đi sâu về lắp đặt thiết bị phần cứng và bộ vi
điều khiển mà chỉ quan tâm đến việc xây dựng ứng dụng giao tiếp với người dùng và các
thiết bị cảm biến nhiệt ( Đặc biệt là phần giao diện đồ họa của ứng dụng ).
Ứng dụng có thể sử dụng trên các thiết bị Android có kết nối mạng. - Công nghệ sử dụng ● Node.js ● Firebase ● Ionic frame - Mục tiêu đề tài:
● Xây dựng ứng dụng giám sát nhiệt độ, độ ẩm. Cập nhật thông tin chỉ số nhiệt độ
độ ẩm liên tục theo thời gian.
● Lưu trữ, cung cấp dữ liệu nhiệt độ, độ ẩm đo được theo thời gian một cách dầy đủ nhất cho người dùng.
● Các thao tác với giao diện đơn giản, thuận tiện và dễ dàng sử dụng. Thông tin
được trình bày rõ ràng, dễ dàng nắm bắt.
● Cảnh báo cho người dùng khi giá trị đo được có dấu hiệu bất thường để kịp thời xử lý.
II PHÂN TÍCH VÀ THIẾT KẾ
1. TÁC NHÂN VÀ CHỨC NĂNG
- Tác nhân: Người sử dụng ứng dụng.
- Các chức năng cơ bản:
● Xem nhiệt độ và độ ẩm hiện tại.
● Cảnh báo sự bất thường của dữ liệu đo được.
● Xem dữ liệu đã được đo và thống kê theo thời gian. - Mô tả chức năng:
● Xem nhiệt độ, độ ẩm: Người dùng lựa chọn chức năng xem nhiệt độ, đồ ẩm. Lúc
này giao diện xem nhiệt độ độ ẩm sẽ được bật và dữ liệu đo được tại thời điểm
hiện tại được tải lên trên giao diện. Trang 5 lOMoARcPSD| 45222017
Đồồ án đồồ h a Máy Tínhọ
● Cảnh báo: Kho nhiệt độ tăng quá mức giới hạn, ứng dụng sẽ gửi một cảnh báo cho
người dùng ngay trên giao diện xem nhiệt độ độ ẩm.
● Thống kê dữ liệu: Toàn bộ giá trị nhiệt độ độ ẩm đã đo sẽ được lưu lại và thống kê
theo thời gian. Khi người dùng chọn chức năng xem sẽ chuyển đến giao diện lưu
trữ. Tại đây người dùng có thể xem dữ liệu được lưu bằng cách lựa chọn ngày cần
xem.Khi người dùng lựa chọn ngày bất kì, toàn bộ dữ liệu nhiệt độ, độ ẩm được
đo ngày hôm đó sẽ được mở ra. 2. THIẾT BỊ
- Cảm biến nhiệt độ DHT11
Ảnh 1. C m biếến nhi t đ đ m DHT11ả ệ ộ ộ ẩ - Modern wifi Trang 6 lOMoARcPSD| 45222017
Đồồ án đồồ h a Máy Tínhọ
Ảnh 2. Modern Wifi ESP8266 - Dây Data Ảnh 3. Dây data - Board Ảnh 4. Board - Dây nối Trang 7 lOMoARcPSD| 45222017
Đồồ án đồồ h a Máy Tínhọ Ảnh 5. Dây nốếi . SƠ ĐỒ 3 LẮP ĐẶT - Chân kết nối ESP8266 Cảm biến DHT11 G GND 3 V VCC D1 DATA
- Hình ảnh thiết bị sau lắp đặt
Ảnh 6. Lắếp đ t thiếết bặ ị III. CHẠY THIẾT BỊ 1. CODE ADUINO
+ Tiến hành mở file main.ino có đường dẫn
“DA_DHMT_Nhom_Hiep_Cuong\Code_arduino\ionic\main\main.ino” Trang 8 lOMoARcPSD| 45222017
Đồồ án đồồ h a Máy Tínhọ Ảnh 7. Code Arduino
Tại đây chúng ta thay đổi tên và mật khẩu wifi theo wifi chúng ta sử dụng:
char ssid[] = "matkhauwifi"; // Tên wifi
char pass[] = "12345679"; // Mật khẩu +
Chọn Tools Board NodeMCU 1.0(ESP Module) Trang 9 lOMoARcPSD| 45222017
Đồồ án đồồ h a Máy Tínhọ Ảnh 8. Ch n boardọ
+ Chọn Tools Port COM5 // Việc chọn cổng phụ thuộc vào cổng bạn đang sử dụng Trang 10 lOMoARcPSD| 45222017
Đồồ án đồồ h a Máy Tínhọ Ảnh 9 Ch n c ngọ ổ 2. KẾT NỐI HIVEMQ
+ Chúng ta truy cập địa chỉ: http://www.hivemq.com/demos/websocket-client/ Trang 11 lOMoARcPSD| 45222017
Đồồ án đồồ h a Máy Tínhọ
Ảnh 10. Kếết nốếi HiveMQ
+ Chọn Connect Add New Topic Subscription
Nhập testtopic/1 rồi chọn Subscribe
Ảnh 11. T o testtopicạ 3. UPLOAD CODE
Chọn để upload code lên thiết bị đã được kết nối Trang 12 lOMoARcPSD| 45222017
Đồồ án đồồ h a Máy Tínhọ Ảnh 12. Upload code
+ Chờ cho quá trình upload code hoàn tất
Chúng ta có thể mở Serial Monitor để xem kết quả chạy code Trang 13 lOMoARcPSD| 45222017
Đồồ án đồồ h a Máy Tínhọ
Ảnh 13. Serial Monitor
+ Lúc này dữ liệu nhiệt độ, độ ẩm đo được sẽ được đẩy lên testtopic chúng ta đã tạo ở bước trước Trang 14 lOMoARcPSD| 45222017
Đồồ án đồồ h a Máy Tínhọ
Ảnh 14. D li u đ y lến testtopicữ ệ ẩ
+ Đồng thời dữ liệu được đẩy lên Firebase
Đường dẫn Firebase lưu dữ liệu nhiệt độ, độ ẩm phục vụ ứng dụng này
https://console.firebase.google.com/project/temperature-be828/database/temperature-be828/data
// Tài kho n và c s d li u đảơ ở ữ ệ ượ ạ ởc t o b i hai thành viến Lế Vắn Th c và Phan Quốếc Nh tụ ậ
+ Dữ liệu trên Firebase được lưu trữ như sau Trang 15 lOMoARcPSD| 45222017
Đồồ án đồồ h a Máy Tínhọ
Ảnh 15. D li u trến firebaseữ ệ
+ Chi tiết dữ liệu trên Firebase
Ảnh 16. Chi tiếết d li u trến firebaseữ ệ Trang 16 lOMoARcPSD| 45222017
Đồồ án đồồ h a Máy Tínhọ
IV. GIAO DIỆN ỨNG DỤNG VÀ HƯỚNG DẪN SỬ DỤNG 1. GIAO DIỆN KHỞI ĐỘNG
- Tại giao diện khởi động, người dùng có 2 lựa chọn:
● Chuyển tới giao diện xem nhiệt độ, độ ẩm. Người dùng có hai cách thực hiện điều
này. Người dùng click vào “ Sensor ”hoặc chọn censor để thực hiện chức năng này.
● Chuyển tới giao diện xem dữ liệu nhiệt độ độ ẩm đã được lưu lại theo thời gian cụ
thể. Người dùng click vào “Data” hoặc chọn data để thực hiện chức năng này. Trang 17 lOMoARcPSD| 45222017
Đồồ án đồồ h a Máy Tínhọ
Ảnh 17. Giao di n kh i đ ngệ ở ộ
2. GIAO DIỆN XEM NHIỆT ĐỘ ĐỘ ẨM
- Tại giao diện này, người dùng được cung cấp giá trị nhiệt độ độ ẩm được đo tại thời
điểm này. Nếu dữ liệu đo được vượt qua mức giới hạn, người dùng sẽ nhận được cảnh
báo ngay trên giao diện này để nắm bắt được vấn đề cần giải quyết. Trang 18 lOMoARcPSD| 45222017
Đồồ án đồồ h a Máy Tínhọ
Ảnh 18. Giao di n xem nhi t đ , đ mệ ệ ộ ộ ẩ 3. GIAO DIỆN DỮ LIỆU
- Tại giao diện này hiển thị danh sách các ngày liên tục từ lúc người dùng sử dụng ứng
dụng. Đây chính là danh sách để người dùng có thể xem lại dữ liệu đo được từ các ngày
trước đó cho đến thời điểm hiện tại. Khi người dùng cần xem dữ liệu của một ngày bất kì Trang 19 lOMoARcPSD| 45222017
Đồồ án đồồ h a Máy Tínhọ
nào đó, người dùng sẽ chọn ngày cần xem để chuyển đến giao diện hiển thị thông tin
nhiệt độ độ ẩm ngày hôm đó.
Ảnh 19. Giao di n d li uệ ữ ệ
4. GIAO DIỆN DỮ LIỆU NHIỆT ĐỘ, ĐỘ ẨM THEO NGÀY
- Tại đây cung cấp đầy đủ từng mốc thời gian và dữ liệu nhiệt độ, độ ẩm đo được trong ngày được chọn. Trang 20