Development - Zer0Gnap/Smartfarm-With-IoT GitHub Wiki

การพัฒนาระบบ (Hardware)

จากการศึกษาข้อมูลเกี่ยวกับ ESP32 แล้ว พบว่าสามารถทำงานได้หลายอย่างและมีประสิทธิภาพ และสิ่งที่ Smartfarm with IOT ได้นำมาใช้ มีดังนี้

1.Wifi Manager

เราเห็นความสำคัญถึงความสะดวกในการเชื่อมต่อ Internet จึงได้ทำ Wifi Manager ขึ้นมา

IMG-20190430-014837.jpg

  • เริ่มจากตั้งชื่อและรหัสผ่านในโหมด AP

Arp-6-638.jpg

Untitled.png

  • สร้างตัวแปรเพื่อรับ SSID และ Password

1556550195389.jpg

1556550904395.jpg

  • คำการเซตโหมดของ WiFi เป็นโหมด AP + STA, สร้าง IP, สร้างหน้าเว็บ

1556550974346.jpg

1.png

  • จากฟังก์ชัน MyWeb() เป็นฟังก์ชั้นในการสร้างหน้าเว็บ และค้นหา SSID ที่อยู่บริเวณรอบๆ

Untitled1.png

  • เมื่อทำการ Login Wifi ESP32 จะรับค่ามาจาก HTML

Untitled2.png


2.การส่งค่าขึ้น Databases

  • ทำการ connect host ก่อน

1556568935173.jpg

  • ทำการสร้าง URL เพื่อส่งข้อมูลขึ้น Database

1556569009249.jpg

จาก ESP32 1556568039880.jpg

ในฐานข้อมูล Databases

1556569707112.jpg


3.หน้าจอ OLED

  • การแสดงผลหน้าจอ OLED เป็นส่วนหนึ่งในการแจ้งสถานะ Wifi, สถานะ NETPIT, วัน-เวลา และค่าเซนเซอร์ต่างๆ เขียนโค้ดได้ดังนี้

1556565088074.jpg

ได้ผลลัพธ์ดังนี้

IMG-20190430-015058.jpg

หมายเหตุ : เนื่องจากยังไม่ได้ต่อเซนเซอร์ ทำให้ค่าต่างๆไม่เป็นความจริง


4.NETPIE

  • NETPIE เป็น cloud platform ที่พัฒนาขึ้นเพื่ออำนวยความสะดวกให้เกิดการสื่อสารระหว่างอุปกรณ์ โดยเราต้องกำหนด APPID , KEY , SECRET KEY , ALIAS ของ NETPIE ก่อน

1556640996855.jpg

ทำการสร้าง microgear และเชื่อมต่อ

1556641227728.jpg

ใน loop() ควรใส่ microgear.loop() เพื่อคงการเชื่อมต่อ และถ้าหลุดการเชื่อมต่อ ให้เชื่อมต่อใหม่อัตโนมัติ

1556641397032.jpg

ในการส่งค่า publish ควร deley() ขั้น เพื่อให้เวลาในการส่ง

1556641774067.jpg

ทำการ subscribe topic ที่เราสนใจ เพื่อให้ทำการ Event เมื่อมี message

1556642005401.jpg


Softwaer

RESTful API

  • เราจะทำการติดตั้ง Node.js ก่อนโดยสามารถ Download ได้ที่ https://nodejs.org/en/download/
  • ต่อไปจะเป็นการสร้างไฟลล์ package.json เพื่อระบุรายละเอียดของโปรแกรมโดยทำการสร้าง Folder ไว้ที่ที่ต้องการแล้ว command ไปที่ Folder ที่เราสร้าง หลังจากนั้นทำการ init node เพื่อสร้างไฟล์ package.json โดยใช้คำสั่ง npm init -y

1556562520100.jpg

Express

คือ framework ที่มีความยืดหยุ่นสูง สามารถเอาไปสร้างเว็บไซต์ธรรมดา หรือจะใช้ทำ Single Page Application โดยใช้ Express เป็นตัว API Server เพื่อรับส่งข้อมูลผ่าน RESTFul ก็สามารถทำได้ เราสามารถติดตั้งได้โดยใช้คำสั่ง npm install express ในการติดตั้ง Express

วิธีการ import library

const express = require('express') //เรียกใช้ express

Annotation-2019-04-30-123523.png

Requests

ใช้ในเรียกการสื่อสารพื้นฐานใน HTTP Protocol เช่น การ GET POST และนอกจากนี้ยังรองรับ HTTPS Protocol เราสามารถติดตั้งได้โดยใช้คำสั่ง
npm install requests --save ในการติดตั้ง Requests

วิธีการ import library

const express = require('requests') //เรียกใช้ requests

Annotation-2019-04-30-123257.png

Body parser

