3.5.3. Bảng kết nối tổng hợp
Bảng 3. 2: Kết nối linh kiện
Cảm biến/Module Chân Arduino Mega 2560
D1 10
NODE MCU ESP8266 D2 11
GND GND Vcc Vcc Cảm biến DHT21 GND GND Data Digital 12 Vcc Vcc Cảm biến BH1750 GND GND SCL SCL SDA SDA Vcc Vcc Cảm biến TDS GND GND Data Analog 4 Vcc Vcc Cảm biến DS18B20 GND GND Data Digital 30 1 GND 2/Quạt Digital 18 Bàn phím điều khiển 3/Đèn Digital 19 4/Mái che Digital 2 5/Phun sương Digital 3
1 GND
2/SET Analog 0
Bàn phím cài đặt 3/MODE/OK Analog 1
4/+ Analog 2
Module relay Vcc GND IN 1 IN 2 IN 3 IN 4 Vcc GND Digital 4 Digital 5 Digital 6 Digital 7
3.5.4. Mạch in kết nối linh kiện
Hình 3.14: Mạch in của hệ thống
Để các kết nối được thuận tiện, dễ dàng hơn thì sơ đồ mạch được vẽ bằng phần mềm Proteus 8.0. Mạch in đáp ứng các yêu cầu như nhỏ gọn, tiết kiệm vật liệu và đảm bảo mạch hoạt động ổn định.
Hình 3.15: Sơ đồ nguyên lí của tồn hệ thống
Với sơ đồ ngun lí, chúng ta sẽ có cái nhìn tổng quan về hoạt động kết nối và truyền tín hiệu giữa các module, các linh kiện.
3.6. Hệ thống giám sát và điều khiển
3.6.1. WebSocket – giao tiếp hai chiều giữa client và serverTìm hiểu WebSocket Tìm hiểu WebSocket
WebSoket là cơng nghệ hỗ trợ giao tiếp hai chiều giữa client và server bằng cách sử dụng một TCP socket để tạo một kết nối hiệu quả và ít tốn kém. Mặc dù được thiết kế để chuyên sử dụng cho các ứng dụng web, lập trình viên vẫn có thể đưa chúng vào bất kì loại ứng dụng nào.
WebSockets mới xuất hiện trong HTML5, là một kỹ thuật Reverse Ajax. WebSockets cho phép các kênh giao tiếp song song hai chiều và hiện đã được hỗ trợ trong nhiều trình duyệt (Firefox, Google Chrome và Safari). Kết nối được mở thông qua một HTTP request (yêu cầu HTTP), được gọi là liên kết WebSockets với những header đặc biệt. Kết nối được duy trì để bạn có thể viết và nhận dữ liệu bằng JavaScript như khi bạn đang sử dụng một TCP socket đơn thuần.
Dữ liệu truyền tải thông qua giao thức HTTP (thường dùng với kĩ thuật Ajax) chứa nhiều dữ liệu không cần thiết trong phần header. Một header request/response của HTTP có kích thước khoảng 871 byte, trong khi với WebSocket, kích thước này chỉ là 2 byte (sau khi đã kết nối). Vậy giả sử bạn làm một ứng dụng game có thể tới 10,000 người chơi đăng nhập cùng lúc, và mỗi giây họ sẽ gửi/nhận dữ liệu từ server.
Ưu điểm
WebSockets cung cấp khả năng giao tiếp hai chiều mạnh mẽ, có độ trễ thấp và dễ xử lý lỗi. Khơng cần phải có nhiều kết nối như phương pháp Comet long-polling và cũng khơng có những nhược điểm như Comet streaming.
API cũng rất dễ sử dụng trực tiếp mà không cần bất kỳ các tầng bổ sung nào, so với Comet, thường đòi hỏi một thư viện tốt để xử lý kết nối lại, thời gian chờ timeout, các Ajax request (yêu cầu Ajax), các tin báo nhận và các dạng truyền tải tùy chọn khác nhau (Ajax long-polling và jsonp polling). Nhược điểm
Nó là một đặc tả mới của HTML5, nên nó vẫn chưa có được sự hỗ trợ từ tất cả các trình duyệt.
Khơng có phạm vi u cầu nào. Do WebSocket là một TCP socket chứ không phải là HTTP request, nên khơng dễ sử dụng các dịch vụ có phạm vi-u cầu, như SessionInViewFilter của Hibernate. Hibernate là một framework kinh điển cung cấp một bộ lọc xung quanh một HTTP request. Khi bắt đầu một request, nó sẽ thiết lập một contest (chứa các transaction và liên kết JDBC) được ràng buộc với luồng request. Khi request đó kết thúc, bộ lọc hủy bỏ contest này.
Mơ hình Socket Server và Socket Client
Chúng ta sẽ sử dụng NodeJS để lập trình cho một server được cài NodeJS nằm ngoài Internet. Máy chủ này sẽ tiếp nhận mọi yêu cầu từ Socket Client và sẽ là môi giới liên lạc giữa các Socket Client. Các Socket Client có thể là mạch ESP8266 hay là người dùng sử dụng trình duyệt web (trên điện thoại thơng minh hoặc trên máy tính điện tử).
Hình 3.16: Mơ hình liên kết giữa Socket Server và Socket Client Mơ hình liên kết như hình 3.17 cho ta thấy chúng được chia thành 3 tầng:
Tầng cao nhất là Socket Server – gọi là tầng Server. Tầng giữa gồm ESP8266 và trình duyệt – gọi là tầng Client. Tầng dưới cùng là Arduino – gọi là tầng Application.
Phương thức giao tiếp, kết nối giữa Server và Client là Internet thơng qua các gói dữ liệu được truyền ở dạng chuỗi JSON.
Giao tiếp giữa tầng Client và Application được thực hiện bởi cổng Serial.
Cấu trúc hoạt động Server – Client được chia thành 4 giai đoạn: Giai đoạn 1:
Server tạo Socket, gán số hiệu cổng và lắng nghe yêu cầu nối kết. Server sẵn sàng phục vụ Client.socket(): Server yêu cầu tạo một socket để có thể sử dụng các dịch vụ của tầng vận chuyển.
bind(): Server yêu cầu gán số hiệu cổng (port) cho socket.
listen(): Server lắng nghe các yêu cầu nối kết từ các client trên cổng đã được gán.
socket(): Client yêu cầu tạo một socket để có thể sử dụng các dịch vụ của tầng vận chuyển, thông thường hệ thống tự động gán một số hiệu cổng còn rảnh cho socket của Client.
connect(): Client gởi yêu cầu nối kết đến server có địa chỉ IP và Port xác định. accept(): Server chấp nhận nối kết của client, khi đó một kênh giao tiếp ảo được hình thành, Client và server có thể trao đổi thơng tin với nhau thông qua kênh ảo này.
Sau khi chấp nhận yêu cầu nối kết, thông thường server thực hiện lệnh read() và nghẽn cho đến khi có thơng điệp u cầu (Request Message) từ client gởi đến.
Server phân tích và thực thi yêu cầu. Kết quả sẽ được gởi về client bằng lệnh write().
Sau khi gởi yêu cầu bằng lệnh write(), client chờ nhận thông điệp kết quả (ReplyMessage) từ server bằng lệnh read().
Giai đoạn 4:
Kết thúc phiên làm việc.
Các câu lệnh read(), write() có thể được thưc hiện nhiều lần (ký hiệu bằng hình ellipse).
Kênh ảo sẽ bị xóa khi Server hoặc Client đóng socket bằng lệnh close().
3.6.2. Tạo dự án Node JS
Sau khi đã cài Nodejs, chúng ta tiến hành các bước sau:
Mở hộp thoại Run bằng cách ấn tổ hợp phím Windown+R, sau đó gõ lệnh “cmd” để bật cửa sổ Command line
Hình 3.18: Hộp thoại Run
Hình 3.19: Cửa sổ Command line Sau đó gõ vào lệnh: npm install để tiến hành cài đặc project.
Hình 3.20: Tiến trình khởi tạo project 3.6.3. Tạo Socket Server và Socket Client
3.6.3.1 Socket Server
Hình 3.21: Code tạo Socket Server
Sử dụng Sublime Text 3 để thực hiện viết code khởi tạo Socket Server. Sau khi đã tạo Socket Server, để chạy được chúng ta thực hiện: Nhấn chuột phải vào thư mục chứ file
index.js. Chọn Git Bash Here. Gõ lệnh: node index.js
Hình 3.22: Chọn Git Bash Here
Hình 3.23: Chạy Socket Server
Khi nhận được thông báo: “Server nodejs chay tai dia chi: 192.168.1.5:3484” tức là Server đã được tạo tại địa chỉ 192.168.1.5 và đang lắng nghe ở port 3484, đợi có Client “request” sẽ chấp nhận truy cập.
3.6.3.2 Socket Client
Để tiến hành tạo socket client, chúng ta thực hiện viết code cho esp8266 với chương trình Arduino IDE.
Hình 3.24: Một đoạn code tạo socket client
Đối với chương trình chúng ta cần lưu ý phần char host[]= “192.168.43.218”. Vì khi chạy ở local mới sử dụng đoạn code này (chạy trong wifi nội bộ) và phần “192.168.43.218” là địa chỉ IP4 của máy tính khi kết nối wifi. Địa chỉ IP4 này mỗi máy mỗi khác nên cần kiểm tra lại.
Khi đã up dự án lên Heroku thì phần char host[] này sẽ điền vào địa chỉ web thay vì địa chỉ IP4.
3.6.3.3 Package cần thiết cho dự án.
Tùy thuộc vào các chức năng bạn muốn có trong dự án thì sẽ cài đặc các package cần thiết. Trong dự án này, các chức năng bao gồm:
Client kết nối với Server. Tạo Webapp. Kết nối Firebase.
Cho trình duyệt web cả máy tính và điện thoại kết nối Webapp. Vì vậy các Package cần thiết chứa trong file Package.json được thể hiện ở hình 3.26
Hình 3.25: Các package sử dụng trong dự án 3.6.4. Lập trình giao diện HTML
3.6.4.1 Giao diện đăng nhập
Hình 3.26: Giao diện đăng nhập vào trang web
Để đảm bảo chỉ có những người có trách nhiệm chăm sóc vườn rau mới có thể truy cập vào hệ thống, việc tạo tài khoản đăng nhập là cần thiết.
Tại giao diện đăng nhập, người dùng phải nhập đúng Username và Password đặt trước mới có thể truy cập vào các trang tiếp theo. Nếu nhập sai sẽ được trang thông báo “Bạn nhập sai tên đăng nhập hoặc mật khẩu!”.
Hình 3.27: Code Webapp cho phần thơng báo đăng nhập 3.6.4.2 Giao diện trang chủ
Hình 3.28: Giao diện tab Trang chủ
Để có giao diện trên, chúng ta sẽ áp dụng một style CSS để phân các vùng như: #main, #head, #head_logo, #left, #content, #right, #footer…Sau đó kết hợp với ngôn ngứ HTML để tạo ra một giao diện cân đối giữa các phần.
Hình 3.29: Code CSS định dạng style
Hình 3.30: Code HTML cho tab Trang chủ 3.6.4.3 Giao diện tab “Công ty”
Minh Hịa là một cơng ty chun về trồng rau thủy canh công nghệ cao, cho nên nhu cầu về thu thập dữ liệu môi trường và tự động điều chỉnh các thơng số đó là rất cần thiết. Đây cũng là cơng ty tài trợ chính cho luận văn.
Hình 3.31: Giao diện tab Công ty
Ở tab này, các nội dung thể hiện bao gồm logo, tên và địa chỉ công ty, các video và hình ảnh thể hiện quá trình trồng và chăm sóc rau, chia sẻ kinh nghiệm với các nơng dân và đối tác.
Hình 3.32: Code HTML cho tab Cơng ty 3.6.4.4 Giao diện tab “Điều khiển”
Tab Điều khiển có thể coi là tab quan trọng và khó viết code nhất vì nó là tab chứa các thơng số real time, điều khiển các thiết bị với các sự kiện. Bên cạnh đó ở tab này ngồi CSS và HTML thì cịn sử dụng ngơn ngữ Angular.
Giao diện ở tab này được thiết kế đơn giản, thân thiện với người dùng, dễ theo dõi các thông số cũng như thuận tiện trong việc điều khiển các thiết bị.
Hình 3.33: Giao diện tab Điều khiển
Ở tab này, chúng ta có thể quan sát thấy các thông số nhiệt độ, độ ẩm, cường độ ánh sáng…đang được cập nhật theo thời gian thực. Ở phần bảng điều khiển thể hiển hai chế độ là “Auto” cho chế độ chạy tự động theo các thông số đã cài đặt trước, hai là “Manual” cho chế độ điều khiển thủ công.
Khi đang ở chế độ “Auto” nếu chúng ta check vào các ơ điều khiển thì khơng có chuyện gì xảy ra. Những ơ này sẽ điều khiển được nếu chúng ta chọn chế độ “Manual”. Khi check vào các ô này, trạng thái sẽ thay đổi theo. Ngoài ra nút “Cập nhật” có nhiệm vụ đồng bộ các sự kiện ở các Client khác nhau và đồng thời làm mới dữ liệu.
3.6.4.5 Giao diện tab Biểu đồ
Tại tab biểu đồ này, chúng ta sẽ kết nối với Firebase để upload dữ liệu. Dữ liệu này được tạo ra bằng cách đăng ký một tài khoảng trên Firebase và tạo một dự án. Phần này sẽ được hướng dẫn tại mục 3.6.7.
Dữ liệu sẽ được thu thập từ Arduino truyền đến ESP8266 và từ đây dữ liệu sẽ được upload lên Firebase. Dữ liệu này sẽ được cập nhật mỗi ba phút một lần.
Hình 3.35: Biểu đồ nhiệt độ khơng khí
Hình 3.37: Biểu đồ cường độ ánh sáng
Hình 3.38: Biểu đồ nhiệt độ dung dịch
Hình 3.39: Biểu đồ nồng độ hịa tan chất rắn (TDS) 3.6.4.6 Lập trình Webapp
Webapp là phần cực kỳ quan trọng, nó đóng vai trị như hệ thần kinh của cả trang web. Để dễ hiểu, chúng ta có thể xem các phần lập trình HTML, CSS chính là phần sườn, các bộ phận của một cơ thể còn Webapp là hệ thần kinh, kết nối tất cả
lại với nhau, thực hiện các tác vụ gửi nhận chuỗi JSON để hiển thị thông số và điều khiển thiết bị.
Hình 3.40: Code Webapp
Hình 3.41: Đoạn code Webapp chọn chế độ “Auto” 3.6.5. Đăng kí dự án trên Heroku
Để bắt đầu sử dụng nền tảng đám mây Heroku, chúng ta sẽ thực hiện đăng ký tài khoảng để kích hoạt và sử dụng dịch vụ.
Bước 1: Truy cập trang web Heroku.com và bắt đầu tạo tài khoản. - Khi truy cập vào web, chúng ta chọn “Sign up”
Hình 3.42: Giao diện đăng ký tài khoản Heroku Bước 2: Kiểm tra Mail để kích hoạt tài khoản.
Hình 3.43: Mail xác nhận kích hoạt từ Heroku
Khi nhận được mail và thực hiện xác nhận thì chúng ta đã có thể sử dụng nền tảng đám mây Heroku.
Bước 3: Tạo một dự án mới
- Thực hiện đặt tên và chọn “Create app”
Hình 3.44: Dự án sau khi đăng ký 3.6.6. Đưa dự án lên Heroku
Để đưa dự án lên nền tảng đám mây Heroku, đầu tiên cài đặt phần mềm Heroku CLI.
Sau đó mở cửa sổ lệnh Command Prompt và đăng nhập vào Heroku bằng tài khoản đã tạo.
Thực hiện các lệnh lần lượt:
- $ heroku login
- $ cd my-project/
- $ heroku git:clone -a smart-farm-hydroponic - $ cd smart-farm-hydroponic
Hình 3.45: Đăng nhập Heroku từ Command Prompt Tiến hành đưa ứng dụng lên Heroku
Sau khi đăng nhập, tiếp tục thực hiện các lệnh
- $ git commit -am "make it better" - $ git push heroku master
Hình 3.46: Các lệnh upload dự án 3.6.7. Đăng kí Firebase và kết nối dữ liệu
Để Webapp có thể nhận dữ liệu từ Firebase, chúng ta cần tạo một tài khoản Firebase để thực hiện kết nối dữ liệu.
Bước 1: Truy cập vào trang web http://www.Firebase.com/. Bước 2: Đăng nhập bằng tài khoảng Google.
Bước 3: Cấp quyền truy cập cho tài khoản.
Bước 4: Sau khi đăng nhập, truy cập vào Firebase Console. Bước 5: Chọn “Add a project” để tạo một dự án mới.
Hình 3.48: Giao diện khi tạo dự án thành công Bước 6: Chọn mục “Project overview” và sau đó là “Project settings” để xem các thơng số.
Hình 3.49: Thơng số dự án
Hình 3.50: Các thơng số của Firebase trên Webapp Như vậy, việc kết nối dữ liệu giữa Webapp và Firebase đã được hoàn thiện.
CHƯƠNG 4: KẾT QUẢ VÀ KIẾN NGHỊ 4.1. Kết quả
Sau quá trình thực hiện đề tài thì hệ thống được hồn thành và được đưa vào chạy thử nghiệm tại vườn rau thủy canh – công ty Minh Hịa.
Thiết kế hồn chỉnh tủ điện và hệ thống trang web điều khiển. Hệ thống hoạt động ở hai chế độ tự động và tay.
Có thể giám sát thơng số mơi trường và thực hiện tác vụ điều khiển trên: Tủ điện, bàn phím vật lý.
Trình duyệt web truy cập từ điện thoại thơng minh hoặc máy tính. Thơng số được cập nhật theo thời gian thực và hiển thị dưới dạng biểu đồ dễ
giám sát và xử lí số liệu.
Hình 4. 1: Hệ thống được lắp đặt thực tế
Các cảm biến của hệ thống được lắp đặt nơi thơng thống để đảm bảo các số liệu có tính chính xác cao. Tủ điện được cố định chắc chắn, tủ điện có ổ khóa để đảm bảo tính an tồn về điện.
Hình 4. 2: Sơ đồ hoạt động của hệ thống
Sơ đồ hoạt động của hệ thống được mô tả ngắn gọn như sau: Khi các điều kiện môi trường tác động vào cảm biến thì cảm biến sẽ gửi tín hiệu này đến Arduino Mega 2560 để xử lí. Các thơng số này được so sánh với các thông số đã được cài đặt trước và sẽ thực hiện điều khiển các thiết bị chấp hành qua module relay 5V.
Các số liệu này sẽ được gửi đến ESP8266 qua cổng serial, và ESP8266 sẽ đưa số liệu hiển thị trên web, giao tiếp hai chiều với server.