คู่มือการใช้ NETPIE

// เราต้องเรียก microgear.loop() เป็นระยะ เพื่อรกั ษาการเช่ือต่อ microgear.loop(); if (timer >= 1000) { Serial.println(\"Publish...\"); // พิมพแ์ จ้งการส่งข้อมูล NETPIE // chat หาตวั เองด้วย state ท่ีตรงข้ามกนั if(state==0){ microgear.chat(ALIAS,state); state=1; }else{microgear.chat(ALIAS,state); state=0; } timer = 0; } else timer += 100; } else { Serial.println(\"connection lost, reconnect...\"); if (timer >= 5000) { microgear.connect(APPID); timer = 0; } else timer += 100; } delay(100);} คูม่ ือการใชง้ าน NETPIE - 51

รูปท่ี 4.3 Console ของโปรแกรม netpie_blink กลา่ วโดยสรุปคือ โปรแกรมนีส้ งั่ ให้ NodeMCU ทาการ Chat หาตวั เองทกุ ๆ 1 วนิ าที ด้วยคา่ ท่ีตรงข้ามกบั สถานะปัจจบุ นั (ถ้าเปิดอยู่ จะสง่ “0” แตถ่ ้าปิดอยจู่ ะสง่ “1”) สลบั กนั ไปเรื่อยๆ ผลท่ีเกิดขนึ ้ คือ LEDจะกระพริบทกุ 1 วนิ าที เป็นตวั อยา่ งของการเรียกใช้ Microgear Function เพ่ือทาอะไรบางอยา่ งเมื่อมีข้อความเข้ามาLab 4.2: IoT Switch Lab 4.2 จะแสดงการส่ือสารแบบสองทางระหว่าง Thing 2 ชนดิ คือทงั้ ฮาร์ดแวร์และซอฟต์แวร์โดยจะให้ HTML5 สง่ คา่ 0 และ 1 ไปยงั NodeMCU เมื่อ NodeMCU ได้รับข้อความจะกระทาตามเง่ือนไขที่กาหนด และตอบกลบั มายงั HTML5 ขนั้ ตอนคือ คูม่ ือการใชง้ าน NETPIE - 52