ใช้ในการช่วยถอดรหัส JSON file เนื่องจาก Express นั้น ไม่สามารถตีความ JSON ใน Body ได้เราสามารถติดตั้งได้โดยใช้คำสั่ง
npm install body-parser --save ในการติดตั้ง Body parser

วิธีการ import library

const express = require('body-parser') //เรียกใช้ body-parser

Annotation-2019-04-30-223447.png

Microgear

ใช้ในการสื่อสารระหว่าง MQTT Protocol กับ Node.js เพื่อใช้ในการสื่อสารระหว่าง RESTful API กับ Microcontroller ซึงเป็นบริการของ Netpie ที่เปิดให้ใช้ได้ฟรี เราสมารถดูวิธีใช้งานแบบละเอียดได้จาก https://github.com/netpieio/microgear-nodejs.git ราสามารถติดตั้งได้โดยใช้คำสั่ง
npm install microgear --save ในการติดตั้ง Microgear

วิธีการ import library

const express = require('microgear') //เรียกใช้ Microgear

Annotation-2019-04-30-224739.png

หลังจากที่เราเตรียมไฟลล์ในการทำ RESTful API เรียบร้อยแล้วต่อไปเราจะไปเตรียม Cloud Server เพื่อใช้ในการ Deploy ไฟลล์ที่ใช้ในการทำ Line bot โดยในที่นี้เราจะเลือกใช้ Heroku

  • สามารถสมัครสมาชิก และศึกษาวิธีใช้งานโดยไปที่ https://www.heroku.com/

เมื่อเราได้ Cloud Server มาแล้วแต่การ Deploy ไฟลล์ขึ้ไปจะต้องใช้คำสั่ง git เพื่อช่วยในในการ Deploy ค่าไปที่ Server ของ Heroku โดยเราจะต้องติดตั่ง git ลงไปในเครื่องของเราเพื่อที่จะสามารถใช้คำสั่งต่างของ git ได้

  • ไปที่ https://git-scm.com/ เพื่อทำการติดตั้ง และศึกษษวิธีใช้งาน

ต่อไปจะเป็นการลงทะเบียน channel กับ Line เพื่อสร้าง Line chat bot โดย

หลังจากที่สร้าง channel เรียบร้อยแล้ว ให้เราสร้างไฟลล์ index.js ขึ้นมาเพื่อยืนยัน Webhook URL กับทาง Line โดยจะต้องใช้เว็บที่ใช้จะต้องเป็น HTTPS เท่านั้นดังนั้นจึงต้อง Deploy ไฟลล์ขั้นไปที่ Heroku โดย code ที่จะใช้ยืนยันจะเป็นการส่งสถาณะ 200 กลับมาเพื่อยืนยันสถาณะว่าสามรถทำงานได้ Annotation-2019-05-01-012319.png

Annotation-2019-05-01-012429.png

เมื่อเราทำการสร้างไฟลล์พื้นฐานสำหรับ Line chat bot เรียบร้อยแล้วต่อไปเราจะทำให้สามารถรับข้อความจาผู้ใช้และนำไปประมวลผลเพื่อใช้ในขั้นตอนต่อไปได้ โดยจะอธิบายการทำงานเฉพาะในส่วนที่สำคัญ เมื่อได้รับข้อความจากผู้ใช้ที่ส่งข้อความผ่านทาง Line โปรแกรมจะประมวลผลข้อความเพื่อให้สนองตามที่ผู้ใช้ต้องการ โดยจะมีข้อความ สองรูปแบบคือข้อความที่ Line Beacon ส่งมา กับ ข้อความที่ผู้ใช้เป็นคนพิมพ์เข้ามา

Annotation-2019-05-01-014529.png

ในส่วนของ Line Beacon จะมี่สองสถาณะคือผู้ใช้เดินเข้ามาในพื้นที่ที่กำหนดกับเดินออกจากพื้นที่ที่กำหนดโดยโดยจะเทียบคำว่า enter แสดงถึงการที่ผู้ใช้เข้ามาในพื้นที่ที่กำหนด และเมื่อตรงเงื่อนไขก็จะส่งข้อความกลับไปหาผู้ใช้โดยใช้ token ในการระบุผู้ใช้ที่ต้องการส่งถึง

Annotation-2019-05-01-015020.png

ในส่วนการประมวลผลข้อความที่ผู้ใช้พิมพ์เข้ามา โดยจะทำการตัดคำตามต่ำแหน่งเพื่อเทียบว่าควรจะทำอะไรต้อไป เช่น ในส่วนนี้จะทำการตั้งค่าการแจ้งเตือนของอุณหภูมิ และจะทำการส่งข้อความต่อไปให้ MCU เพื่อเปลี่ยนแปลงการตั้งค่าตามที่ผู้ใช้ต้องการ และส่งข้อความกลับไปหาผู้ใช้เพื่อยืนยันว่าเปลี่ยนแปลงการตั้งค่าสำเร็จ

