Ở bài trước, chúng ta đã biết được cách Arduino gửi dữ liệu và bị điều khiển bởi Socket Server. Hôm nay, chúng ta sẽ viết chương trình điều khiển trên Smartphone để điều khiển Arduino.
Bạn đang xem: Esp8266 kết nối internet
VIII. Làm thế nào để điện thoại kết nối được đến Socket Server
1. Lựa chọn ngôn ngữ lập trình cho thiết bị di động
Theo như mô hình mà chúng ta đã thống nhất với nhau từ các bài trước, thì ESP8266 nằm ở tầng 2 cùng tầng với điện thoại thông minh.
Nhưng khác với ESP8266, chúng ta không thể dùng C++ để lập trình cho Android (Java) hay IOS (Object-C hoặc Swift). Vì vậy, không thể chơi lầy áp dụng những code ở phần ESP8266 vào điện thoại được.
Như vậy, nếu muốn viết một chương trình điều khiển Arduino từ điện thoại thông minh, thì theo cách thông thường, chúng ta phải học Java để lập trình Socket Client cho Android, học Object-C hoặc Swift để lập trình Socket Client trên i
OS. Thật NẢN phải không nào? Nếu là mình thì mình sẽ không làm thế. Vì chẳng khác nào phải viết lại những dòng code đơn giản cho những việc đơn giản!
Như vậy, chúng ta cần tìm một giải pháp chung cho vấn đề này. Biết rằng Socket Client có thể chạy trên trình duyệt (Sử dụng javascript giống với Socket Server). Cả 2 thiết bị i
Phone hay Android đều có trình duyệt để mà chạy. Không những thế các thiết bị khác như máy tính, Windows Phone, Blackberry Phone,... cũng có thể sử dụng đươc vì nó đều có điện thoại. Vậy, chúng ta sẽ lập trình một trang web thân thiện với điện thoại để thực hiện điều này.
Đến đây, một số bạn nếu đã biết lập trình Android, i
OS sẽ cảm thấy mình hơi ngu, vì bảo rằng, trình duyệt Web thì làm sao "smooth" (chạy mượt) như các chương trình native được. Mình cũng xin được trả lời, thay vì suy nghĩ việc một web app thì phải "ít mượt" hơn native app, thì bạn hãy thử trải nghiệm phần mềm i
Nút (i
Phone và Android) của mình. Đây là một chương trình dùng để điều khiển thiết bị điện trong nhà, do mình sử dụng công nghệ hybrid app, bản chất là web app! Hãy thử trên nhiều thiết bị và đánh giá hiệu năng nhé.
Việc lập trình web app cũng không hề dễ dàng, nhưng cũng không quá khó. Vì sao mình lại nói thế? Vì web app muốn chạy ổn định với một bộ giao diện đồ sộ như một trang web bình thường sẽ rất khó. Nhưng nếu bạn theo dõi công nghệ thường xuyên thì sẽ biết rằng hiện nay, với sự ra đời của HTML5 và CSS3 đã tạo điều kiện thuận lợi để các công nghệ thiết kế web mới ra đời: responsive, flat template. Vơi những công nghệ này, hiệu năng của web app sẽ tăng đáng kể vì không phải tốn thời gian render các hiệu ứng (CSS3 hỗ trợ hiệu ứng nhiều lắm luôn), không cần flash để chơi video hay nghe nhạc (HTML5 đã cân việc này),... và còn rất nhiều điều hay nữa.
Ngoài ra, khi đã rãnh với webapp, bạn sẽ dễ dàng lên được hybrid app. Bản chất hybrid app là một dạng webapp + native plugin. Nghĩa là bạn lập trình webapp thì sẽ bị hạn chế truy cập vào các thiết bị phần cứng của điện thoại như la bàn, gps, camera,... (bản chất webapp sẽ vẫn chơi được nhưng sẽ tùy duyên - tùy thiết bị). Nhưng khi bạn lên level hybrid app thì các plugin native sẽ giúp bạn đi sâu hơn mà bạn vẫn lập trình bình thường như việc bạn đang làm bên webapp.
Nghe có vẻ tuyệt vời phải không nào? Vậy thì tại sao, bạn không thử một lần làm webapp trong dự án này cùng với mình nhỉ? Mình là một người đi trước trong phần hybrid app và cảm nhận được sức mạnh của nó. Và trước đó, cũng đã thử webapp trước khi đi lên hybrid app. Và lời khuyên dành cho bạn, đó là nếu bạn muốn đi nhanh thì hãy học webapp thật tốt vào, tư duy lập trình và khả năng lập trình trên thiết bị di động của bạn sẽ lên rất nhanh.
2. Cách lập trình webapp
Bản chất webapp không phải là một phần mềm native trên điện thoại của bạn. Nó thực chất là một trang web được thiết kế để phù hợp với thiết bị di động của bạn. Và bạn sẽ tương tác với app của bạn thông qua trình duyệt web trên thiết bị điện thoại
Vì webapp bản chất là một trang web, nên bạn cần một nơi lưu trữ nội dung trang web và các tài nguyên (resource) cần thiết. Có hai cách để lưu trữ một webapp:
Đóng gói thành file cài đặt native, trong đó sẽ có một webview dùng để truy cập đến webapp được lưu trữ trong file cài đặt này. Cái này, tiện ở chỗ, chương trình được lưu trên máy nên có thể sử dụng offline. Nhưng mình nghĩ trong dự án này đã nhắm đến internet nên thôi, để dành lên hybrid app làm luôn. Vì hybrid app nó dùng phương pháp này.Lưu trữ trên một Server, người dùng dùng điện thoại thông minh để truy cập webapp từ trình duyệt web của họ. Chúng ta sẽ sử dụng phương pháp này, vì nó dễ cho mình khi hướng dẫn các bạn, và cũng dễ cho các bạn khi các bạn mới học . Đôi bên cùng vui vẻ làm việc
Để lập trình một webapp, chúng ta cần biết được các từ khóa chính và phụ, để giúp cho các bạn khi bí có thể tìm tài liệu bên ngoài đọc thêm nhằm nâng cao kiến thức, ahihi.
Từ khóa chínhHTML5: Bản chất là HTML cộng thêm một số thẻ mới như thẻ audio, video,... để giúp bạn xây dựng cấu trúc trang web. Cấu trúc trang web giống như sườn của một tòa nhà. CSS3: Bản chất là CSS cộng thêm một số thuộc tính mới nhằm làm trang web đẹp hơn mà không sử dụng đến hình ảnh hoặc javascript như bo góc, hiệu ứng fadeout, fadein,... nhiều hiệu ứng lắm, nói vài cái cho anh em vui thôi.JAVASCRIPT: Giống như ngôn ngữ mà chúng ta sử dụng trong socket server
Nhưng nói là nói vậy thôi, anh em mà bắt đầu nghiên cứu từ 3 từ khóa đó là chết ngay.
Từ khóa phụĐể đi nhanh, chúng ta cần một chiếc xe Ferrari. Và những chiếc xe như thế được gọi là framework (thư viện). Và mình xin đề xuất một bộ thư viện cân hết cả 3 từ khóa chính trên. Đó là Mobile Angularjs. Bản chất thư viện này là sự kế thừa của:
Tản mạn xíuVậy, bạn sẽ đọc các mục dưới kia như thế nào cho hiệu quả?
Nếu bạn đã biết đến lập trình WebNếu bạn chưa biết gì về lập trình web
Thì thật khó khăn. Nếu bạn thích đi từ từ để hiểu hết mọi khía cạnh thì sẽ rất tốn thời gian, nhưng nó sẽ tốt hơn cho bạn, bạn hãy đọc 6, 7 chương đầu trong mục Getting started của Angularjs. Hoặc chỉ cần nắm được controller, service của Angularjs hoạt động như thế nào là được.Còn nếu bạn thích đi nhanh, làm một phát được ngay, nhưng có thể sẽ có rất nhiều khoảng trống trong kiến thức. Nhưng được cái là có cái để cầm nắm ngay thì hãy đọc theo các phần mình viết ở dưới.Mình sẽ giúp các bạn:Điều khiển bật tắt đèn.Đọc cảm biến (mưa cho nhanh).Từ dưới Arduino nhấn nút thì gửi giá trị lên Server.Ghi thông tin lên màn hình I2C LCD.Nhiệm vụ của các bạn là vận dụng sự sáng tạo của bạn thân để sáng tạo và tôn trọng quyền tác giả của mình trong những đoạn code này.
Chúc các bạn, đọc bài thành công!
3. Khởi tạo project Webapp đầu tiên
Như đã nói ở trên, để webapp hoạt động, chúng ta cần một nơi để host (lưu trữ) web. Bạn có thể tự tạo một server (khác vớ socket server) để làm chỗ lưu trữ web cho project Webapp này. Còn theo mình, hãy tận dụng luôn project socket server hiện tại làm nơi host luôn cho nó tập trung.
Các bạn hãy clone socket
Server8 của mình về nhé.
git clone https://github.com/ngohuynhngockhanh/socket
Server8
Sau đó, bạn chạy lệnh
npm install
để cài đặt project
Cấu trúc thư mục của socket
Server8 như sau:
Những file bôi đỏ là những file mà bạn sẽ quan tâm.
File index.js chính là file socket server như những bài trước.File webapp.js chính là file webapp socket client, dùng ngôn ngữ javascript để cài đặt chương trình trên client. Mình sẽ nói rõ hơn trong ví dụ này.File home.html chính là file giao diện của webapp socket client.Nhiệm vụ của các file thì đã rõ, vậy vì sao chúng lại có nhiệm vụ như thế?Hãy cùng nhắc lại mô hình.
Theo mô hình này, và những gì chúng ta đã học được. Nhiệm vụ trong phần này chính là xây dựng module Webapp (chạy trên trình duyệt web) ở tầng 2. Module này nằm ở tầng 2, vì vậy để giao tiếp với Arduino. Nó phải đi qua Socket Server (tầng 1), rồi ESP8266 (tầng 2) và Arduino (tầng 3). Và ngược lại, để từ Arduino, giao tiếp tới Webapp, ta cần đi qua ESP8266 (tầng 2), rồi lên Socket Server (tầng 1) và cuối cùng là Webapp (tầng 2).
Mục đích ban đầu của chúng ta là từ Webapp (máy tính và điện thoại) điều khiển Arduino. Để đạt được mục đích này, chúng ta đã trải qua 2 phần và kết quả đạt được ở phần 2 đó là: Điều khiển Arduno từ Socket Server. Trong mô hình đó, chúng ta xem ESP8266 làm trung gian vận chuyển thông tin từ Socket Server. ESP8266 nhận được gì từ Socket Server (thông qua Socket) thì lại gửi xuống hết Arduino (Serial command). Arduino xử lý xong, lại gửi trả kết quả về cho ESP8266 (Serial command), ESP8266 nhận được tin từ Arduino thì đẩy toàn bộ đến Socket server (thông qua Socket). Như vậy, đó là một chu trình khép kín toàn phần. Còn chu kỳ khép kín bán phần là từ Arduino sau mỗi chu kỳ bao nhiêu mili giây gì đó thì gửi kết quả cảm biến hay giá trị nút nhấn về cho Socket Server.
Vậy, trong bài toán nêu ra ở vấn đề 1: Webapp điều khiển Arduino (trong mạng Wifi). Chúng ta đã giải được một nửa. Bây giờ, chúng ta sẽ giải bài toán biến Socket Server trở thành nơi trung gian trao đổi hàng hóa (dữ liệu) giữa ESP8266 và Trình duyệt Web. Vì khi giải bài toán này, kết hợp với bài toán đã giải ở phần 2 (Điều khiển Arduno từ Socket Server), chúng ta sẽ giải quyết được bài toán Webapp điều khiển Arduino (trong mạng Wifi). Vì, trong mô hình đó, ESP8266 và Socket Server sẽ trở thành nơi trung gian vận chuyển dữ liệu giữa Webapp và Arduino.
Và hiển nhiên, bài toán biến Socket Server trở thành nơi trung gian trao đổi hàng hóa (dữ liệu) giữa ESP8266 và Trình duyệt Web cũng không có gì là khó khăn cả.
Để giải bài toán trên, chúng ta sẽ dùng khái niệm namespace của thư viện socket.io (cái thư viện mà chúng ta dùng để xây dựng phương thức giữa tầng 1 và tầng 2 đấy ahihi). Vậy namespace là gì?
Hãy tưởng tượng, ESP8266 là một người đi xin việc đến trung tâm giới thiệu việc làm (Socket Server) để xin việc. Anh ta được trung tâm xếp vào nhóm người xin việc. Còn anh Webapp là đại diện một công ty cần tuyển nhân viên, anh ta cũng đến trung tâm việc làm để đăng tin tuyển dụng. Như vậy, trung tâm (Socket Server) sẽ xếp anh ta vào nhóm người tuyển nhân viên. Và namespace chính là những gì được bôi đen. Nó được dùng để phân biệt giữa những nhóm sự vật (socket) có điểm chung cùng thuộc một loại nhiệm vụ nào đó do người lập trình tự đặt. Bản thân Websocket không có khái niệm namespace! Mà chính thư viện socket.io đề ra để người lập trình dễ dàng phân loại chúng (tương tự mô hình MQTT).
Cũng từ ví dụ trên, bản thân nó cũng đã nêu lên được bản chất của vấn đề chúng ta cần giải quyết. Chúng ta cần lập trình cho Socket server đứng giữa làm trung gian kết nối nhóm người xin việc và nhóm người tuyển nhân viên.
Gọi:
ESP8266 (nhóm người xin việc) thuộc namespace esp8266.Webapp (nhóm người tuyển nhân viên) thuộc namespace webapp.Định nghĩa công việc của socket server:
Khi webapp gửi (emit) dữ liệu (lệnh + JSON) đến socket server, thì socket server sẽ gửi toàn bộ dữ liệu (lệnh + JSON) đến esp8266.Khi esp8266 gửi (emit) dữ liệu (lệnh + JSON) đến socket server, thì socket server sẽ gửi toàn bộ dữ liệu (lệnh + JSON) đến esp8266.Xem thêm: Hướng dẫn cách cắm dây internet vào tivi đời cũ, hướng dẫn cách kết nối wifi cho tivi đời cũ
Ngoài ra, socket server còn làm nhiệm vụ host các file tĩnh của webapp (cái này không liên quan socket nhé), nên chúng ta sẽ làm một vài dòng code nhỏ để webapp chạy ngon lành, các bạn có thể không cần hiểu cũng được, vì từ đây, chúng ta sẽ không code gì trên socket server nữa, vì nó ổn định rồi!
Ok, cùng bắt đầu ví dụ 1 thôi nào!
4. Ví dụ 1: Bật tắt đèn LED từ webapp + đọc cảm biến mưa từ webapp
Trước khi đọc code, hiểu diễn giải, mời các bạn, xem video!
Code Socket Server
Và đây chính là code hoàn thiện của socket server.
const PORT = 3484;//Đặt địa chỉ Port được mở ra để tạo ra chương trình mạng Socket Servervar http = require("http");var express = require("express");//#include thư viện express - dùng để tạo server http nhanh hơn thư viện http cũvar socketio = require("socket.io")//#include thư viện socketiovar ip = require("ip");var app = express();//#Khởi tạo một chương trình mạng (app)var server = http.Server(app)var io = socketio(server);//#Phải khởi tạo io sau khi tạo appvar webapp_nsp = io.of("/webapp")//namespace của webappvar esp8266_nsp = io.of("/esp8266")//namespace của esp8266var middleware = require("socketio-wildcard")();//Để có thể bắt toàn bộ lệnh!esp8266_nsp.use(middleware);//Khi esp8266 emit bất kỳ lệnh gì lên thì sẽ bị bắtwebapp_nsp.use(middleware);//Khi webapp emit bất kỳ lệnh gì lên thì sẽ bị bắtserver.listen(PORT);// Cho socket server (chương trình mạng) lắng nghe ở port 3484console.log("Server nodejs chay tai dia chi: " + ip.address() + ":" + PORT)//Cài đặt webapp các fie dữ liệu tĩnhapp.use(express.static("node_modules/mobile-angular-ui")) // Có thể truy cập các file trong node_modules/mobile-angular-ui từ xaapp.use(express.static("node_modules/angular")) // Có thể truy cập các file trong node_modules/angular từ xaapp.use(express.static("node_modules/angular-route")) // Có thể truy cập các file trong node_modules/angular-route từ xaapp.use(express.static("node_modules/socket.io-client")) // Có thể truy cập các file trong node_modules/socket.io-client từ xaapp.use(express.static("node_modules/angular-socket-io"))// Có thể truy cập các file trong node_modules/angular-socket-io từ xaapp.use(express.static("webapp")) // Dùng để lưu trữ webapp//giải nén chuỗi JSON thành các OBJECTfunction Parse
Json(jsondata) { try { return JSON.parse(jsondata); } catch (error) { return null; }}//Bắt các sự kiện khi esp8266 kết nốiesp8266_nsp.on("connection", function(socket) {console.log("esp8266 connected")socket.on("disconnect", function() {console.log("Disconnect socket esp8266")})//nhận được bất cứ lệnh nàosocket.on("*", function(packet) {console.log("esp8266 rev and send to webapp packet: ", packet.data) //in ra để debugvar event
Name = packet.data<0>var event
Json = packet.data<1> || {} //nếu gửi thêm json thì lấy json từ lệnh gửi, không thì gửi chuỗi json rỗng, {}webapp_nsp.emit(event
Name, event
Json) //gửi toàn bộ lệnh + json đến webapp})})//Bắt các sự kiện khi webapp kết nốiwebapp_nsp.on("connection", function(socket) {console.log("webapp connected")//Khi webapp socket bị mất kết nốisocket.on("disconnect", function() {console.log("Disconnect socket webapp")})socket.on("*", function(packet) {console.log("webapp rev and send to esp8266 packet: ", packet.data) //in ra để debugvar event
Name = packet.data<0>var event
Json = packet.data<1> || {} //nếu gửi thêm json thì lấy json từ lệnh gửi, không thì gửi chuỗi json rỗng, {}esp8266_nsp.emit(event
Name, event
Json) //gửi toàn bộ lệnh + json đến esp8266});})Để cho nó hoạt động, các bạn đừng quên chạy lệnh dưới ở thư mục socket
Server8 nhé.
node index.js
Code ESP8266Của chúng ta cũng đã hoàn thiện và sẽ tái sử dụng lại code đó. Chúng ta chỉ việc thêm biến char namespace_esp8266<> vào và đặt tên nó là esp8266 nhé. Các bạn cung nhớ đổi IP của socket server, ssid và psk mạng wifi nha. Nếu không biết cách lấy IP của socket server thì xem ở bài viết này.
#include #include #include #include //include thư viện để kiểm tra free RAM trên con esp8266extern "C" { #include "user_interface.h"}const byte RX = D1;const byte TX = D2;Software
Serial my
Serial(RX, TX, false, 256); Serial
Command s
Cmd(my
Serial); // Khai báo biến sử dụng thư viện Serial Command
Socket
IOClient client;const char* ssid = "MACHTUDONG"; //Tên mạng Wifi mà Socket server của bạn đang kết nốiconst char* password = "smarthome12345"; //Pass mạng wifi ahihi, anh em rãnh thì share pass cho mình với.char host<> = "192.168.200.46"; //Địa chỉ IP dịch vụ, hãy thay đổi nó theo địa chỉ IP Socket server của bạn.int port = 3484; //Cổng dịch vụ socket server do chúng ta tạo!char namespace_esp8266<> = "esp8266"; //Thêm Arduino!//từ khóa extern: dùng để #include các biến toàn cục ở một số thư viện khác. Trong thư viện Socket
IOClient có hai biến toàn cục// mà chúng ta cần quan tâm đó là// RID: Tên hàm (tên sự kiện// Rfull: Danh sách biến (được đóng gói lại là chuối JSON)extern String RID;extern String Rfull;void setup(){ //Bật baudrate ở mức 57600 để giao tiếp với máy tính qua Serial Serial.begin(57600); my
Serial.begin(57600); //Bật software serial để giao tiếp với Arduino, nhớ để baudrate trùng với software serial trên mạch arduino delay(10); //Việc đầu tiên cần làm là kết nối vào mạng Wifi Serial.print("Ket noi vao mang "); Serial.println(ssid); //Kết nối vào mạng Wifi Wi
Fi.begin(ssid, password); //Chờ đến khi đã được kết nối while (Wi
Fi.status() != WL_CONNECTED) { //Thoát ra khỏi vòng delay(500); Serial.print("."); } Serial.println(); Serial.println(F("Da ket noi Wi
Fi")); Serial.println(F("Di chi IP cua ESP8266 (Socket Client ESP8266): ")); Serial.println(Wi
Fi.local
IP()); if (!client.connect(host, port, namespace_esp8266)) { Serial.println(F("Ket noi den socket server that bai!")); return; } s
Cmd.add
Default
Handler(default
Command); //Lệnh nào đi qua nó cũng bắt hết, rồi chuyển xuống hàm default
Command! Serial.println("Da san sang nhan lenh"); }void loop(){ //Khi bắt được bất kỳ sự kiện nào thì chúng ta có hai tham số: // +RID: Tên sự kiện // +RFull: Danh sách tham số được nén thành chuỗi JSON! if (client.monitor()) { //in ra serial cho Arduino my
Serial.print(RID); my
Serial.print("\r"); my
Serial.print(Rfull); my
Serial.print("\r"); //in ra serial monitor Serial.print(RID); Serial.print(" "); Serial.println(Rfull); //Kiểm tra xem còn dư bao nhiêu RAM, để debug uint32_t free = system_get_free_heap_size(); Serial.println(free); } //Kết nối lại! if (!client.connected()) { client.reconnect(host, port, namespace_esp8266); } s
Cmd.read
Serial();}void default
Command(String command) { char *json = s
Cmd.next(); client.send(command, (String) json);//gửi dữ liệu về cho Socket Server //In ra serial monitor để debug Serial.print(command); Serial.print(" "); Serial.println(json);}Code Arduino
Chúng ta sẽ tái sử dụng Ví dụ 3: Ví dụ 2 + Đọc cảm biến mưa
Bạn hãy nối mạch như sau nhé:
Linh kiện cần chuẩn bị:
ESP8266v12 được đóng gói thành các mạch như NodeMCU 0.9, v1.0, ESP8266 Uno Wifi, Wemos full hoặc mini,...
Bạn lắp mạch này thêm vào phần mạch ở trên nhé. Nếu bạn không có cảm biến mưa thì cũng không sao cả, kệ nó, giá trị sẽ được tự tạo random. Sẽ thú vị hơn nhiều khi không có module cảm biến mưa!
#include #include #include // Thêm vào sketch thư viện Serial Commandconst byte RX = 3; // Chân 3 được dùng làm chân RXconst byte TX = 2; // Chân 2 được dùng làm chân TX Software
Serial my
Serial = Software
Serial(RX, TX); Serial
Command s
Cmd(my
Serial); // Khai báo biến sử dụng thư viện Serial Command int red = 4, blue = 5; // led đỏ đối vô digital 4, led xanh đối vô digital 5int rain
Sensor = 6; // Chân tín hiệu cảm biến mưa ở chân digital 6 (arduino) const unsigned long CHU_KY_1_LA_BAO_NHIEU = 5000UL; //Cứ sau 5000ms = 5s thì chu kỳ lặp lại void setup() { //Khởi tạo Serial ở baudrate 57600 để debug ở serial monitor Serial.begin(57600); //Khởi tạo Serial ở baudrate 57600 cho cổng Serial thứ hai, dùng cho việc kết nối với ESP8266 my
Serial.begin(57600); //pin
Mode 2 đèn LED là OUTPUT pin
Mode(red,OUTPUT); pin
Mode(blue,OUTPUT); pin
Mode(rain
Sensor,INPUT);// Đặt chân cảm biến mưa là INPUT, vì tín hiệu sẽ được truyền đến cho Arduino // Một số hàm trong thư viện Serial Command s
Cmd.add
Command("LED", led); //Khi có lệnh LED thì sẽ thực thi hàm led s
Cmd.add
Command("RAIN", rain_detect);//Khi có lệnh RAIN thì sẽ thực thi hàm rain để kiểm tra trị cảm biến mưa Serial.println("Da san sang nhan lenh");} unsigned long chuky1 = 0;void loop() { //Khởi tạo một chu kỳ lệnh, chu kỳ là 5000ms if (millis() - chuky1 > CHU_KY_1_LA_BAO_NHIEU) { chuky1 = millis(); rain_detect(); } s
Cmd.read
Serial(); //Bạn không cần phải thêm bất kỳ dòng code nào trong hàm loop này cả} // hàm led_red sẽ được thực thi khi gửi hàm LED_REDvoid led() { Serial.println("LED"); char *json = s
Cmd.next(); //Chỉ cần một dòng này để đọc tham số nhận đươc Serial.println(json); Static
Json
Buffer json
Buffer; //tạo Buffer json có khả năng chứa tối đa 200 ký tự Json
Object& root = json
Buffer.parse
Object(json);//đặt một biến root mang kiểu json int red
Status = root<"led"><0>;//json -> tham số root --> phần tử thứ 0. Đừng lo lắng nếu bạn không có phần tử này, không có bị lỗi đâu! int blue
Status = root<"led"><1>;//json -> tham số root --> phần tử thứ 0. Đừng lo lắng nếu bạn không có phần tử này, không có bị lỗi đâu! //kiểm thử giá trị Serial.print(F("red
Status ")); Serial.println(red
Status); Serial.print(F("blue
Status ")); Serial.println(blue
Status); Static
Json
Buffer json
Buffer2; Json
Object& root2 = json
Buffer2.create
Object(); root2<"red
Status"> = red
Status; root2<"blue
Status"> = blue
Status; //Tạo một mảng trong JSON Json
Array& data = root2.create
Nested
Array("data"); data.add(red
Status); data.add(blue
Status); //in ra cổng software serial để ESP8266 nhận my
Serial.print("LED_STATUS"); //gửi tên lệnh my
Serial.print("\r"); // gửi \r root2.print
To(my
Serial); //gửi chuỗi JSON my
Serial.print("\r"); // gửi \r //in ra Serial để debug root2.print
To(Serial); //Xuống dòng //xuất ra màn hình digital
Write(red, red
Status); digital
Write(blue, blue
Status);}void rain_detect() { Static
Json
Buffer json
Buffer; Json
Object& root = json
Buffer.create
Object(); //đọc giá trị cảm biến rồi in ra root root<"digital"> = digital
Read(rain
Sensor); root<"message"> = digital
Read(rain
Sensor) ? "Khong mua" : "Co mua ne ahihi"; //Gửi đi hoy! //in ra cổng software serial để ESP8266 nhận my
Serial.print("RAIN"); //gửi tên lệnh my
Serial.print("\r"); // gửi \r root.print
To(my
Serial); //gửi chuỗi JSON my
Serial.print("\r"); }Nhiệm vụ của đoạn code trên cũng không khác mấy so vớ ví dụ 3 của phần 2.
Tạo một chu kỳ 5 giây một lần gửi dữ liệu lên Socket server.Code Webapp (Javascript)
Nội dung của file webapp.js, các bạn hãy mở lên và xem, hoặc xem thông qua:
angular.module("my
App", < "ng
Route", "mobile-angular-ui","btford.socket-io">).config(function($route
Provider) { $route
Provider.when("/", { template
Url: "home.html", controller: "Home" });}).factory("my
Socket", function (socket
Factory) {var my
Io
Socket = io.connect("/webapp");//Tên namespace webappmy
Socket = socket
Factory({io
Socket: my
Io
Socket});return my
Socket;/////////////////////// Những dòng code ở trên phần này là phần cài đặt, các bạn hãy đọc thêm về angularjs để hiểu, cái này không nhảy cóc được nha!}).controller("Home", function($scope, my
Socket) {////Khu 1 -- Khu cài đặt tham số //cài đặt một số tham số test chơi//dùng để đặt các giá trị mặc định $scope.Cam
Bien
Mua = "Không biết nữa ahihi, chưa thấy có thằng nào cập nhập hết"; $scope.leds_status = <1, 1>////Khu 2 -- Cài đặt các sự kiện khi tương tác với người dùng//các sự kiện ng-click, nhấn nút$scope.update
Sensor = function() {my
Socket.emit("RAIN")}$scope.change
LED = function() {console.log("send LED ", $scope.leds_status)var json = {"led": $scope.leds_status}my
Socket.emit("LED", json)}////Khu 3 -- Nhận dữ liệu từ Arduno gửi lên (thông qua ESP8266 rồi socket server truyền tải!)//các sự kiện từ Arduino gửi lên (thông qua esp8266, thông qua server)my
Socket.on("RAIN", function(json) {$scope.Cam
Bien
Mua = (json.digital == 1) ? "Không mưa" : "Có mưa rồi yeah ahihi"})//Khi nhận được lệnh LED_STATUSmy
Socket.on("LED_STATUS", function(json) {//Nhận được thì in ra thôi hihi.console.log("recv LED", json)$scope.leds_status = json.data})//// Khu 4 -- Những dòng code sẽ được thực thi khi kết nối với Arduino (thông qua socket server)my
Socket.on("connect", function() {console.log("connected")my
Socket.emit("RAIN") //Cập nhập trạng thái mưa})});Trừ cái phần cài đặt ra, các bạn không cần quan tâm, chỉ quan tâm đến 4 khu mà mình nói thôi nha.
Bien
Mua = "Không biết nữa ahihi, chưa thấy có thằng nào cập nhập hết";$scope.leds_status = <1, 1>Trong javascript dấu ; không quan trọng!Khu 2 -- Cài đặt các sự kiện khi tương tác với người dùng
Các hàm được đặt tên theo dạng: $scope. = function() { }Các sự kiện khi tương tác với người dùng được cài đặt bên trong file webapp.js và được gọi khi thêm vào các tham số bên trong file home.htmlVí dụ: hàm change
LED sẽ được gọi khi bị thay đổi.Hàm update
Sensor() sẽ được gọi khi thẻ được click vào!Khu 3 -- Nhận dữ liệu từ Arduno gửi lên (thông qua ESP8266 rồi socket server truyền tải!)Cái này giống với những kỳ mình đã nòi ở socket server. Chỉ khác là tên biến được thay đổi thành my
Socket!Khu 4 -- Những dòng code sẽ được thực thi khi kết nối với Arduino (thông qua socket server)Tương tự như void setup() của Arduino!Code Webapp (HTML)
Cái này rất khó giải thích, nhưng nói chung, bạn cứ mở file home.html lên và thử chỉnh sửa file này và đọc tiếp các phần sau là sẽ hiểu ngay. Hãy vận dụng quy tắc copy paste, bạn nhé.
Sản phẩm Industrial PC STEAM Kits Arduino Adafruit - USA Pololu - USA MikroElektronika - EU Module Cảm Biến Module Chức Năng Linh kiện điện tử Dụng Cụ Điện Tử Phụ Kiện Điện Tử Adapter, Nguồn và Pin Robot Kits Sản phẩm DIY PROJECTS PHPo
C Io
T Board - Korea
STEM EDUCATIONHƯỚNG DẪN LẮP RÁP ROBOT OMNI 3 BÁNHHƯỚNG DẪN LẮP RÁP XE ROBOT ARDUINO CƠ BẢNAdafruit 16-Channel 12-bit PWMPHPo
C - Web-based Thermometer
XY Plotter drawing via Web
Xe Robot Pololu Zumo 32U4Công nghệ tương lai
GSM/GNSS 2 click
Industrial PC STEAM Kits Arduino Adafruit - USA Pololu - USA Mikro
Elektronika - EU Module Cảm Biến Module Chức Năng Linh kiện điện tử Dụng Cụ Điện Tử Phụ Kiện Điện Tử Adapter, Nguồn và Pin Robot Kits Sản phẩm DIY PROJECTS PHPo
C Io
T Board - Korea
CÁC BƯỚC CÀI ĐẶT MODULE WIFI ESP8266
(Chu ý: Bước này chỉ làm một lần trước khi sử dụng module )
Bước 1: TÁCH RỜI VI ĐIỀU KHIỂN TRUNG TÂM ATMEGA328P RA KHỎI BOARD ARDUINO UNO:
Bước 2: KẾT NỐI BOARD ARDUINO UNO (không có vi điều khiển ATMEGA328p) VỚI MODULE ESP8266 THEO SƠ ĐỒ PHẦN CỨNG SAU:
ESP8266 Board Arduino uno
3.3V, RST, CH-PD (EN), GPIO2---------3.3V
GND, GPIO0---------------------------------GND
Rx-----------------------------------------Rx
Tx------------------------------------------Tx
Bước 2: CẤP NGUỒN CHO BOARD ARDUINO UNO
Bước 2: MỞ CHƯƠNG TRÌNH ARDUINO IDE.
Tạo một project mới, với đoạn code sau:////////////////////////////////Code cho cài đặt thông số Module ESP8266////////////////////////////
#include
const char* ssid = "Dieukhientuxa"; //tên host wifi muốn truy cập
const char* password = "12345678"; //pass wifi muốn truy cập
Wi
Fi
Server server(80); //Mặc định port luôn là 80
void setup()
{
Serial.begin(9600);
delay(10);
pin
Mode(2,OUTPUT);
Serial.print("Connecting to ");
Serial.println(ssid);
Wi
Fi.begin(ssid, password);
while (Wi
Fi.status() != WL_CONNECTED)
{
delay(300);
Serial.print("*");
digital
Write(2,!digital
Read(2));
}
Serial.println(“ ”);
Serial.println("Wi
Fi connected. IP address: ");
Serial.println(Wi
Fi.local
IP());
server.begin();
}
void loop()
{
Wi
Fi
Client client = server.available();
if(!client)
return;
while(!client.available())
delay(1);
String request = client.read
String
Until("\r");
Serial.println(request);
client.flush();
delay(1);
}
/////////////////////////////////////////////The end////////////////////////////
Ø Sau khi biên dịch chương trình hoàn tất không có lỗi, chọn board esp8266 , và Comport phù hợp (Tool – board, Tool – Port) và nạp chương trình cho board arduino, khi xuất hiện < 100% > có nghĩa là đã nạp thành công.Chú ý: Nếu không tìm thấy board thì phải tham khảo cách cài đặt board esp8266 cho arduino IDE theo link sau:https://randomnerdtutorials.com/how-to-install-esp8266-board-arduino-ide/
Nạp chương trình thành công khi xuất hiện:
Bước 3: NGẮT NGUỒN ĐIỆN CHO BOARD ARDUINO (rút cáp USB từ máy tính kết nối với board Arduino), NGẮT KẾT NỐI CÁC CHÂN gpio0, gpio2, Rst, CH-PD.
Kết nối lại nguồn cho board Arduino Uno, khi đó sẽ thấy led (thường màu xanh) trên board ESP8266 chớp tắt với tần số 1 giây, trong tường hợp này là board ESP8266 đã được cài đặt, và đang dò tìm wifi với tên và pass giống trong code ở bước 2.
Ngắt kết nối nguồn cho board arduino (rút cáp USB), để chuẩn bị bước tiếp theo.
Bước 4: CÀI ĐẶT HOST WIFI CHO ĐIỆN THOẠI VÀ CÀI PHẦN MỀM WIFI TỪ ĐIỆN THOẠI.
Cài đặt host wifi cho điện thoại:
Cài phần mềm Wifi cho điện thoại: tải app “Wifi RC Car ESP8266” cho điện thoại di động.
Bước 5: KIỂM TRA TRUYỀN NHẬN GIỮA ĐIỆN THOẠI VỚI MODULE ESP8266.
Tắt Wifi hotspot trên điện thoại di động.
Kết nối board Arduino Uno với máy tính, vào Arduino IDE mở Serial Monitor sẽ thấy ESP8266 truyền kí tự “*” lên máy tính do chưa tìm được Host Wifi tương ứng.
Sau đó mở Wifi hotspot trên điện thoại di động, tức điện thoại di động trở thành bộ phận phát wifi với tên và pass đã đặt ở bước 4. Khi đó màn hình serial monitor sẽ chỉ ra địa chỉ IP của board ESP8266, và cố gắng nhớ IP này (chú ý: mỗi board khác nhau sẽ có địa chỉ khác nhau). Khi đó led trên ESP8266 không còn chớp tắt nữa báo hiệu điện thoại di động và board ESP8266 đã kết nối.
Mở phần mềm wifi RC car đã cài đặt ở bước 4 và nhập địa chỉ IP vào và tiến hành điều khiển, sẽ thấy kí tự tương ứng trên Serial Monotor.
------------------------------CHÚC THÀNH CÔNG !!!!!!!----------------------------------