1.ฝั่ง NodeMCU เขียนไฟล์ pieled.ino ซง่ึ ดดั แปลงมาจากโค้ด netpie_blink.ino ใน Lab 4.1(เพียงแตต่ ดั สว่ นตงั้ เวลาและ Chat หาตวั เองออก) และสามารถใช้ AppID, Key และ Secret เดมิ ท่ีใช้ในLab 4.1 ได้ 2.ฝ่ัง HTML5 Switch ให้เขียนโค้ด switch.html โดยใช้ AppID เดียวกบั ฝ่ัง NodeMCU แตใ่ ห้ไปสร้าง Application Key ใหม่ชนดิ Session Key 3. ใส่ APPID, KEY, และ SECRET ลงในไฟล์ทงั้ สอง 4. Save และ Upload ไฟล์ pieled.ino เข้าไปยงั NodeMCU 5. เปิด Console โดยไปที่ Tools  Serial Monitor และใช้ Browser เปิดไฟล์ switch.html 6. กดป่มุ Switch บน Browser เพ่ือทาการเปิดปิดไฟpieled.ino#include <ESP8266WiFi.h>#include <MicroGear.h>const char* ssid = \"YOUR_SSID\";const char* password = \"YOUR_PASSWORD\";#define APPID \"YOUR_APPID\"#define KEY \"YOUR_KEY\"#define SECRET \"YOUR_SECRET\"#define ALIAS \"pieled\"WiFiClient client;int timer = 0;MicroGear microgear(client);void onMsghandler(char *topic, uint8_t* msg, unsigned int msglen) { Serial.print(\"Incoming message -->\"); msg[msglen] = '\0'; Serial.println((char *)msg); if(*(char *)msg == '1'){ digitalWrite(LED_BUILTIN, LOW); // turn on the LED microgear.chat(\"switch\",\"1\"); คูม่ ือการใชง้ าน NETPIE - 53

}else{ digitalWrite(LED_BUILTIN, HIGH); //turn off the LED microgear.chat(\"switch\",\"0\"); }}void onConnected(char *attribute, uint8_t* msg, unsigned int msglen) { Serial.println(\"Connected to NETPIE...\"); microgear.setName(ALIAS);}void setup() { microgear.on(MESSAGE,onMsghandler); microgear.on(CONNECTED,onConnected); Serial.begin(115200); Serial.println(\"Starting...\"); pinMode(LED_BUILTIN, OUTPUT); if (WiFi.begin(ssid, password)) { while (WiFi.status() != WL_CONNECTED) { delay(1000); Serial.print(\".\"); } } Serial.println(\"WiFi connected\"); Serial.println(\"IP address: \"); Serial.println(WiFi.localIP()); microgear.init(KEY,SECRET,ALIAS); microgear.connect(APPID);}void loop() { if (microgear.connected()) { Serial.println(\"...\"); microgear.loop(); คูม่ ือการใชง้ าน NETPIE - 54

timer = 0; } else { Serial.println(\"connection lost, reconnect...\"); if (timer >= 5000) { microgear.connect(APPID); timer = 0; } else timer += 100; } delay(100);}switch.html<script src=\"https://cdn.netpie.io/microgear.js\"></script><script> const APPID = “YOUR_APPID”; const KEY = “YOUR_KEY”; const SECRET = “YOUR_SECRET”; const ALIAS = \"switch\";var microgear = Microgear.create({ key: KEY, secret: SECRET, alias : ALIAS }); function toggle() { if(document.getElementById(\"button\").innerText==\"off\"){ microgear.chat('pieled','1'); } else{ microgear.chat('pieled','0'); } } microgear.on('message',function(topic,msg) { คูม่ ือการใชง้ าน NETPIE - 55

document.getElementById(\"data\").innerHTML = msg; if(msg==\"1\"){ document.getElementById(\"button\").innerText=\"on\"; }else if(msg==\"0\"){ document.getElementById(\"button\").innerText=\"off\"; } }); microgear.on('connected', function() { microgear.setAlias(ALIAS); document.getElementById(\"data\").innerHTML = \"Now I am connected withnetpie...\"; });microgear.connect(APPID);</script><div id=\"data\">_____</div><center><button onclick=\"toggle()\" id=\"button\">off</button></center> คูม่ ือการใชง้ าน NETPIE - 56

5. FREEBOARD Freeboard เป็น Web Application ท่ีสามารถสร้าง Dashboard เพ่ือแสดงผลสาหรับ IoTแอปพลเิ คชน่ั โดยสามารถใช้เป็นกระดานสว่ นตวั สามารถวางป่มุ กดสวิตช์ไว้ใช้สาหรับควบคมุ อปุ กรณ์ หรือวางหน้าปัดเพื่อแสดงผลข้อมลู ตา่ งๆ ท่ีได้จากอปุ กรณ์ เชน่ เซนเซอร์ในระบบ IoT นอกจากนีย้ งั สามารถแสดงผลเป็นกราฟได้ สว่ นหน้ากระดานหรือ Dashboard นนั้ สามารถปรับแตง่ ได้โดยงา่ ย เพียงแคป่ อ้ นข้อมลู เข้าหรือกาหนดคาสง่ั ก็สามารถทางานได้แล้ว โดยท่ีผ้ใู ช้ไมจ่ าเป็นต้องเขียน HTML Web Page เองและท่ีสาคญั คือข้อมลู นนั้ มีการอพั เดทแบบ Real-time มีความเสถียรและเชื่อถือได้ และเป็น Open-Sourceซงึ่ ทาให้นกั พฒั นาสามารถตอ่ ยอดให้ดยี ่ิงขนึ ้ ได้อีกด้วย NETPIE Freeboard คือ Freeboard สาหรับการควบคมุ และการแสดงผล (Visualization) ข้อมลู ที่ดงึ มาจากอปุ กรณ์ที่ตอ่ กบั NETPIE ทีมงานได้พฒั นา Widget Plugins ขนึ ้ มาให้ผ้ใู ช้งานสามารถทาตามความต้องการได้หลากหลาย เชน่ สามารถสร้างป่มุ ควบคมุ และใสค่ าสงั่ Javascript สาหรับ Action ตา่ งๆได้ การใช้งาน NETPIE Freeboard นนั้ สามารถใช้ Browser เปิดไฟล์ index.html ที่ได้จากการตดิ ตงั้NETPIE Freeboard หรือสามารถใช้ Freeboard ผา่ นทางหน้าเว็บของ NETPIE รูปท่ี 5.1 Dashboard ของ NETPIE Freeboard คูม่ ือการใชง้ าน NETPIE - 57

วธิ ีท่ี 1 การใช้ NETPIE Freeboard ท่ตี ดิ ตงั้ ในเคร่ืองแบบ Local 1. ดาวน์โหลดและตดิ ตงั้ NETPIE Freeboard จาก Github (https://github.com/netpieio/netpie-freeboard) กดท่ีป่มุ Clone or download เพ่ือเริ่มทาการดาวน์โหลดไฟล์แบบ Download ZIP 2. แตกไฟล์ใน ZIP Folder แล้วใช้ Browser เปิดไฟล์ท่ีช่ือ index.html จะปรากฏหน้าสาหรับให้ใส่ข้อมลู 3. ปรับแตง่ คา่ ใน NETPIE Freeboard ตามรายละเอียดที่จะอธิบายในลาดบั ถดั ไปวิธีท่ี 2 การใช้ NETPIE Freeboard ผ่านทางหน้าเว็บ NETPIE 1. เข้าสรู่ ะบบ NETPIE Account แล้วไปที่เมนู RESOURCES  FREEBOARDS 2. คลกิ เครื่องหมาย + เพ่ือสร้าง Freeboard ขนึ ้ มาใหม่ 3. ตงั้ ชื่อ Freeboard แล้วกดป่มุ CREATE 4. ปรับแตง่ คา่ ใน NETPIE Freeboard ตามรายละเอียดที่อธิบายในลาดบั ถดั ไปตัวอย่างการปรับแต่งเบือ้ งต้น Main Menu  IMPORT เป็นเมนสู าหรับอพั โหลดไฟล์ Configuration ของหน้า Freeboard ที่บนั ทกึ เก็บไว้  EXPORT เป็นเมนสู าหรับนาไฟล์ Configuration ออก (Export)  RESET เป็นเมนสู าหรับล้าง Datasource และ Widget ท่ีสร้างไว้  ADD PANE เป็นเมนสู าหรับเพิม่ Panel ในการจดั วาง Widget Datasources Menu คูม่ ือการใชง้ าน NETPIE - 58

 ADD เป็นเมนสู าหรับเพ่มิ Datasource ท่ีเป็นแหลง่ ข้อมลู ท่ีจะเชื่อมตอ่ เพ่ือดงึ ออกมาแสดง รูปท่ี 5.2 การเพ่มิ Datasource 1. ด้านลา่ ง DATASOURCES คลิกที่ ADD จะปรากฏ Datasource Type ชนดิ ตา่ งๆ ให้เลือกเป็นNETPIE Microgear รูปท่ี 5.3 การเลือกประเภทของ Datasource 2. ใสข่ ้อมลู สาหรับ Datasource ซง่ึ ประกอบด้วย  NAME คือ ช่ือเรียก Datasource ท่ีใช้อ้างอิง (ไมเ่ กิน 16 ตวั อกั ษร) ในตวั อยา่ งในภาพ ด้านลา่ งคอื YourDatasourceName  APP ID คือ App ID ที่ได้สร้างผา่ นหน้าเว็บ https://netpie.io/app ในตวั อยา่ งในภาพ ด้านลา่ งคือ YourAppID  KEY คอื Key ท่ีได้จากการสร้าง App Key บนเวบ็ NETPIE  SECRET คือ Secret ของ Key บนเว็บ NETPIE คูม่ ือการใชง้ าน NETPIE - 59

 SUBSCRIBED TOPIC คือ Topic ที่ใช้สาหรับการรับสง่ ข้อมลู ท่ีอยภู่ ายใน APPID นนั้ ๆ กรณีนีใ้ ช้เป็น /# มีความหมายวา่ รับข้อความจากทกุ Topic เมื่อกรอกข้อมลู เสร็จกด SAVE รูปท่ี 5.4 การระบุข้อมูลของ Datasource 3. เพม่ิ Panel สาหรับสร้าง Widget ด้วยการคลกิ ที่ ADD PANE จะปรากฏ Panel เพมิ่ ขนึ ้ มาด้านลา่ ง คูม่ ือการใชง้ าน NETPIE - 60

รูปท่ี 5.5 การเพ่มิ Panel สาหรับสร้าง Widget 4. เพม่ิ Widget บน Panel ท่ีสร้างขนึ ้ ใหมโ่ ดย คลิกท่ีเครื่องหมาย + และเลือกชนิดของ Widget เชน่Gauge ตามตวั อยา่ งในรูป รูปท่ี 5.6 การเลือกประเภทของ Widget 5. กรอกข้อความลงไปดงั นี ้แล้วกด Save TITLE ตงั้ ช่ือให้ Widget นี ้ VALUE ให้คลกิ ท่ี + DATASOURCE จะขนึ ้ รายชื่อของ Datasource ท่ีได้สร้างไว้ และสามารถเลือกชื่อท่ีมีอยู่ และพิมพ์เพ่มิ เตมิ ตาม Format เบอื ้ งต้นดงั นี ้datasources[\"YourDatasourceName\"][\"/YourAppID/YourSubscribeTopic\"] UNITS สามารถใสห่ น่วยวดั ท่ีต้องการ หรือเว้นวา่ งไว้ก็ได้ คูม่ ือการใชง้ าน NETPIE - 61

ขนั้ ตอนทงั้ หมดคอื การสร้างโครงของมาตรวดั หรือ Gauge เบอื ้ งต้น ที่ยงั ไมไ่ ด้แสดงผล เน่ืองจากยงัไมม่ ีการระบใุ ห้เช่ือมตอ่ กบั อปุ กรณ์หรือเซนเซอร์เพ่ือรับข้อมลู เข้ามาเป็น Datasource ซงึ่ จะเราจะแสดงรายละเอียดใน Lab 5.1 ตอ่ ไปLab 5.1: การแสดงผลข้อมูลจากอุปกรณ์เซนเซอร์บน NETPIE Freeboard Lab 5.1 เป็นการสร้างแอปพลเิ คชน่ั เซนเซอร์วดั อณุ หภมู ิและความชืน้ ด้วย NodeMCU และเซนเซอร์โมดลู DHT11 (อปุ กรณ์ ZX-DHT11 ใน IoT Kit) ในขนั้ แรกผ้ใู ช้ต้องตดิ ตงั้ Library ท่ีเกี่ยวข้องกบั เซนเซอร์กอ่ น ซง่ึ ในที่นีค้ อื DHT.h ซงึ่ สามารถดาวน์โหลดได้ที่ https://github.com/adafruit/DHT-sensor-libraryให้ผ้ใู ช้งานคดั ลอกไปวางไว้ใน Folder Arduino\libraries ในภาพด้านลา่ งแสดงการเช่ือมตอ่ เซนเซอร์ DHT11 กบั NodeMCU รูปท่ี 5.7 วธิ ีการเช่ือมต่อ DHT-11 เข้ากับ NodeMCU หลงั จากเชื่อมตอ่ เสร็จ ให้ทาตามขนั้ ตอนดงั นี ้ คูม่ ือการใชง้ าน NETPIE - 62

1. ฝ่ัง NodeMCU สามารถเขียนโค้ดสร้างไฟล์ piedht.ino ตามข้างลา่ งและ Upload ไฟล์เข้า NodeMCUpiedht.ino#include <DHT.h>#include <ESP8266WiFi.h>#include <MicroGear.h>const char* ssid = \"SSID\";const char* password = \"PASSWORD\";#define APPID \"YOUR_APPID\"#define KEY \"YOUR_KEY\"#define SECRET \"YOUR_SECRET\"#define ALIAS \"piedht\"WiFiClient client;int timer = 0;char str[32];#define DHTTYPE DHT11 // Define sensor type#define DHTPIN D4 // Define sensor pinDHT dht(DHTPIN, DHTTYPE, 15); //Initialize DHT sensorint humid;int temp;MicroGear microgear(client);void onMsghandler(char *topic, uint8_t* msg, unsigned int msglen) { Serial.print(\"Incoming message -->\"); msg[msglen] = '\0'; Serial.println((char *)msg);}void onConnected(char *attribute, uint8_t* msg, unsigned int msglen) { Serial.println(\"Connected to NETPIE...\"); คูม่ ือการใชง้ าน NETPIE - 63

microgear.setAlias(ALIAS);}void setup(){dht.begin(); microgear.on(MESSAGE,onMsghandler); microgear.on(CONNECTED,onConnected); Serial.begin(115200); Serial.println(\"Starting...\"); if (WiFi.begin(ssid, password)) { while (WiFi.status() != WL_CONNECTED) { delay(500); Serial.print(\".\"); } } Serial.println(\"WiFi connected\"); Serial.println(\"IP address: \"); Serial.println(WiFi.localIP()); microgear.init(KEY,SECRET,ALIAS); microgear.connect(APPID);}void loop(){ if (microgear.connected()) { Serial.println(\"connected\"); microgear.loop(); humid = dht.readHumidity(); temp = dht.readTemperature(); if (timer >= 1000) { sprintf(str,\"%d,%d\",humid,temp); Serial.println(str); Serial.print(\"Sending -->\"); microgear.publish(\"/dht\",str); คูม่ ือการใชง้ าน NETPIE - 64

timer = 0; }else timer += 100; } else { Serial.println(\"connection lost, reconnect...\"); if (timer >= 5000) { microgear.connect(APPID); timer = 0; } else timer += 100; } delay(100);} ในตวั อยา่ งนี ้คาสง่ั microgear.publish(“/dht”,str) คือการ Publish ข้อความ (ในที่นีเ้ป็น MessageString str) ไปยงั Topic ท่ีระบคุ ือ /dht ซงึ่ ข้อความคือคา่ ของอณุ หภมู ิและความชืน้ ที่วดั ได้จากเซนเซอร์DHT 2. เปิด Console โดยไปท่ี Tools ->Serial Monitor เพื่อตรวจสอบวา่ เซนเซอร์ทางานได้ปกตหิ รือไม่ รูปท่ี 5.8 คอนโซลตรวจสอบการทางานของเซนเซอร์ 3. ฝ่ัง NETPIE Freeboard คลกิ ที่ Datasource ท่ีสร้างขนึ ้ กอ่ นหน้านี ้ และแก้ไขในชอ่ ง SUBSCRIBED TOPICS ให้เป็น /dht คูม่ ือการใชง้ าน NETPIE - 65

4. กด + (ADD PANE) เพ่ือสร้าง Widget ชนิด Gauge ใหม่ 2 Widget เพ่ือแยกแสดงอณุ หภมู แิ ละ ความชืน้ โดยกรอกตงั้ คา่ แตล่ ะ Widget ดงั นี ้ Widget 1:  TITLE : Humidity  VALUE : datasources[\"YourDatasourceName\"][\"/YourAppID/dht\"].split(\",\")[0]  UNIT : %  MINIMUM : 0  MAXIMUM : 100 Widget 2:  TITLE : Temperature  VALUE : datasources[\"YourDatasourceName\"][\"/YourAppID/dht\"].split(\",\")[1]  UNIT : C  MINIMUM : 0  MAXIMUM : 50 ภาพด้านลา่ งแสดงตวั อยา่ งการกรอกข้อมลู เพื่อสร้าง Widget แสดงคา่ ความชืน้ (Humidity) คูม่ ือการใชง้ าน NETPIE - 66

รูปท่ี 5.9 ตวั อย่างหน้าจอตงั้ ค่า Widget แสดงค่าความชืน้Widget แสดงผลอณุ หภมู แิ ละความชืน้ ที่สร้างขนึ ้ จะมีลกั ษณะตามแสดงในรูป รูปท่ี 5.10 Widget แสดงค่าอุณหภูมิและความชืน้ ท่วี ัดได้จากเซนเซอร์ คูม่ ือการใชง้ าน NETPIE - 67

คาอธิบายเพ่มิ เตมิ เนื่องจาก DHT สง่ คา่ มาในรูปแบบ \"Humidity,Temperature\" เชน่ \"40,24\" เวลาเรารับคา่ เข้ามา จงึต้องทาการแยกออกเป็น Array โดยใช้เครื่องหมาย Comma “,” เป็นตวั แบง่ จากนนั้ ก็อ้างอิงถงึ ชอ่ งในArray ของ Message String ท่ี Publish ใน Topic /dht เชน่ Index [0] หมายถงึ คา่ แรก และ Index [1]หมายถงึ คา่ ถดั มาLab 5.2: การควบคุมอุปกรณ์ด้วย NETPIE Freeboard Lab 5.2 แสดงการประยกุ ต์ NETPIE Freeboard ในการควบคมุ อปุ กรณ์ โดยในเบือ้ งต้นนี ้ เราจะควบคมุ ไฟ LED บนบอร์ด NodeMCU ซงึ่ ใช้หลกั การทางานบนพืน้ ฐานของการ Subscribe ข้อความจากTopic หรือหวั ข้อที่ระบุ และการกาหนดตรรกะของการควบคมุ ทงั้ ในสว่ นของ Datasource และสว่ นของWidget ที่ใช้ควบคมุ โดยมีขนั้ ตอนดงั ตอ่ ไปนี ้ 1. แก้ไขไฟล์ pieled2.ino โดยระบขุ ้อมลู การเข้าถงึ เครือขา่ ย Wifi ข้อมลู APPID, KEY และSECRET ตามโค้ดข้างลา่ ง และทาการ Upload ไฟล์เข้า NodeMCUให้เชื่อมตอ่ กบั NETPIEpieled2.ino#include <ESP8266WiFi.h>#include <MicroGear.h>const char* ssid = \"SSID\";const char* password = \"PASSWORD\";#define APPID \"YOUR_APPID\"#define KEY \"YOUR_KEY\"#define SECRET \"YOUR_SECRET\"#define ALIAS \"pieled\"WiFiClient client;char state = 0;char stateOutdated = 0; คูม่ ือการใชง้ าน NETPIE - 68

char buff[16];MicroGear microgear(client);void sendState(){ if (state==0) microgear.publish(\"/pieled/state\",\"0\"); else microgear.publish(\"/pieled/state\",\"1\"); Serial.println(\"send state..\"); stateOutdated = 0;}void updateIO(){ if (state >= 1) { digitalWrite(LED_BUILTIN, LOW); } else { state = 0; digitalWrite(LED_BUILTIN, HIGH); }}void onMsghandler(char *topic, uint8_t* msg, unsigned int msglen) { char m = *(char *)msg; Serial.print(\"Incoming message -->\"); msg[msglen] = '\0'; Serial.println((char *)msg); if (m == '0' || m == '1') { state = m=='0'?0:1;updateIO(); } if (m == '0' || m == '1' || m == '?') stateOutdated = 1;}void onConnected(char *attribute, uint8_t* msg, unsigned int msglen) { Serial.println(\"Connected to NETPIE...\"); Microgear.setAlias(ALIAS); คูม่ ือการใชง้ าน NETPIE - 69

stateOutdated = 1;}void setup(){ Serial.begin(115200); Serial.println(\"Starting...\"); pinMode(LED_BUILTIN, OUTPUT); if (WiFi.begin(ssid, password)) { while (WiFi.status() != WL_CONNECTED) { delay(500); Serial.print(\".\"); } } microgear.on(MESSAGE,onMsghandler); microgear.on(CONNECTED,onConnected); microgear.init(KEY,SECRET,ALIAS); microgear.connect(APPID);}void loop(){ if (microgear.connected()) { if (stateOutdated) sendState(); microgear.loop(); } else { Serial.println(\"connection lost, reconnect...\"); microgear.connect(APPID); }} 2. ในหน้า NETPIE Freeboard คลกิ เพม่ิ Datasource ที่สร้างขนึ ้ ก่อนหน้านีเ้พ่ือแก้ไข ตงั้ ชื่อDatasource ใสค่ า่ KEY และ SECRET และในชอ่ ง SUBSCRIBED TOPICS ให้ใส่ /pieled/state หรือTopic ท่ีทา่ นระบไุ ว้สาหรับการ publish ในไฟล์ pieled2.ino ดงั แสดงในภาพด้านลา่ ง และกด Save คูม่ ือการใชง้ าน NETPIE - 70

รูปท่ี 5.11 หน้าต่างตงั้ ค่า Datasource ใน NETPIE Freeboard สาหรับควบคุม LED 3. สร้าง Widget ขนึ ้ มาใหมโ่ ดยกด + (ADD PANE) และเลือกชนดิ ใน Drop Down Box เป็นแบบToggle รูปท่ี 5.12 หน้าจอเลือกชนิด Widget ให้เป็ นแบบ Toggle จากนนั้ ตงั้ คา่ Widget ดงั นีโ้ ดยหน้าจอการตงั้ คา่ แสดงดงั รูป  TOGGLE CAPTION : ตงั้ ชื่อป่มุ Toggle (ในตวั อยา่ งตงั้ เป็น PIE_LED) คูม่ ือการใชง้ าน NETPIE - 71

 TOGGLE STATE : ใสข่ ้อมลู ตามช่ือของ Datasource และ Topic เชน่ datasources[\"YourDatasourceName\"][\"/YourAppID/pieled/state\"]==1  ON TEXT : ON  OFF TEXT : OFF  ONTOGGLEON ACTION : microgear['YourDatasourceName'].chat('pieled','1')  ONTOGGLEOFF ACTION : microgear['YourDatasourceName'].chat('pieled','0') รูปท่ี 5.13 หน้าจอการตงั้ ค่า Widget ชนิด Toggleแล้วกด Save จะได้ Widget ที่มีป่มุ ควบคมุ ดงั แสดงในภาพ เพื่อทดสอบเปิดปิด LED บน NodeMCU รูปท่ี 5.14 Widget ใช้เปิ ดปิ ด LED บน NodeMCU คูม่ ือการใชง้ าน NETPIE - 72

คาอธิบายเพ่มิ เตมิ TOGGLE STATE เป็นสถานะ On/Off ซง่ึ สามารถผกู กบั ตรรกะของ Datasource ในท่ีน่ีเราตงั้ คา่ ให้Toggle เปล่ียนสถานะตามคา่ ท่ีสง่ มาใน Topic ชื่อ /pieled/state ONTOGGLEON และ ONTOGGLEOFF เป็นคาสงั่ ท่ีจะถกู เรียก เม่ือ Toggle เปล่ียนสถานะไปเป็นON และ OFF ตามลาดบั ในหน้า Datasources ตรงชอ่ ง SUBSCRIBED TOPICS นนั้ นอกจากจะสามารถระบคุ า่ แบบเจาะจงเป็น topic /pieled/state แล้ว ยงั สามารถระบคุ า่ เป็น /pieled/+ ก็ได้ โดยใช้เคร่ืองหมาย (+) ซง่ึ เป็นSingle-Level Wildcard เพื่อรับคา่ ของ State เราสามารถใช้ Wildcard เพื่อช่วยในการ Subscribe Topic ต่างๆ เช่น หากต้องการSubscribe Topic ตามทร่ี ะบุแบบเจาะจงดังน้ี: \"/home/kitchen/temp\", \"/home/bedroom/temp\", และ\"/home/livingroom/temp\" กส็ ามารถยุบเหลือ 1 Topic คือ \"/home/+/temp\" นอกจาก + แล้วยงั ใช้เคร่ืองหมาย # ได้ด้วย โดยท่ีเครื่องหมาย + จะแทนคาอะไรก็ได้ระดบั ชั้นเดียว ส่วน # จะแทนคาอะไรกไ็ ด้ในระดับชั้นยาวต่อไปเท่าไหร่กไ็ ด้ เช่นจะให้ match 3Topic ข้างต้น กอ็ าจจะเขียนระบุเป็ น Topic คือ \"/home/#\" คูม่ ือการใชง้ าน NETPIE - 73

6.NETPIE FEED ข้อมลู ที่เกิดจากการอ่านคา่ ของอปุ กรณ์เซนเซอร์ในบทท่ีแล้ว สามารถนามาใช้ให้เกิดประโยชน์ได้อยา่ งหลากหลาย เชน่ ใช้สาหรับการตรวจสอบ (Monitoring) หรือการแสดงผลของข้อมลู (DataVisualization) โดยเฉพาะอยา่ งย่ิงข้อมลู แบบทนั เวลา (Real-time Data) ซง่ึ จะต้องเก็บรวบรวมด้วยอตั ราความถี่ที่เหมาะสมเพื่อให้การตรวจสอบหรือการแสดงผลตรงตามความต้องการ ในปัจจบุ นั แพลตฟอร์มNETPIE มีบริการที่สามารถเก็บข้อมลู และแสดงผลที่เรียกวา่ Feed ซงึ่ ทาหน้าที่เสมือนถงั เก็บข้อมลูประเภท Time-Series กลา่ วคอื เป็นชดุ ข้อมลู หรือคา่ ตวั แปร ณ เวลาตา่ งๆ เชน่ อณุ หภมู อิ ากาศในชว่ งเวลาตา่ งๆ ของวนั เป็นต้น ข้อมลู เหลา่ นีจ้ ะถกู เก็บแบบตอ่ เนื่องสะสมกนั ไปตลอด และสามารถเรียกออกมาดใู นชว่ งเวลาใดก็ได้ ในบทนีจ้ ะอธิบายรายละเอียดการใช้งาน NETPIE Feed ตงั้ แตก่ ารตงั้ คา่ การเก็บข้อมลู จากDatasource ไปจนถึงการแสดงผล 6.1 การสร้าง FEED 1. เลือก FEEDS จากเมนู RESOURCES รูปท่ี 6.1 การเข้าใช้งาน Feed จากเมนู Resources 2. สร้าง Feed ใหม่ หรือเพิ่ม Feed ด้วยการคลิกที่เคร่ืองหมาย + ที่มมุ บนของ Feed รูปท่ี 6.2 การสร้างหรือเพ่มิ Feed ใหม่ คูม่ ือการใชง้ าน NETPIE - 74

3. ตงั้ ชื่อ Feed โดยท่ีช่ือนีจ้ ะต้องไมซ่ า้ กบั ท่ีเคยมีมาก่อน และห้ามซา้ กบั ของผ้ใู ช้อ่ืน เมื่อตงั้ ชื่อแล้วให้ คลกิ CREATE เพื่อสร้าง Feed รูปท่ี 6.3 การตัง้ ช่ือ Feed4. เม่ือสร้าง Feed สาเร็จ จะเข้าสหู่ น้าตงั้ คา่ Feed ตามภาพข้างลา่ ง ในตวั อยา่ งนี ้ ได้สร้างสร้าง Feed ที่มีชื่อวา่ “mysensor” ซง่ึ จะไปปรากฏในหน้ารวม Feed เมื่อเราเข้ามาในครัง้ ตอ่ ไปเรา สามารถกลบั มาท่ีหน้าตงั้ คา่ นีไ้ ด้อีกจากหน้ารวมของ Feed โดยคลิกที่เคร่ืองหมายรูปประแจด้าน ขวามือหลงั ชื่อ Feed ที่ต้องการ รูปท่ี 6.4 หน้าตงั้ ค่า Feed5. เน่ืองจาก Feed ท่ีสร้างขนึ ้ ใหมน่ ีย้ งั ไมส่ ามารถรับคา่ ใดๆ เข้ามาได้ จงึ ต้องสร้าง Field ขนึ ้ มารับ ข้อมลู ให้กดป่มุ + ADD จะปรากฏหน้าตา่ งให้ตงั้ คา่ ตา่ งๆ ในตวั อยา่ งนี ้ เป็นการสร้าง Field จานวน 2 Field ที่มีช่ือวา่ temp และ humid (หรือจะตงั้ เป็นชื่ออะไรก็ได้) หากมีหนว่ ยก็ระบไุ ว้เพื่อ การแสดงผลตอ่ ไป โดย ณ ขณะนีย้ งั รองรับเฉพาะข้อมลู ชนิดตวั เลข (Number) เทา่ นนั้ โดยใน อนาคตมีอาจมีการพฒั นาเพม่ิ เตมิ ให้รองรับข้อมลู ชนิดอ่ืนๆ คูม่ ือการใชง้ าน NETPIE - 75

รูปท่ี 6.5 การสร้าง Field เพ่อื รับข้อมูล Feed 6. คลิก SAVE จะได้ Feed ที่พร้อมรับคา่ รายละเอียดการปรับแตง่ อยใู่ นลาดบั ถดั ไป รูปท่ี 6.6 ตวั อย่าง Feed ท่ีสร้างขนึ้ ด้วย 2 Field 6.2 การกาหนดสทิ ธ์ิในการเข้าถงึ FEED เนื่องจาก Feed แตล่ ะอนั ท่ีสร้างขนึ ้ มานนั้ เป็น Resource อสิ ระท่ีไมข่ นึ ้ กบั AppID ดงั นนั้ ในการนาไปใช้งานจาเป็นต้องมีเร่ืองของการกาหนดสิทธิ์ การให้สทิ ธ์ิกบั อปุ กรณ์ท่ีจะเข้ามาอ่านหรือเขียน Feed มีด้วยกนั 2 วธิ ี ได้แก่ 1. การใช้ API Key ท่ปี รากฎอยู่ในแทบ็ Permission วิธีนีจ้ ะอนญุ าตให้ Client ท่ีมี API key สามารถอา่ นเขียน Feed นีไ้ ด้ วธิ ีการนา API key ไปใช้จะกลา่ วถงึ ในตอ่ ไป คูม่ ือการใชง้ าน NETPIE - 76

2. การให้สทิ ธ์ิกับ AppID ใช้ได้กบั เฉพาะ AppID ของเจ้าของ Feed เทา่ นนั้ วธิ ีนีม้ ีไว้เพ่ืออานวย ความสะดวกในขนั้ ตอนการพฒั นาเน่ืองจากเป็นการให้สิทธ์ิกนั ผา่ นเว็บ จงึ ไมต่ ้องเข้าไปแก้โค้ด โปรแกรมการให้สทิ ธ์ิกบั AppID จะทาให้ทกุ อปุ กรณ์ใน AppID นนั้ มีสิทธิ์อา่ นหรือเขียน Feed นี ้ เหมือนกนั หมด การตงั้ คา่ ทาได้โดยคลิกที่แท็บ Permission และคลิกท่ี EDIT ตามภาพ รูปท่ี 6.7 การตัง้ ค่าสทิ ธ์ิในการเข้าถงึ จากนนั้ พมิ พ์ AppID ที่ต้องการให้สิทธ์ิ หรือเลือกจากเมนู Drop-Down และคลิก SAVE ในตวั อย่างข้างลา่ ง เป็นการให้สิทธิ์กบั AppID ที่ช่ือ “iotdemo” ดงั นนั้ ทกุ อปุ กรณ์ภายใต้ AppID นี ้ จะสามารถอา่ นเขียน Feed ได้โดยอตั โนมตั ิ การอนญุ าตแบบนีจ้ ะเป็นการแจกสทิ ธ์ิในรูปแบบเดียวกบั การนา Default APIkey ของ Feed ไปใช้ เราสามารถให้สิทธิ์กับ AppID ทเี่ ราเป็ นเจ้าของเท่าน้ัน คูม่ ือการใชง้ าน NETPIE - 77

รูปท่ี 6.8 การให้สทิ ธ์ิการเข้าถงึ Feed กับ AppID 6.3 การเขียนข้อมูลลงใน FEED การเขียนข้อมลู เพื่อเก็บใน Feed มี 2 วธิ ี ดงั นี ้วธิ ีท่ี 1 ใช้ REST API (ข้อมลู และการใช้งานโดยละเอียดของ REST API อยใู่ นบทท่ี 7) REST API สามารถเรียกผา่ น Command Line ได้โดยใช้โปรแกรม curl ซง่ึ เป็น HTTP Client แบบCommand Line ท่ีนกั พฒั นานยิ มใช้กนั มาก ในระบบปฏิบตั กิ าร Mac OSX และ Linux โปรแกรมนีจ้ ะถกูตดิ ตงั้ มาแบบพร้อมใช้งานอยแู่ ล้ว เพียงแคเ่ ปิด Terminal ก็สามารถพมิ พ์คาสง่ั ได้เลย แตส่ าหรับ Windowsอาจต้องตดิ ตงั้ โปรแกรมเพ่ิม โดยสามารถดาวน์โหลดได้จาก https://curl.haxx.se/download.html การเขียน Feed ผา่ น REST API จะต้องกระทาโดยใช้ API Key ควบคกู่ นั ไปด้วยเสมอ และมีรูปแบบคาสง่ั ที่เรียกผา่ น curl บน Terminal ดงั นี ้(เครื่องหมาย$ ไมต่ ้องพิมพ์ลงไป ใสไ่ ว้เพ่ือสื่อวา่ เป็น CommandLine)$ curl -X PUT\"https://api.netpie.io/feed/<FEEDID>?apikey=<APIKEY>&data=<DATA>\" ตวั อยา่ งการสง่ คา่ temp = 25.2 และ humid = 62.5 ไปเขียนท่ี Feed ช่ือ mysensor จะใช้คาสง่ัดงั นี ้$ curl -X PUT\"https://api.netpie.io/feed/mysensor?apikey=5DunZ38nKP5dGC0h4Bj7mXyeMURdoXOo&data=temp:25.2,humid:62.5\" เมื่อพิมพ์เสร็จให้กด Enter หากไมม่ ีข้อผดิ พลาด จะมีข้อความขนึ ้ มาดงั นี ้{“code”:200,”message”:”Update OK”} คูม่ ือการใชง้ าน NETPIE - 78

เมื่อกลบั ไปดทู ่ีหน้า Feed เราจะเห็นจดุ ข้อมลู ปรากฏขนึ ้ มาแบบนีข้ ้อที่ควรระวงั คอื ช่ือ Field ข้อมลูในคาสง่ั (temp และ humid) จะต้องตรงกบั ชื่อ Field ที่ได้สร้างรอเอาไว้บน Feed เพื่อให้ข้อมลู ถกู จดั เก็บสาเร็จ รูปท่ี 6.9 การสร้างข้อมูลไปเก็บใน Feed ด้วย command curlวธิ ีท่ี 2 ใช้ Microgear Function สาหรับอปุ กรณ์ที่ตอ่ NETPIE ผา่ น Microgear Library อยแู่ ล้ว สามารถสง่ คา่ เข้าไปใน Feed ผา่ นReal-time Message ได้เลยโดยใช้ฟังก์ชนั่ microgear.writeFeed() ซง่ึ จะมีใน Library ปัจจบุ นั ทกุ ภาษาของ NETPIE อยแู่ ล้ว (หากไมม่ ีโปรดอพั เดทให้เป็นเวอร์ชนั่ ลา่ สดุ ) การเขียน Feed ด้วย Microgear นี ้ ในกรณีท่ีเราได้ให้สทิ ธิ์กบั AppID ไว้แล้ว ก็ไมจ่ าเป็นต้องใส่ API Key ลงไปรูปแบบการใช้ฟังก์ชน่ั มีดงั นี ้microgear.writeFeed(\"<FEEDID>\",\"<DATA>\") โดยที่ DATA เป็น String ที่มีลกั ษณะเดียวกบั REST API ดงั ตวั อยา่ งนี ้microgear.writeFeed(\"mysensor\",\"temp:25.2,humid:62.5\") สว่ นของ DATA นอกจากรองรับ String รูปแบบดงั กลา่ วแล้ว เรายงั สามารถสง่ String ที่แปลงมาจาก json ได้ด้วย เชน่ “{\”temp\”:25.2,\”humid\”:62.5}” หรือหากเป็น Node.js หรือ Javascript เรายงัสามารถสง่ ตวั แปรท่ีมี Type เป็น Object ได้เลยโดยไมต่ ้องแปลงเป็น String ก่อน คูม่ ือการใชง้ าน NETPIE - 79

ในกรณีที่เรายงั ไมไ่ ด้ให้สทิ ธ์ิกบั AppID ฟังก์ชน่ั ข้างต้นจะได้รับข้อความ Error วา่ ไมม่ ีสิทธิ์เขียนFeed จงึ ต้องใส่ API Key ลงไปในฟังก์ชนั่ ด้วยซงึ่ จะเหมาะกบั กรณีที่ต้องการให้มีเฉพาะอปุ กรณ์เพียงบางตวั เทา่ นนั้ ท่ีสามารถเขียน Feed ได้ รูปแบบการเรียกจะเป็นตามนี ้microgear.writeFeed(\"<FEEDID>\",\"<DATA>\",\"<APIKEY>\") ซง่ึ ตวั อย่างการใช้จริงจะอยใู่ นรูปแบบดงั นี ้microgear.writeFeed(\"mysensor\",\"temp:25.2,humid:62.5\",\"5DunZ38nKP5dGC0h4Bj7mXyeMURdoXOo\") และทกุ ครัง้ ท่ีเราสง่ คา่ เข้าไปที่ Feed ไมว่ า่ สาเร็จหรือไม่ จะมี Message ตอบกลบั มาทาง Event Infoหรือ Error เสมอ เราสามารถเช็คสถานะการเขียน Feed ได้จากการรับ Event info และ Error ซง่ึ ลกั ษณะการเรียกใช้จะแตกตา่ งกนั เล็กน้อยตามรูปแบบภาษาของ Library ที่ใช้งาน รายละเอียดเพิ่มเตมิ สามารถศกึ ษาได้ในสว่ นอธิบาย Events ของเอกสาร readme ใน Microgear Library แตล่ ะภาษา 6.4 การดงึ ข้อมูลจาก FEED มาใช้งานNETPIE มีวิธีใช้งานข้อมลู จาก Feed อยู่ 3 แบบดงั นี ้วธิ ีท่ี 1 การแสดงผลผ่านหน้าการจัดการของ Feed เราสามารถใช้หน้า Feed ของ NETPIE.io ในการดคู า่ ย้อนหลงั ได้ในลกั ษณะเส้นกราฟและ สามารถตงั้ คา่ การแสดงผลได้จากแท็บ Data Display ดงั นี ้  GRANULARITY คือความละเอียดของจดุ ข้อมลู ตวั อยา่ งนีต้ งั้ ไว้ที่ 12 นาที หมายความวา่ จดุ ข้อมลู ตา่ งๆ ท่ีเก็บมาในชว่ งเวลาหน้าตา่ งละ 12 นาทีจะถกู นามาเฉล่ียเป็นจดุ เดยี ว  SINCE เป็นเวลาตงั้ ต้นย้อนหลงั ท่ีจะเรียกดขู ้อมลู  BEGIN AT 0 ตงั้ เป็น TRUE จะเป็นการตงั้ คา่ แกน Y เริ่มต้นที่ 0  MARKER แสดงวงกลมท่ีจดุ  AUTO GAP แทรกช่องวา่ งอตั โนมตั ิ (ในกรณีไมม่ ีข้อมลู ในชว่ งเวลาท่ีตงั้ ไว้) คูม่ ือการใชง้ าน NETPIE - 80

รูปท่ี 6.10 หน้าจอแสดงผลเส้นกราฟของ Feedวธิ ีท่ี 2 การแสดงผลผ่านหน้า Freeboard นอกจากดคู า่ ผา่ นหน้าการจดั การ Feed แล้วเรายงั สามารถดงึ คา่ ของ Feed ไปแสดงผลบน NETPIEFreeboard ร่วมกบั Widget ตา่ งๆ ได้อีกด้วย วธิ ีการใช้งาน Freeboard สามารถดรู ายละเอียดได้จากบทท่ีแล้ว โดยในบทนี ้เพื่อให้ Freeboard แสดง Feed ให้เลือกชนิด Datasource ของ Freeboard เป็น NETPIEFeed รูปท่ี 6.11 การเลือกชนิดของDatasource เพ่อื ใช้งาน Feed คูม่ ือการใชง้ าน NETPIE - 81

เม่ือเสร็จแล้วจะเข้าสหู่ น้าตงั้ คา่ Datasource ให้กรอกข้อมลู ดงั นี ้  NAME ตงั้ ชื่อเป็นอะไรก็ได้ ในตวั อยา่ งนี ้ตงั้ ช่ือว่า “sensor feed”  FEED ID ใส่ Feed ID ให้ตรงกบั ชื่อ Feed ที่สร้างไว้ตามตวั อยา่ งในบทที่ 5 คือ “mysensor”  AKI KEY ใส่ Default API key ที่ได้จากหน้าตอนที่สร้าง Feed สว่ นตวั เลือกที่เหลือสามารถตงั้ ได้ตามความเหมาะสม เมื่อเสร็จแล้วกดป่มุ SAVE รูปท่ี 6.12 การตงั้ ค่า Feed ใน Datasource เมื่อตงั้ คา่ Datasource บน Freeboard สาเร็จ Datasource จะเริ่มทางาน ขนั้ ตอ่ ไปคือการสร้างWidget ท่ีดงึ ข้อมลู จาก Datasource ของ Feed มาแสดงผล ซงึ่ NETPIE มี Widget ช่ือวา่ Feed View ไว้สาหรับใช้งานคกู่ บั Feed Datasource การเพ่มิ Widget ใหมใ่ ห้เลือกเพิม่ หน้าตา่ งก่อนด้วยการกดป่มุADD PANE และให้กดป่มุ + ท่ีหน้าตา่ งเพื่อเพม่ิ Widget และเลือกชนิด Feed View ดงั แสดงในภาพ คูม่ ือการใชง้ าน NETPIE - 82

รูปท่ี 6.13 การสร้าง Widget เพ่อื ดคู ่าของ Feed รูปท่ี 6.14 การเลือกชนิดของ Widget เป็ น FeedView ในการตงั้ คา่ FeedView ตามภาพด้านลา่ ง ช่องที่สาคญั ที่สดุ คือชอ่ ง DATASOURCE เราจะต้องเลือก Datasource ที่มีชนิดเป็น NETPIE Feed โดยอ้างถงึ Field ที่มีช่ือวา่ data ของ Datasource นนั้สรุปคือให้ใสค่ า่ ในลกั ษณะนี ้datasources[“<Feed Datasource Name>“][“data”] คูม่ ือการใชง้ าน NETPIE - 83

โดยที่ Feed Datasource Name ให้แทนท่ีด้วยช่ือของ Datasource ของ Feed ท่ีเราตงั้ ไว้ก่อนหน้านี ้ (ในตวั อยา่ งใช้ช่ือ “sensor feed”) หากไมส่ ะดวกจะพิมพ์ เราสามารถคลกิ ตรงป่มุ+DATASOURCE ข้างหลงั ชอ่ งจะมีตวั ชว่ ยเลือกในการกรอกคา่ ดงั นนั้ ในตวั อยา่ งนีต้ ้องใสว่ า่datasources[“sensor feed“][“data”] รูปท่ี 6.15 การตงั้ ค่า Widget สาหรับ Feed ตวั เลือกที่อ่ืนๆ สามารถปรับเปลี่ยนได้ตามความเหมาะสม  TITLE ข้อความที่จะขนึ ้ บนกราฟ  DATA SOURCE แหลง่ ข้อมลู ที่จะดงึ มาแสดงผล  FILTER เป็นตวั กรอง สมมตวิ า่ ข้อมลู จาก data source มี 3 เส้น ได้แก่ temp, humid และ light หากเราอยากให้กราฟแสดงเฉพาะ temp และ humid ก็ใสเ่ ฉพาะคาว่า temp,humid ลงในชอ่ ง filter  TYPE OF CHART มีสองตวั เลือก ได้แก่ LINE กบั STEP  X AXIS TITLE ข้อความกากบั บนแกน X คูม่ ือการใชง้ าน NETPIE - 84

 Y AXIS TITLE ข้อความกากบั บนแกน Y  BEGIN AT 0 ตงั้ ให้คา่ Y เริ่มต้นท่ี 0 หรือไม่  LINE COLORS หากต้องการ สามารถเลือกสีเส้นกราฟได้ เคยใสเ่ ป็นคา่ สี HTML ตวั อยา่ งเชน่ #ff0000,#00ff00,#0000ff หมายถึง กาหนดให้เส้นแรกเป็นสีแดง เส้นท่ีสองเป็นสีเขียวและเส้นท่ี สามเป็นสีนา้ เงิน กราฟมากกวา่ สามเส้นนี ้จะวนกลบั ไปเริ่มใช้สีแดงใหมใ่ นเส้นถดั ไป  MARKER แสดงวงกลมท่ีตาแหนง่ จดุ ข้อมลู  MULTIPLE AXIS แสดงแกน Y แยกสาหรับแตล่ ะคา่ ควั แปร ซงึ่ อาจจาเป็นต้องใช้ ในกรณีที่คา่ ข้อมลู แตล่ ะชดุ มีสเกลท่ีแตกตา่ งกนั มาก ถ้าจบั มาพล็อตบนแกนเดียวกนั จะแสดงรายละเอียดได้ ไมด่ นี กั  AUTO GAP ตงั้ ให้ตรวจสอบและแทรกชอ่ งวา่ งอตั โนมตั ิ หากข้อมลู หายไปนานผิดปกติ เส้นกราฟ จะปรากฎการขาดช่วงให้เห็น คลกิ Save ก็จะได้ Widget สาหรับแสดงผลกราฟท่ีดงึ ข้อมลู จาก Feed เราสามารถขยายขนาดความกว้างของ Widget ได้ โดยการคลิกไอคอนเคร่ืองมือดงั แสดงในรูปภาพ รูปท่ี 6.16 การปรับแต่งกราฟของ Feed คูม่ ือการใชง้ าน NETPIE - 85

รูปท่ี 6.17 การปรับแต่งขยายความกว้างของกราฟของ Feedวิธีท่ี 3 การแสดงผลผ่านหน้า REST API สาหรับนกั พฒั นาที่ต้องการนาคา่ จาก Feed ไปใช้แบบอื่นๆ เชน่ แสดงผลใน Visualization Toolของตนเอง หรือนาไปคานวณตอ่ ก็ยงั สามารถดงึ คา่ ของ Feed จาก API ผา่ น Method GET ได้ ในรูปแบบดงั นี ้https://api.netpie.io/feed/<FEEDID>?apikey=<APIKEY>&granularity=<GRANULARITY>&since=<SINCE>&filter=<FILTER>  FEEDID คอื Feed ID  APIKEY คอื API Key  GRANULARITY คือ ระดบั ความละเอียดของจดุ ข้อมลู หนว่ ยท่ีสามารถเป็นได้ ได้แก่ second, minute, hour, day, month, year และใสต่ วั เลขระบปุ ริมาณนาหน้าได้สว่ นหนว่ ยเวลาจะเตมิ s หรือไมก่ ็ได้ ไมม่ ีความแตกตา่ ง เชน่ 15seconds หรือ 15second, 10minutes, 3hour ฯลฯ การตงั้ Granularity เป็น 5 minutes จะทาให้ทกุ จดุ ข้อมลู ท่ีเก็บได้ในชว่ ง 5 นาที จะถกู นามาเฉล่ียเป็นจดุ จดุ เดียวที่ใช้เป็นตวั แทนของชว่ งดงั กลา่ ว  SINCE คือ ระยะเวลาย้อนหลงั ที่จะดงึ ข้อมลู ออกมา รูปแบบการเขียนเหมือนกบั Granularity ทกุ อยา่ ง คูม่ ือการใชง้ าน NETPIE - 86

 FILTER คือ ตวั กรอง จะใส่หรือไมใ่ สก่ ็ได้ ถ้าไมใ่ สแ่ ปลวา่ ไมม่ ีตวั กรอง คือดงึ มาทกุ คา่ ถ้าใสใ่ ห้ใส่ เป็นช่ือ Field ของข้อมลู ท่ีจะดงึ ออกมาแสดง หากมีหลาย Field ให้คนั่ ด้วยเคร่ืองหมายคอมมา่ (,) เชน่https://api.netpie.io/feed/mysensor?apikey=5DunZ38nKP5dGC0h4Bj7mXyeMURdoXOo&granularity=10minutes&since=24hours&filter=temp,humid ผลลพั ธ์ที่ได้จะเป็น JSON ลกั ษณะตามด้านล่างนี ้ สว่ นของ Timestamp จะเป็น Unix Timestampแบบ Millisecond ของโซนเวลา GMT ดงั นนั้ หากจะนามาใช้ ต้องบวกเพ่มิ 7 ชวั่ โมงให้เป็นเวลาประเทศไทยด้วย{ \"feedid\": \"mysensor\", \"description\": \"\", \"from\": null, \"to\": null, \"since\": [ 24, \"hours\" ], \"granularity\": [ 1, \"minutes\" ], \"data\": [ { \"attr\": \"humid\", \"unit\": \"%\", \"values\": [ [ 1484031488709, 62.5 ], [ 1484031500861, 62.6 ] ] }, { \"attr\": \"temp\", คูม่ ือการใชง้ าน NETPIE - 87

\"unit\": \"C\", \"values\": [ [ 1484031488709, 25.2 ], [ 1484031500861, 25.1 ] ] } ], \"lastest_data\": [ { \"attr\": \"humid\", \"values\": [ [ 1484031500861, 62.6 ] ] }, { \"attr\": \"temp\", \"values\": [ [ 1484031500861, 25.1 ] ] } ]} คูม่ ือการใชง้ าน NETPIE - 88

6.5 ข้อจากดั การใช้งาน บริการ NETPIE Feed เปิดให้ใช้ฟรีสาหรับผ้ใู ช้ทวั่ ไป ดงั้ นนั้ เพื่อแบง่ ปันทรัพยากรกนั อยา่ งเหมาะสมจะจากดั อตั ราการเขียน Feed ตอ่ API Key ไว้ที่ 4 ครัง้ ในเวลาประมาณ 60 วินาที หรือเฉลี่ยให้เขียนได้ 15วนิ าที ตอ่ 1 จดุ และในเบอื ้ งต้นจะให้ระยะเวลาเก็บข้อมลู หนง่ึ ปี การเขียนข้อมลู ลงใน Feed อาจจะเขียนผา่ นทาง Microgear หรือ Client หลายตวั เพียงแต่ Quota ของการเขียนก็จะแบง่ กนั ไประหวา่ ง Client ที่ใช้API key เดยี วกนั ในสว่ นของการอา่ นคา่ นนั้ จะจากดั การเรียก API ไว้ท่ี 5 ครัง้ ใน 5 วินาที การเรียก APIแตล่ ะครัง้ ถ้าอา่ นหรือเขียนสาเร็จจะมีสถานะตอบกลบั ตามตวั อยา่ งนี ้  {“code”:200,”message”:”Update OK”} หมายความวา่ ทางานสาเร็จ  {“code”:401,”message”:”Unauthorized”} หมายความวา่ API Key ที่ใช้ไมม่ ีสทิ ธ์ิเข้าถึง Feed ดงั กลา่ ว  {“code”:429,”message”:”Rate limit exceeded, wait 2.286758 seconds”} หมายความวา่ มี การเรียกใช้งานเกินอตั ราที่กาหนด นอกจากสถานะตอบกลบั แล้ว ในกรณีของการเรียกผา่ น REST API สว่ นของ Reply ก็จะมี HTTPHeader แนบกลบั มาด้วยเพ่ือบอกสถานะเก่ียวกบั Rate Limit และ Quota ที่ยงั เหลืออยู่ ซง่ึ อาจเป็นประโยชน์ตอ่ นกั พฒั นา ตวั อยา่ งเชน่ หากเรียก API สาหรับอา่ นข้อมลู จาก Feed จานวน 5 ครัง้ ตดิ กนั ครัง้สดุ ท้ายจะเห็น Header ดงั นี ้X-RateLimit-Interval: 5X-RateLimit-Quota: 5X-RateLimit-Minimum-Wait: 0X-RateLimit-ToWait: 1.570335 เป็นการบอกวา่ ต้องรออีกประมาณ 1.57 วินาที จงึ จะสามารถ เรียก API เดมิ ซา้ อีกครัง้ ได้ ซงึ่ หากผ้ใู ช้ไมร่ อและเรียก API ตอ่ ทนั ที คา่ ที่ Reply ครัง้ ถดั ไปจะมีสถานะเป็น 429 Rate limit exceededLab 6.1: การแสดงผลข้อมูลเซนเซอร์ด้วย NETPIE Feed Lab นีเ้ป็นการทบทวนการประยกุ ตใ์ ช้ NETPIE Feed ในการดขู ้อมลู อณุ หภมู แิ ละความชืน้ ท่ีได้รับจากเซนเซอร์โมดลู DHT11 ผ้อู บรมสามารถฝึกการนาข้อมลู ท่ีเก็บจาก Feed มาใช้แสดงผลในรูปแบบตา่ งๆพร้อมทงั้ เข้าใจขีดจากดั การใช้งานของระบบและบริการ คูม่ ือการใชง้ าน NETPIE - 89

1. สร้างไฟล์ feed_dht.ino ตามโค้ดด้านลา่ ง โดยระบขุ ้อมลู การเข้าถงึ เครือขา่ ย Wifi ข้อมลู APPID, KEY และ SECRET และทาการ Upload ไฟล์เข้า NodeMCU ให้เช่ือมตอ่ กบั NETPIE 2. สร้าง Feed เพ่ือรองรับคา่ ของข้อมลู อณุ หภมู แิ ละความชืน้ ที่เซนเซอร์สง่ มา ปรับแตง่ การ แสดงผลตามความเหมาะสม (ใน Data Display) 3. เพมิ่ Datasource สาหรับ Feed ในหน้า Freeboard 4. เพม่ิ Widget เพื่อแสดงผล Feed ในหน้า Freeboard 5. ทดลองเปลี่ยนอตั ราการสง่ ข้อมลู ของ Feed จาก NodeMCU ให้เร็วกว่าคา่ ของ INTERVAL ท่ี ระบุ (หรือเร็วกวา่ อตั ราเฉล่ียท่ีเขียนได้คือ 15 วนิ าที ตอ่ 1 จดุ ) สงั เกตการเปล่ียนแปลงในการ แสดงผลของข้อมลู วา่ เป็นอยา่ งไร มีผลตอ่ Rate Limit หรือไม่ ในการดรู ะยะหา่ งระหวา่ งจดุ ของ ข้อมลู ในระดบั วินาที ควรปรับแตง่ ชว่ งเวลาในการแสดงผลให้สนั้ ลง เชน่ อยใู่ นระดบั 1 นาที เป็น ต้นfeed_dht.ino#include <DHT.h>#include <ESP8266WiFi.h>#include <MicroGear.h>const char* ssid = \"SSID\";const char* password = \"PASSWORD\";#define APPID \"YOUR_APPID\"#define KEY \"YOUR_KEY\"#define SECRET \"YOUR_SECRET\"#define ALIAS \"YOUR_MICROGEAR_NAME\"#define FEEDID \"YOUR_FEED_ID\"#define INTERVAL 15000#define T_INCREMENT 200#define T_RECONNECT 5000#define BAUD_RATE 115200#define MAX_TEMP 100#define MAX_HUMID 100WiFiClient client; คูม่ ือการใชง้ าน NETPIE - 90

int timer = 0; //Define sensor typechar str[32]; // Define sensor pin //Initialize DHT sensor#define DHTTYPE DHT11#define DHTPIN D4DHT dht(DHTPIN, DHTTYPE);float humid;float temp;MicroGear microgear(client);// when the other thing send a msg to this boardvoid onMsghandler(char *topic, uint8_t* msg, unsigned int msglen) { Serial.print(\"Incoming message --> \"); msg[msglen] = '\0'; Serial.println((char *)msg);}void onConnected(char *attribute, uint8_t* msg, unsigned int msglen) { Serial.println(\"Connected to NETPIE...\"); microgear.setAlias(ALIAS);}void setup() { dht.begin(); microgear.on(MESSAGE,onMsghandler); microgear.on(CONNECTED,onConnected); Serial.begin(BAUD_RATE); Serial.println(\"Starting...\"); if (WiFi.begin(ssid, password)) { while (WiFi.status() != WL_CONNECTED) { delay(500); Serial.print(\".\"); } } คูม่ ือการใชง้ าน NETPIE - 91

Serial.println(\"WiFi connected\"); Serial.println(\"IP address: \"); Serial.println(WiFi.localIP()); microgear.init(KEY,SECRET,ALIAS); microgear.connect(APPID);}void loop() { if (microgear.connected()) { Serial.print(\"*\"); microgear.loop(); humid = dht.readHumidity(); temp = dht.readTemperature(); if (timer >= INTERVAL) { Serial.print(\"\nHumidity: \"); Serial.print(humid); Serial.print(\" %\t\"); Serial.print(\"Temperature: \"); Serial.print(temp); Serial.print(\" C%\n\"); String data = \"{\\"humid\\":\"; data += humid ; data += \", \\"temp\\":\"; data += temp ; data += \"}\"; if (isnan(humid) || isnan(temp) || humid >= MAX_HUMID || temp>=MAX_TEMP) { Serial.println(\"Failed to read from DHT sensor!\"); }else{ Serial.print(\"Sending -->\"); Serial.println((char*) data.c_str()); microgear.writeFeed(FEEDID,data); //YOUR FEED ID, API KEY } timer = 0; } else timer += T_INCREMENT; คูม่ ือการใชง้ าน NETPIE - 92

} else { Serial.println(\"connection lost, reconnect...\"); if (timer >= T_RECONNECT) { microgear.connect(APPID); timer = 0; } else timer += T_INCREMENT; } delay(200);}หมายเหตุ: ไฟล์ feed_dht.ino ได้รับการทดสอบด้วยการ compile กบั ESP8266 Microgear Version1.2.2 และ DHT Sensor Library by Adafruit Version 1.2.3 คูม่ ือการใชง้ าน NETPIE - 93

7.NETPIE REST API 7.1 REST API REST API (Representational State Transfer Application Programming Interface) หรือบางครัง้ เรียกวา่ RESTful API หรือ REST Web API หมายถึงการส่ือสารแลกเปลี่ยนข้อมลู ในแบบ WebService ด้วยการใช้ HTTP Method เชน่ GET POST PUT DELETE ข้อมลู ที่แลกเปลี่ยนกนั มกั อยใู่ นรูปแบบ JSON (JavaScript Object Notation) หรือ XML (eXtensible Markup Language) เดมิ ทีการส่ือสารแบบ Web Service จะใช้โพรโทคอล SOAP เพ่ือแลกเปลี่ยนข้อมลู XML ผ่านทาง HTTP หรือเวบ็โพรโทคอล แตก่ ารสื่อสารด้วย SOAP (Simple Object Access Protocol) นนั้ มี Overhead คอ่ นข้างสงูในขณะที่ REST นนั้ เบากวา่ ข้อมลู มีขนาดเลก็ กวา่ ใช้แบนด์วดิ ท์น้อยกวา่ การแลกเปล่ียนข้อมลู แบบREST จงึ เป็นท่ีนิยม ปัจจบุ นั บริการ API ของ Facebook, Twitter, Google ก็เลือกใช้ REST API คณุ สมบตั ขิ อง Web Service ท่ีใช้ REST API จะใช้ URI (Universal Resource Identifier) ในการเรียกข้อมลู เชน่ http://api.example.com/resources และใช้ HTTP Method ในการระบกุ ารกระทาตอ่ข้อมลู เชน่ GET http://api.example.com/resources หมายถึงเรียกดขู ้อมลู หรือ POSThttp://api.example.com/resources หมายถึงการเขียนข้อมลู เป็นต้น ตวั อยา่ งเชน่ ห้องสมดุ อาจจะทา API ให้ผ้ดู แู ลระบบดงึ ข้อมลู ของหนงั สือ ISBN 0596801688 โดยมีรูปแบบคาร้องขอดงั นี ้GET https://api.example.com/books/0596801688 และในขณะเดียวกนั การลบ Record ของหนงั สือ ก็อาจจะทาเป็น API งา่ ยๆ แบบนี ้DELETE https://api.example.com/books/0596801688 สว่ น Operation อ่ืนๆ เชน่ POST ก็อาจจะเอาไว้ใช้สร้างข้อมลู ใหม่ และ PUT สาหรับการอพั เดตข้อมลู ฯลฯ การใช้งานแบบนี ้ ทาให้ API ดเู ป็นธรรมชาติ อธิบายก็งา่ ย และด้วยความที่ HTTP เป็นโพรโทคอลมาตรฐานท่ีมีใช้กนั มานานแล้ว เราจงึ พบเจอ HTTP Client อยทู่ กุ หนทกุ แหง่ บนทกุ ภาษาโปรแกรมและในหลากหลายรูปแบบการใช้งาน แม้แตบ่ น Command Line ก็ยงั เรียกใช้งานได้ 7.2 NETPIE REST API NETPIE มีบริการ REST API เตรียมไว้ให้ สาหรับอปุ กรณ์ที่ไมส่ ามารถใช้ Microgear ผา่ นโพรโทคอล MQTT ในการสื่อสารได้ หรือยงั ไมม่ ี Microgear ในภาษาท่ีต้องการใช้ (เชน่ IPhone ท่ีใช้ Objective คูม่ ือการใชง้ าน NETPIE - 94

C หรือ เว็บเซริ ์ฟเวอร์ที่ใช้ PHP) ขอเพียงแคอ่ ปุ กรณ์รองรับโพรโทคอล HTTP ท่ีพอร์ต 80 ก็สามารถเรียกใช้NETPIE REST API ได้ อปุ กรณ์ที่ใช้ REST API สามารถแลกเปล่ียนข้อมลู กบั อปุ กรณ์อ่ืนท่ีใช้ REST APIหรือกบั อปุ กรณ์ท่ีใช้ Microgear ก็ได้ ข้อดีของการใช้ NETPIE REST API คอื ไมย่ ึดตดิ กบั ProgrammingLanguage ฮาร์ดแวร์และระบบปฏิบตั กิ าร สามารถนาไปประยกุ ตใ์ ช้กบั อปุ กรณ์แบบดงั้ เดมิ (LegacyDevice) ได้ ใช้งานผา่ น TCP พอร์ต 80 ซง่ึ เป็นพอร์ตท่ีเครือข่ายทว่ั ไปอนญุ าตให้ใช้ (ถ้าใช้ Microgear ซง่ึเป็นโพรโทคอล MQTT ต้องใช้ TCP พอร์ต 1883, 8083, และ 8080) การพฒั นา Microgear Library ออกมาให้ครอบคลมุ ทกุ Hardware Platform นนั้ เป็นเรื่องท่ีเป็นไปได้ยากมาก และเป็นงานที่ใช้เวลา NETPIE จงึ พฒั นา REST API ขนึ ้ มาเป็นอีกหนงึ่ ทางเลือก สาหรับHardware Platform ท่ี NETPIE ยงั ไมม่ ี Library ไปรองรับ และรวมไปถึงระบบหรือบริการที่มีมาอยกู่ ่อนแล้ว ก็สามารถเรียก API มาเช่ือมตอ่ NETPIE ได้เชน่ กนัAPI Endpoint REST API ของ NETPIE ให้บริการอยทู่ ่ี https//:api.netpie.io/Authentication ในการเชื่อมตอ่ API Client จะต้องทาการยืนยนั ตวั ตน โดยใช้หนงึ่ ในสองวิธีนี ้ 1. สง่ ผา่ น HTTP Header แบบ Basic Auth โดยใช้ Username: KEY Password: SECRET ตวั อยา่ งการใช้ Basic Auth ด้วย Command Line คาสง่ั cURL$ curl -X GET \"http//:www.domainname.com/resource\" -u key:secret 2. สง่ ผา่ นทาง URL Parameter ในรูปแบบ?auth=KEY:SECRET ตวั อยา่ งการใช้ URL Parameter ด้วย Command Line คาสง่ั cURL$ curl- X GET \"http//:www.domainname.com/resources?auth=key:secret\"Resource การใช้ REST API ของ NETPIE จะเป็นการกระทาการบางอยา่ งกบั Resource ซง่ึ Resource ท่ีเข้าถึงได้ของ NETPIE มีอยู่ 3 แบบด้วยกนั ได้แก่ คูม่ ือการใชง้ าน NETPIE - 95

1. Microgear หมายถึงตวั อปุ กรณ์เอง เราสามารถ Chat ตรงไปหามนั ได้ โดยอ้างองิ ช่ือ Alias 2. Topic เป็นสิ่งเดยี วกบั Topic เวลา Publish/Subscribe เราสามารถ Publish ข้อความไปที่ Topic โดยใช้ REST API ได้เชน่ กนั โดยอปุ กรณ์ที่ Subscribe อยกู่ ็จะได้รับข้อความ Topic นนั้ 3. Postbox คือถงั เก็บข้อมลู ชวั่ คราว สามารถสง่ ข้อความเข้าไป หรืออา่ นข้อความออกมาได้HTTP Method HTTP Method ที่ NETPIE REST API รองรับคอื GET (เพ่ือเรียกดขู ้อมลู ) และ PUT (เพื่อเขียนข้อมลู ) วธิ ีการเรียกใช้งานPUT PUT /microgear/{appid}/{alias} PUT /topic/{appid}/{topicname} PUT /postbox/{appid}/{postboxname} Parameter Method PUT รับ Parameter ช่ือ retain ซง่ึ หากกาหนด retain จะมีความหมายวา่ ให้NETPIE เก็บคา่ นีไ้ ว้ ซงึ่ แพลตฟอร์มจะเก็บเฉพาะคา่ ลา่ สดุ เพียงคา่ เดยี ว Body ในเนือ้ หา (Payload) ของ HTTP PUT จะเป็นข้อความท่ีต้องการสง่ ไปยงัtopic/microgear/postbox ตวั อยา่ งการเรียกใช้งาน PUT ในการสง่ ข้อความ ON แบบ retain ไปยงั Topic ช่ือ mytopic ในAppID ช่ือ myappid แบบส่ง Authentication ไปใน URL$ curl -X PUT\"https//:api.netpie.io/topic/myappid/mytopic?retain&auth=MyKey:MySecret\"-d\"ON\" ตวั อยา่ งการเรียกใช้งาน PUT ในการสง่ ข้อความ ON แบบ retain ไปยงั Topic ช่ือ mytopic ในAppID ชื่อ myappid แบบสง่ Authentication ไปใน HTTP Header แบบ Basic Auth$ curl -X PUT \"https//:api.netpie.io/topic/myappid/mytopic?retain\" -d \"ON\"-u MyKey:MySecretGET GET /microgear/{appid}/{alias} GET /topic/{appid}/{topicname} คูม่ ือการใชง้ าน NETPIE - 96

GET /postbox/{appid}/{postboxname} Parameter ไมม่ ี Body ไมม่ ี ตวั อยา่ งการเรียกใช้งาน GET ในการอา่ นข้อความใน Topic หรือ mytopic ใน AppID ชื่อ myappidแบบสง่ Authentication ไปใน URL$ curl -X GET\"https//:api.netpie.io/topic/myappid/mytopic?auth=MyKey:MySecret\" ตวั อยา่ งการเรียกใช้งาน GET ในการอา่ นข้อความใน Topic หรือ mytopic ใน AppID ช่ือ myappidแบบสง่ Authentication ไปใน HTTP Header แบบ Basic Auth$ curl -X GET\" https//:api.netpie.io/topic/myappid/mytopic\"-uMyKey:MySecret เราสามารถทดสอบการเรียก Method Get โดยนา URL ไปใสใ่ น Browser โดยตรงได้เชน่ ถ้าทางานได้ถกู ต้องจะได้รับคา่ ท่ีเคย PUT และ retain ไปยงั topic/microgear/postbox นี ้ ในรูปแบบ JSON เชน่[{\"topic\":\"/myappid/mytopic\",\"payload\":\"ON\",\"lastUpdated\":1471760882,\"retain\":true}] การพมิ พ์ URL ลงไปใน Address Bar ของเว็บเบราว์เซอร์ จะเป็ นการเรียก HTTP GETMethod เท่านั้น ไม่สามารถใช้กับ Method อ่ืนๆ ได้Lab 7.1: HTML  HTML ในการทดลองนีจ้ ะให้เบราว์เซอร์สองตวั (บนเคร่ืองเดียวกนั หรือตา่ งเครื่องก็ได้) สื่อสารกนั ผา่ นNETPIE REST API โดยเป็นการเขียนโปรแกรมด้วย HTML และ Javascript โดยเบราว์เซอร์ตวั แรกสง่คาสงั่ PUT และเบราว์เซอร์ตวั ที่สองสง่ คาสงั่ GET สร้างไฟล์ SetLampStatus.html ดงั นี ้ คูม่ ือการใชง้ าน NETPIE - 97

SetLampStatus.html<html><body><script> var APPID= \"YOURAPPID\"; //enter your appid var KEY = \"YOURKEY\"; //enter your key var SECRET = \"YOURSECRET\"; //enter your secret var Topic = \"/LampStatus\"; //choose any topic name function PressButtonOn(){ var url ='https://api.netpie.io/topic/'+APPID+Topic+'?retain&auth=' +KEY+':'+SECRET; var xmlHttp = new XMLHttpRequest(); xmlHttp.open('PUT',url,true); xmlHttp.send('ON'); window.alert(url);//for debugging purpose } function PressButtonOff(){ var url ='https://api.netpie.io/topic/'+APPID+Topic+'?retain&auth=' +KEY+':'+SECRET; var xmlHttp = new XMLHttpRequest(); xmlHttp.open('PUT',url,true); xmlHttp.send('OFF'); window.alert(url); //for debugging purpose }</script><center><button onclick=\"PressButtonOn()\" id = \"ButtonOn\">ON</button><button onclick=\"PressButtonOff()\" id = \"ButtonOff\">OFF</button></center></body></html> Double click ท่ีไฟล์SetLampStatus.html เลือกเปิดบนเวบ็ เบราว์เซอร์ เชน่ IE จะเห็นหน้าตา่ งแบบนี ้ คูม่ ือการใชง้ าน NETPIE - 98

สร้างไฟล์ GetLampStatus.html ดงั นี ้GetLampStatus.html<html><body><script> var APPID= \"YOURAPPID\"; //enter your appid var KEY = \"YOURKEY\"; //enter your key var SECRET = \"YOURSECRET\"; //enter your secret var Topic = \"/LampStatus\"; function GetButtonStatus(){ var url = 'https://api.netpie.io/topic/'+APPID+Topic+'?auth='+KEY+':'+SECRET; var xmlHttp = new XMLHttpRequest(); xmlHttp.onreadystatechange = function() { if (xmlHttp.status == 200 && xmlHttp.readyState==4){ document.body.className = 'ok'; var result = xmlHttp.responseText; window.alert(result); } else {document.body.className = 'error'; } } xmlHttp.open('GET',url,true); xmlHttp.send(null); }</script><center><button onclick=\"GetButtonStatus()\" id = \"Button\">Check LampStatus</button></center></body></html> คูม่ ือการใชง้ าน NETPIE - 99

เปิดไฟล์ GetLampStatus.html บนเว็บเบราว์เซอร์อีกตวั เชน่ Google Chrome หรือ Firefox หรือเปิดเว็บเบราว์เซอร์บนเคร่ืองของเพื่อน จะเห็นหน้าตา่ งแบบนี ้ กดป่มุ Check Lamp Status สงั เกตผลลพั ธ์ท่ีได้ จะอยใู่ นรูปแบบ JSON Array ซงึ่ ประกอบด้วย [ ช่ือ Resource, ข้อความ Payload, Last Update, retain ] เชน่[{\"topic\":\"/YOURAPPID/LampStatus\",\"payload\":\"ON\",\"lastUpdated\":1471760882,\"retain\":true}] KEY ทใี่ ส่ในไฟล์ SetLampStatus.html และ GetLampStatus.html ควรสร้างเป็ น Session Keyสามารถใช้ KEY เดียวกันทง้ั สองไฟล์หรือจะใช้ KEY ท่แี ตกต่างกันก็ได้ทดลองเพ่มิ เตมิ 1. พมิ พ์ URL ลงใน Address Bar โดยตรง https://api.netpie.io/topic/YOURAPPID/LampStatus?auth=YOURKEY:YOURSECRET สงั เกตผลลพั ธ์ท่ีได้ 2. แก้ไขไฟล์ SetLampStatus.html โดย retain parameter ออกสงั เกตผลลพั ธ์ที่ได้จากคาสงั่ GET 3. แก้ไขไฟล์ SetLampStatus.html และ GetLampStatus.html โดยเปลี่ยนช่ือ Topic เป็น /LampStatus/bedroom สงั เกตผลลพั ธ์ที่ได้จากคาสง่ั GET 4. แก้ไขไฟล์ SetLampStatus.html และ GetLampStatus.html เปลี่ยนจากการใช้ Topic เป็น Postbox Topicname และ Postboxname สามารถตัง้ เป็ นชื่อใดๆ ท่ีต้องการ สามารถเรียกใช้ได้ภายในAppID ทก่ี าหนดเท่านั้น คูม่ ือการใชง้ าน NETPIE - 100