Annotation-2019-05-01-015606.png

ในส่วนของ Line Notify จะทำการแจ้งเตือนว่าอุปกรณ์ตัวไหนเชื่อมต่อหรือหลุดการเชื่อมต่อกับ Microgear โดยจะอ่านข้อมูลที่ได้แล้วนำไปส่งต่อผ่าน Line API เพื่อจะแจ้งแตือนใน Line Application ต่อไป

Annotation-2019-05-01-015921.png

ส่วนขอการรวม package เพื่อส่งการแจ้งเตือนกลับไปที่ผู้ใช้

Annotation-2019-05-01-015953.png

ส่วนของการอ่านค่าเซ็นเซอร์จาก MCU โดยจะใช้ Microgear(MQTT Protocol) เป็นตัวกลางในการเชื่อมต่อโดยจะทำการ subscribe ค่าขอเซ็นเซอร์ที่ต้องการเพื่อนำไปใช้ในขั้นตอนอื่นๆ

Annotation-2019-05-01-021112.png

ในส่วนนี้จะเป็นการแยกข้อความตามหัวข้อที่ได้จากการ subscribe

Annotation-2019-05-01-021454.png

Web Service

Web Service จะทำหน้าที่เป็นตัวกลางในการสื่อสารระหว่า MySql server กับ MCU โดยจำใช้ HTTP Protocol ในการสื่อสารในที่นี้จะใช้ภาษา PHP ในการเขียนโปรแกรม โดยจะเริ่มสร้างฐานข้อมูลขึ้นมาตามที่เราต้องการในที่นี้เราจะใช้ phpMyAdmin เป็น DBMS ในการจัการฐานข้อมูล

Annotation-2019-05-01-022621.png

เมื่อเราได้ฐานข้อมูลมาแล้วต่อไปจะเป็นการสร้างตัว Web Service โดยตัวโปรแกรมจะอ่านค่าที่ได้จากการ GET ค่ามาจาก HTTP Protocol และเมื่อได้ค่ามาแล้วจะทำการเพิ่มข้อมูลลงไปในฐานข้อมูลโดยใช้ภาษา SQL ในการจัดการ โดยในรูปตัวอย่างจะเป็นการเก็บค่าต่างๆจากเซ็นเซอร์ เข้าไปไว้ในฐานข้อมูล ซึงถ้าต้องการเพิ่มข้อมูลอื่นลงไปในฐานข้อมูลก็จะใช้รูปแบบในการจัดเก็บแบบนี้

Annotation-2019-05-01-023023.png

Wed Application

Wed Application ใช้ภาษาPHP HTML CSS และJavascript ในการสร้าง และได้ทำการดึง Wed Template มาใช้
โดยใช้ Protocol : FTP (File Transfer Protocol) ใช้ในการรับส่งไฟล์ระหว่าง Client และ Server โดยจะมีพอร์ตที่ใช้งานอยู่ 2 พอร์ต คือ พอร์ต 20 ใช้ในการรับส่งไฟล์ ส่วนอีกพอร์ตคือ พอร์ต 21 ใช้ในการควบคุมหรือส่งคำสั่ง FTP

โดยมีขั้นตอนดังนี้

1.Config Database

1556607430613 1556611350752

  • จะทำการสร้างตัวแปร $host $dbname $username $passwordเพื่อเก็บ ชื่อ,host,username และ password ของฐานข้อมูลที่ต้องการเชื่อมต่อ
  • สร้าง Class PDO เพื่อใช้ในการติดต่อกับ Database

2.สร้างหน้า login

1556607922586

  • ใช้คำสั่ง require เพื่อเรียกใช้ไฟล์ที่config Database ไว้ ในที่นี้ชื่อ config.php

3.Dashboard

  • ค่าที่รับจากSensor

1556634739038

-แสดงค่าที่ Sensor อ่านได้ แล้วส่งไปเก็บไว้ที่ NETPI โดยใช้ libarry microgear เพื่อดึงค่าจาก NETPI มาแสดง
-รูปภาพที่แสดงดึงมาใช้จาก icon8 https://icons8.com/icons/pack/clothing

1556647431262

  • สภาพอากาศ

1556634779696

1556647938019

  • กราฟ

1556634804816

-นำค่าที่อ่านได้จากSensor มาสร้างกราฟ

1556657517441

labels: >> กำหนดค่าที่แกน x
label: >> ชื่อกราฟ
data: >> ข้อมูลที่นำไปสร้างกราฟ
backgroundColor:>> สีของกราป(LGB)
  • ตาราง

1556634842518

-นำค่าต่างๆที่อ่านได้จากSensor 6 ชั่วโมงล่าสุดมาเปรียบเทียบกัน

1556648061857

⚠️ **GitHub.com Fallback** ⚠️