Semua Tentang Belajar Teknologi Digital Dalam Kehidupan Sehari - Hari

  • IC Timer 555 yang Multifungsi

    IC timer 555 adalah sirkuit terpadu (chip) yang digunakan dalam berbagai pembangkit timer, pulsa dan aplikasi osilator. Komponen ini digunakan secara luas, berkat kemudahan dalam penggunaan, harga rendah dan stabilitas yang baik

  • Ayo Migrasi TV Digital

    Kami bantu anda untuk memahami lebih jelas mengenai migrasi tv digital, apa sebabnya dan bagaimana efek terhadap kehidupan. Jasa teknisi juga tersedia dan siap membantu instalasi - setting perangkat - pengaturan antena dan distribusi televisi digital ke kamar kos / hotel

  • Bermain DOT Matrix - LOVEHURT

    Project Sederhana dengan Dot Matrix dan Attiny2313. Bisa menjadi hadiah buat teman atau pacarmu yang ulang tahun dengan tulisan dan animasi yang dapat dibuat sendiri.

  • JAM DIGITAL 6 DIGIT TANPA MICRO FULL CMOS

    Jika anda pencinta IC TTL datau CMOS maka project jam digital ini akan menunjukkan bahwa tidak ada salahnya balik kembali ke dasar elektronika digital , sebab semuanya BISA dibuat dengan teknologi jadul

  • Node Red - Kontrol Industri 4.0

    Teknologi kontrol sudah melampaui ekspektasi semua orang dan dengan kemajuan dunia elektronika, kini semakin leluasa berkreasi melalui Node Red

Jumat, 20 Agustus 2021

Wemos ESP8266 - Part 5 - MQTT ke Aplikasi Smartphone

 



Setelah berhasil memahami konsep PubSub melalui protokol MQTT, maka kini saatnya mengolah datanya menjadi tampilan yg lebih menarik dan dipahami oleh orang awam. Tentu saja keajaiban smartphone membuat IOT terasa lebih menarik karena gawai smartphone yg hampir 24 jam orang pegang, dapat dimanfaatkan melakukan kontrol se-isi rumah dari jauh melalui internet. 

Lalu apa bedanya dengan Wemos yg sudah kita bahas sebelumnya kan sudah bisa digunakan sebagai webserver dan bisa diakses dari luar rumah ? Ada sesuatu yg kurang dari HTTP sebagai metode komunikasi  IOT dibandingkan dengan MQTT.

MQTT adalah data-sentris sedangkan HTTP adalah dokumen-sentris. HTTP adalah protokol Request-response yg dikatakan "connectionless" untuk komputasi server-klien dan tidak selalu dioptimalkan untuk perangkat seluler. Keuntungan utama MQTT dalam sistem IOT ini adalah ringan (MQTT mentransfer data sebagai array byte) dan model Pub/Sub, yang membuatnya sempurna untuk perangkat dengan sumber daya terbatas dan membantu menghemat baterai.

Selain itu, model Pub/Sub menyediakan klien dengan keberadaan independen satu sama lain dan meningkatkan keandalan keseluruhan sistem. Ketika satu klien rusak, seluruh sistem dapat terus bekerja dengan baik. Menurut pengukuran di jaringan 3G, throughput MQTT 93 kali lebih cepat daripada HTTP.

Itulah sedikit cuap-cuap hasil googling mengenai perbedaan HTTP vs MQTT yg sekiranya mudah dipahami. Kini bagian yg mungkin sulit dipahami, jadi butuh kembali membaca pembahasan sebelumnya dari Part 1 - 4, dimana MQTT dalam platform arduino sudah dimudahkan dengan Library PubSubClient yang memudahkan penerjemahan text ke dalam byte array dan kemudian dikirimkan secara TCP ke MQTT broker.




Saya anggap pembaca sudah paham sampai praktek kirim data DHT 11 dan kontrol LED di Part 3 sehingga kelanjutannya kali ini saya tinggal membahas script Pub-Sub pada library pubsubclient. Scriptnya seperti dibawah ini :


#include <ESP8266WiFi.h>
#include <PubSubClient.h> //library pubsub by o'leary
#include "DHT.h"


const char *ssid =  "nama wifi";   // Gunakan sesuai wifi kamu
const char *pass =  "passwordnya";   //

//inisialisasi broker
const char *mqtt_server = "broker.hivemq.com"; //BROKER GRATIS
const int mqtt_port = 1883;
const char *mqtt_user = "";
const char *mqtt_pass = "";
const char *mqtt_client_name = "namamu123456"; // Client connections random dan gak boleh sama

// Ubah nama topik biar unik gak nabrak sama rekan lainnya
#define SUHUTOPIC "/testyuk/suhu"
#define HUMITOPIC "/testyuk/humi"
#define LEDTOPIC "/testyuk/led"

//IO pin
const int dhtPin = 13; //pin DHT di wemos(I/O marking bawah)
#define LED_SCK 14  //LED SCK
#define LED_ESP 2   //LED ESP


#define DHTTYPE DHT11  //Sensor DHT11
DHT dht(dhtPin, DHTTYPE); 

//Timer
unsigned long previousMillis = 0;
const long interval = 10000;   // interval pengambilan dht 11
                               // broker gratis jangan cepet2

WiFiClient wclient;            //wifi client terhubung lib pubsub
PubSubClient client(wclient);

void setup() {
  pinMode(LED_SCK, OUTPUT);  //inisialisasi LED
  pinMode(LED_ESP, OUTPUT);

  digitalWrite(LED_ESP,HIGH);
  digitalWrite(LED_SCK,LOW);
  
  //Inisialisasi broker & Callback sub message
  client.setServer(mqtt_server, mqtt_port);
  client.setCallback(mqtt_callback);
  Serial.begin(9600);
  delay(10);
  Serial.println();
  Serial.println();
  setupwifi();
  dht.begin();
}

void setupwifi()
{
   if (WiFi.status() != WL_CONNECTED) {
    Serial.print("Terhubung Ke Wifi:  ");
    Serial.print(ssid);
    Serial.println("...");
    WiFi.begin(ssid, pass);

    if (WiFi.waitForConnectResult() != WL_CONNECTED)
      return;
    Serial.println("WiFi Terhubung");
    Serial.println("IP address: ");
    Serial.println(WiFi.localIP());
  }
}

void reconnectmqtt() //function mengatur koneksi ke broker 
{
   
    
      Serial.println("Connecting to MQTT server..");
     
      if (client.connect(mqtt_client_name,mqtt_user, mqtt_pass)) {
        Serial.println("Connected to MQTT server");
      } else {
        Serial.println("Could not connect to MQTT server");   
      }
   

    if (client.connected()){
      Serial.print("subscribe to topic: ");
      Serial.println(LEDTOPIC);
      client.subscribe(LEDTOPIC); //subscribe ke topic LED on off
    }
  
}



// Non-Blocking delay agar gak ganggu proses utama
void SendTempHumid(){
  unsigned long currentMillis = millis();
 
  if(currentMillis - previousMillis >= interval) {
    // cek interval  
    previousMillis = currentMillis;   
 
    float h = dht.readHumidity();
    float t = dht.readTemperature();

    if (isnan(h) || isnan(t)) {
      Serial.println("Failed to read from DHT sensor!");
    }

    Serial.print("Humidity: "); 
    Serial.print(h);
    Serial.print(" %\t");
    Serial.print("Temperature: "); 
    Serial.print(t);
    Serial.println(" °C ");
    

    String pubStringt = String(t);
    String pubStringh = String(h);

    //yg dibawah ini metode pengiriman PUB ke TOPIC
    //dikirim perbyte message + header nya
    //sudah dimudahkan oleh library pubsub

    Serial.println("publish to topic: " );
    Serial.print(SUHUTOPIC);
    Serial.print(" : ");
    Serial.println(pubStringt);
    char message_bufft[pubStringt.length() + 1];
    pubStringt.toCharArray(message_bufft, pubStringt.length() + 1);
    client.publish(SUHUTOPIC,message_bufft );

    Serial.println("publish to topic: " );
    Serial.print(HUMITOPIC);
    Serial.print(" : ");
    Serial.println(pubStringh);
    char message_buffh[pubStringh.length() + 1];
    pubStringh.toCharArray(message_buffh, pubStringh.length() + 1);
    client.publish(HUMITOPIC,message_buffh );

  }

}


//function callback saat ada pesan SUB yg masuk

void mqtt_callback(char* topic, byte* payload, unsigned int length) {
 
  Serial.print("Message arrived in topic: ");
  Serial.println(topic);
 
  Serial.print("Message:");
 
  String message;
  for (int i = 0; i < length; i++) {
    message = message + (char)payload[i];  //Conver *byte to String
  }
   Serial.print(message);
  if(message == "sckOn") {digitalWrite(LED_SCK,HIGH);}   //LED SCK on  
  if (message == "sckOff") {digitalWrite(LED_SCK,LOW);}   //LED SCK off 
  if (message == "espOn") {digitalWrite(LED_ESP,LOW);}   //LED ESP on
  if (message == "espOff") {digitalWrite(LED_ESP,HIGH);}   //LED ESP off   
    
  Serial.println();
  Serial.println("-----------------------");  


}




void loop() {
 
  if (!client.connected()) 
   {
    reconnectmqtt();
   }
   else client.loop(); //cek terus kalau ada data masuk
  
  
  SendTempHumid();
  
}

Singkat bukan ? Cukup baca examples yg diberikan oleh librarynya atau githubnya maka sudah cukup jelas konsep nya. Mari kita bahas perbagian, dimana bagian PUB dan SUB nya .



PUB :


String pubStringt = String(t);
char message_bufft[pubStringt.length() + 1];
pubStringt.toCharArray(message_bufft, pubStringt.length() + 1);
client.publish(SUHUTOPIC,message_bufft );

Terlihat pada scipt diatas hasil pembacaan suhu  t (float) diubah menjadi string lalu di arraykan satu persatu sebelum di Publish ke topic yg telah ditentukan sebelumnya.
 

SUB :




 client.setCallback(mqtt_callback);    //Di function Setup
 
 =======================
 
 if (client.connected()){
  client.subscribe(LEDTOPIC); //di function reconnect
    }
    
 ========================
 
 void mqtt_callback(char* topic, byte* payload, unsigned int length) {
 
  Serial.print("Message arrived in topic: ");
  Serial.println(topic);
 
  Serial.print("Message:");
 
  String message;
  for (int i = 0; i < length; i++) {
    message = message + (char)payload[i];  //Conver *byte to String
  }
   Serial.print(message);
  if(message == "sckOn") {digitalWrite(LED_SCK,HIGH);}   //LED SCK on  
  if (message == "sckOff") {digitalWrite(LED_SCK,LOW);}   //LED SCK off 
  if (message == "espOn") {digitalWrite(LED_ESP,LOW);}   //LED ESP on
  if (message == "espOff") {digitalWrite(LED_ESP,HIGH);}  //LED ESP off   
    
  Serial.println();
  Serial.println("-----------------------");  


}

    
    


Sedangkan hasil dari serial monitor sebagai berikut :





Bagaimana dengan aplikasi IOT MQTT Panel pada smartphone kamu ? jangan lupa untuk memahaminya terlebih dahulu pada praktek sebelumnya disini. Sehingga jika setting topiknya benar, bisa membuat tampilan keren seperti gambar dibawah ini :



*)Sesuaikan nama topic yg di script arduino, usahakan unik agar gak nabrak 


Bermacam-macam GUI Panel bisa di kostumisasi untuk tampilan yang lebih menarik seperti contoh yg saya buat 2 tahun yg lalu.







Kekurangannya hanya pada bagian data Loggernya sehingga belum dapat disimpan untuk keperluan pelaporan dengan jarak waktu lebih panjang. Hal ini akan dibahas pada bagian selanjutnya dan akan memanfaatkan script python pada PC cloud atau aplikasi database lainnya. Bagian selanjutnya dapat dibaca disini.
Share:

Wemos ESP8266 - Part 4 - PubSub MQTT : Hello World !

Untuk memulai topik kali ini, sebaiknya kita pahami istilah Pub/Sub yg merupakan istilah kirim terima pesan / data dimana dimungkinkan berkomunikasi secara asinkronous, dengan latensi pada orde 100 milidetik.




Pub/Sub pada skala lebih besar di environment cloud semacam youtube digunakan untuk analitik streaming dan jalur integrasi data untuk menyerap dan mendistribusikan data. Ini sama efektifnya dengan middleware berorientasi pesan untuk integrasi layanan atau sebagai jalur antrian untuk memparalelkan tugas.

Pub/Sub memungkinkan membuat sistem "event" atau kejadian antara "Produsen"  dan "Konsumen", yang disebut Publisher dan Subscriber. Publisher berkomunikasi dengan Subscriber secara asinkron dengan mem-"broadcast" pesan dari suatu kejadian /event, bukan dengan pesan remote antar satu persatu bagian atau synchronous remote procedure calls (RPCs).




Publisher mengirim pesan kejadian/event ke layanan Pub/Sub, tanpa memperhatikan bagaimana atau kapan event ini akan diproses. Pub/Sub kemudian mengirimkan event ke semua Subscriber yang perlu bereaksi terhadapnya. Dibandingkan dengan sistem yang berkomunikasi melalui RPC, di mana penerbit harus menunggu pelanggan menerima data, integrasi asinkron semacam ini meningkatkan fleksibilitas dan ketahanan sistem secara keseluruhan.

Dalam  Pengiriman pesan diperlukan TOPIK sebagai tujuan dimana publisher mengirim pesan, secara asinkron topik ini juga di "subscribe / langganan" oleh pengguna datanya. Mirip seperti chatting melalui IRC atau group email millist jaman dulu dan memang benar, salah satu ide PUB/SUB memang dari aktivitas chatting melalui protokol XMPP. Ini berarti diperlukan suatu "Broker" sebagai pengatur jalannya pesan dan relay storage sementara yg berada diposisi layaknya Cloud. Salah satu protokol pesan PUB/SUB paling ramai digunakan saat ini adalah MQTT.




Protokol MQTT adalah standar de-facto untuk pesan IoT. Distandarisasi oleh OASIS dan ISO, protokol publish/subscribe MQTT menyediakan cara yang terukur dan andal untuk menghubungkan perangkat melalui Internet. Saat ini, MQTT digunakan oleh banyak perusahaan untuk menghubungkan jutaan perangkat ke Internet.

Klien MQTT memublikasikan pesan ke broker MQTT dan klien MQTT lainnya berlangganan pesan yang ingin mereka terima. Implementasi klien MQTT biasanya memerlukan footprint minimal sehingga sangat cocok untuk diterapkan pada perangkat kecil yang dibatasi dan sangat efisien dalam kebutuhan bandwidth mereka.

Broker MQTT menerima pesan yang dipublikasikan dan mengirimkan pesan ke klien MQTT yang berlangganan. Pesan MQTT berisi topik pesan yang menjadi langganan klien MQTT dan pialang MQTT menggunakan daftar langganan ini untuk menentukan klien MQTT untuk menerima pesan.





Kali ini kita gunakan broker HiveMQ yg menawarkan broker MQTT komersial dan open source. Karena kemudahannya maka menjadi rujukan umum bagi merkea yg belajar perpesanan IOT. Kalui ini kita akan mencoba PUB SUB pesan melalui broker ini menggunakan applikasi di PC yaitu : MQTT Explorer ( https://mqtt-explorer.com/ ) dan aplikasi di HP android : IOTMQTTPanel.



Kita akan terhubung dengan broker gratis dari HiveMq dengan alamat broker :


  • Adress : broker.hivemq.com
  • port : 1883

 

Kosongkan semua credensial username dan password bahkan certificate pun tidak diperlukan. Kali ini kita akan PUB ke topik : /e38/hello dan SUB ke topik :/e38/halo , untuk itu kita SUB dulu pada MQTTExplorer pada menu advance.




Pada sisi Smartphone Android / Iphone bisa gunakan MQTT browser lainnya, namun untuk kelanjutan project IOT maka diharapkan menginstall IOTMQTTPanel yg lumayan lengkap fasilitasnya. Setting koneksinya seperti berikut :



Lalu kita akan menambahkan 2 text panel, satunya LOG untuk menerima SUB pesan dari broker dan Text Input untuk menerima inputan text dan selanjutnya dikirim secara PUB ke broker.






Hasil dari chatting antara PC dan HP melalui broker HiveMQ dengan protokol MQTT sebagai berikut :






Dengan memahami proses diatas, maka diharapkan ada sedikit gamaran mengenai konsep PUB SUB melalui protokol MQTT, dan selanjutnya bisa kirim terima data sensor ke smartphone


MQTT menerapkan 3 tingkat kualitas layanan untuk kesepakatan antara pengirim dan penerima: 1) Paling banyak satu kali (0), 2) Setidaknya satu kali (1), dan 3) Tepat sekali (2). Level QoS ini memungkinkan aplikasi IoT yang lebih andal karena infrastruktur perpesanan yang mendasarinya dan beradaptasi dengan kondisi jaringan yang (mungkin) tidak dapat diandalkan.


MQTT memungkinkan sesi persisten antara klien dan broker. Ini memungkinkan sesi tetap ada meskipun jaringan terputus. Setelah jaringan terhubung kembali, informasi untuk menghubungkan kembali klien ke broker masih ada. Ini adalah salah satu fitur utama yang membuat protokol MQTT lebih efisien daripada HTTP untuk digunakan melalui jaringan seluler yang (mungkin) tidak dapat diandalkan.


Klien MQTT yang Subscribe topik baru tidak memiliki wawasan tentang kapan harus mengharapkan pesan pertama yang akan mereka terima. Namun, broker MQTT dapat menyimpan pesan yang disimpan yang dapat segera dikirim setelah berlangganan MQTT baru. Dalam hal ini, klien MQTT akan menerima setidaknya satu pesan setelah  Subscribe topik.


Klien MQTT dapat menentukan pesan kepada broker MQTT, yang disebut wasiat terakhir, yang akan dikirim jika klien MQTT terputus secara tidak wajar. Hal ini memungkinkan untuk pemberitahuan seluruh sistem yang lebih anggun bahwa klien telah terputus.

Share:

Kamis, 19 Agustus 2021

Wemos ESP8266 - Part 3 - Hello Internet : Kontrol Perangkat Dari Luar Rumah

 



Setelah anda berhasil mengenal fungsi dasar dari Wemos D1 R2 dan berhasil mengirim data pengukuran suhu DHT 11 melalui protokol TCP ke smartphone, kini saatnya membawa data suhu kelembaban dan kontrol I/O ke luar rumah melalui jalur Internet. Jika sebelumnya data hanya berupa teksmelalui TCP, maka ini akan terlihat menjadi kurang menarik. Kita akan manfaatkan fasilitas Web Server yg dimiliki oleh ESP8266. Wihh kok canggih ? alat sekecil itu bisa menjadi web server ?

Library dasar yg digunakan adalah ESP8266WiFi.h dimana ada class WifiServer yg bisa dimasukkan kedalamnya teks berformat HTML  dan juga terdapat fungsi dasar response HTTP  baik GET maupun POST. 

Masih ingat kan, project sebelumnya untuk menghidupkan LED pada board wemos ? Kali ini kita buat versi lain dalam bentuk website yg lebih menarik dan mengandung CSS, sehingga UI tombolnya tampil lebih keren, script nya seperti berikut :


// Load Wi-Fi library
#include <ESP8266WiFi.h>

// Ganti dengan nama wifi yg digunakan
const char* ssid     = "nama wifi";
const char* password = "password";

// Set web server port :80
WiFiServer server(80);

// Variable menyimpan HTTP request
String header;

// Variabel menyimpan status LED SCK(14) dan Led ESP (2)
String LedSCKState = "off";
String LedESPState = "off";

// Pilih GPIO pin untuk kedua LED
const int LedSCK = 14; //LED SCK
const int LedESP = 2;  //LED ESP

// variabel untuk delay timer asynchronous tanpa mengganggu fungsi utama
unsigned long currentTime = millis();
// Previous time
unsigned long previousTime = 0; 
// Define timeout time in milliseconds (example: 2000ms = 2s)
const long timeoutTime = 2000;

void setup() {
  Serial.begin(9600);
  // Inisialisasi PIN
  pinMode(LedSCK, OUTPUT);
  pinMode(LedESP, OUTPUT);
  // Buat LED mati
  digitalWrite(LedSCK, LOW);
  digitalWrite(LedESP, HIGH); //logika terbalik aktif LOW

  // konek ke wifi
  Serial.print("Terhubung ke jaringan ");
  Serial.println(ssid);
  WiFi.begin(ssid, password);
  while (WiFi.status() != WL_CONNECTED) {
    delay(500);
    Serial.print(".");
  }
  // Print local IP address lalu mulai web server
  Serial.println("");
  Serial.println("WiFi terhubung ...");
  Serial.println("IP address: ");
  Serial.println(WiFi.localIP());
  server.begin();
}

void loop(){
  WiFiClient client = server.available();   // Listen for incoming clients

  if (client) {                             // If a new client connects,
    Serial.println("New Client.");          // print a message out in the serial port
    String currentLine = "";                // make a String to hold incoming data from the client
    currentTime = millis();
    previousTime = currentTime;
    while (client.connected() && currentTime - previousTime <= timeoutTime) { // loop while the client's connected
      currentTime = millis();         
      if (client.available()) {             // if there's bytes to read from the client,
        char c = client.read();             // read a byte, then
        Serial.write(c);                    // print it out the serial monitor
        header += c;
        if (c == '\n') {                    // if the byte is a newline character
          // if the current line is blank, you got two newline characters in a row.
          // that's the end of the client HTTP request, so send a response:
          if (currentLine.length() == 0) {
            // HTTP headers always start with a response code (e.g. HTTP/1.1 200 OK)
            // and a content-type so the client knows what's coming, then a blank line:
            client.println("HTTP/1.1 200 OK");
            client.println("Content-type:text/html");
            client.println("Connection: close");
            client.println();
            
            // Nyalain LED on and off sesuai header GET 
            if (header.indexOf("GET /SCK/on") >= 0) {
              Serial.println("Led SCK on");
              LedSCKState = "on";
              digitalWrite(LedSCK, HIGH);
            } else if (header.indexOf("GET /SCK/off") >= 0) {
              Serial.println("Led SCK off");
              LedSCKState = "off";
              digitalWrite(LedSCK, LOW);
            } else if (header.indexOf("GET /ESP/on") >= 0) {
              Serial.println("Led ESP on");
              LedESPState = "on";
              digitalWrite(LedESP, LOW);
            } else if (header.indexOf("GET /ESP/off") >= 0) {
              Serial.println("Led ESP off");
              LedESPState = "off";
              digitalWrite(LedESP, HIGH);
            }
            
            // Display the HTML web page & CSS
            client.println("<!DOCTYPE html><html>");
            client.println("<head><meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">");
            client.println("<link rel=\"icon\" href=\"data:,\">");
            // CSS to style the on/off buttons 
            // Feel free to change the background-color and font-size attributes to fit your preferences
            client.println("<style>html { font-family: Helvetica; display: inline-block; margin: 0px auto; text-align: center;}");
            client.println(".button { background-color: #195B6A; border: none; color: white; padding: 16px 40px;");
            client.println("text-decoration: none; font-size: 30px; margin: 2px; cursor: pointer;}");
            client.println(".button2 {background-color: #77878A;}</style></head>");
            
            // Web Page Header
            client.println("<body><h1>ESP8266 Web Server</h1>");
            
            // Display current state, and ON/OFF buttons for LED SCK
            client.println("<p>Status LED SCK " + LedSCKState + "</p>");
            // If the output5State is off, it displays the ON button       
            if (LedSCKState=="off") {
              client.println("<p><a href=\"/SCK/on\"><button class=\"button\">ON</button></a></p>");
            } else {
              client.println("<p><a href=\"/SCK/off\"><button class=\"button button2\">OFF</button></a></p>");
            } 
               
            // Display current state, and ON/OFF buttons for LED ESP 
            client.println("<p>Status LED ESP " + LedESPState + "</p>");
            // If the output4State is off, it displays the ON button       
            if (LedESPState=="off") {
              client.println("<p><a href=\"/ESP/on\"><button class=\"button\">ON</button></a></p>");
            } else {
              client.println("<p><a href=\"/ESP/off\"><button class=\"button button2\">OFF</button></a></p>");
            }
            client.println("</body></html>");
            
            // The HTTP response ends with another blank line
            client.println();
            // Break out of the while loop
            break;
          } else { // if you got a newline, then clear currentLine
            currentLine = "";
          }
        } else if (c != '\r') {  // if you got anything else but a carriage return character,
          currentLine += c;      // add it to the end of the currentLine
        }
      }
    }
    // Clear the header variable
    header = "";
    // Close the connection
    client.stop();
    Serial.println("Client disconnected.");
    Serial.println("");
  }
}


Dan lanjutkan mengcompile dan download menuju wemos, perhatikan IP address yg muncul pada serial monitor :



Lanjutkan masuk ke alamat IP tadi pada browser dan akan muncul layar berisikan status LED dan tombol ON - OFF :



Perhatikan ketika salah satu tombol ditekan maka akan ada perintah GET menuju ke header dari websever, mengikuti script a href sepert berikut :


client.println("<p><a href=\"/ESP/on\"><button class=\"button\">ON</button></a></p>");


Artinya saat tombol ditekan maka a href akan mengarahkan browser masuk ke http://ipnya/ESP/on , lalu dibaca headernya dan di baca oleh IF untuk menentukan  LED mana yang nyala dan yang mati.


 if (header.indexOf("GET /SCK/on") >= 0) {

              Serial.println("Led SCK on");

              LedSCKState = "on";

              digitalWrite(LedSCK, HIGH);

            } else if (header.indexOf("GET /SCK/off") >= 0) {

              Serial.println("Led SCK off");

              LedSCKState = "off";

              digitalWrite(LedSCK, LOW);

            } else if (header.indexOf("GET /ESP/on") >= 0) {

              Serial.println("Led ESP on");

              LedESPState = "on";

              digitalWrite(LedESP, LOW);

            } else if (header.indexOf("GET /ESP/off") >= 0) {

              Serial.println("Led ESP off");

              LedESPState = "off";

              digitalWrite(LedESP, HIGH);

            }



            


Memang agak sedikit primitive, ada juga cara lain yg asyncronous tapi memerlukan pemahaman webserver lebih lanjut seperti tulisan saya disini.

 

Lalu bagaimana jika ingin menambahkan pembacaan sensor DHT 11 dan tampil pada laman web ? Cukup ambahkan library DHT11 seperti penjelasan di tulisan  sebelumnya dan  buat function berikut, letakkan diatas setup :


String SendTempHumid(){
  
 String datae ="";
  
  float h = dht.readHumidity();
  float t = dht.readTemperature();


   if (isnan(h) || isnan(t) ) {
    Serial.println(F("Failed to read from DHT sensor!"));
    return "error";
  }

datae+= String(t).substring(0, 4); // tampilkan hanya 3 digit 
datae+= "&deg;C / " ;
datae+= String(h).substring(0, 2); //tapilkan hanya 2 digit
datae+= "%";
Serial.println(datae);
return datae;

}

Function diatas akan menghasilkan string berupa pembacaan suhu dan kelembaban, selanjutnya akan ditampilkan pada layar web. Karena pembacaannya tidak periodik, maka butuh tombol refresh seperti script berikut :


 client.println("<br>");
 client.println("<p>Kondisi : " + SendTempHumid() + "</p>");
 client.println("<p><a href=\"/refresh/\"><button class=\"button\">Refresh</button></a></p>");

Tambahkan script diatas tadi dibagian sebelum client.println("</body></html>"); dan selanjutnya bila ingin mengupdate pembacaan sensor bisa tekan tombol refresh.


Pekerjaan belum selesai sampai disini, naggung ! Masih cuman bisa ngontrol wemos dari lokasi yg dekat dengan wifi routernya, lalu bagaimana menghubungkannya ke Internet ? 

Kita manfaatkan fasilitas DDNS, yaitu Dynamic DNS yg memungkinkan membuat nama domain gratis dan diarahkan ke IP publik yg bisa berubah-ubah. Ada syarat utama yaitu kamu harus menggunakan router wifi dari jaringan kabel/optik dengan ip publik , dan tidak bisa untuk koneksi melalui GSM /4G yang IP nya umumnya lokal / sharing IP. Untuk itu pastikan IP yg didapatkan oleh Router wifi kamu adalah IP publik seperti pada gambar.



Urutannya seperti berikut :

  • Masuk ke konsole GPON atau wifi router (IP nya belakangnya mesti 1) , syukur-syukur masih admin:admin atau user passwordnya kamu ketahui, kalau tidak ya jangan lanjutkan praktek ini.
  • Cek WAN status dan bandingkan dengan IP yg muncul dari  myipadress.com
  • Daftar ke noip.com , tambahkan nama domain DDNS sesuai yg kamu inginkan seperti contoh diatas.
  • Lanjut tambahkan DDNS pada wifi router seperti gambar berikut ini.




  • Pada DDNS masukkan username dan password noip.com 
  • Lakukan port forwarding di 80 (wan dan lan) sehingga setiap yg masuk ke domain akan di routing forward menuju IP Wemo s8266. Jadi jangan sampai salah menambahkan IP wemos kamu.
  • Buka website seperti contoh dibawah ini : http://rumahnyo.ddns.net dan kini bisa mengontrol lampu dan mengetahui suhu dari luar rumah menggunakan jaringan GSM / Internet.










Cara ini adalah cara paling dasar untuk mempelajari IOT menggunakan wemos D1 R2, tujuannya agar mengerti prinsip dasarnya dan tidak bergantung pada platform siap pakai yg ada diluaran sana. Contohnya BLYNK yg sudah umum dipakai tugas IOT mahasiswa dengan library dan platform gratis, cukup menuliskan sebaris script pada sketch arduino dan kemudahan drag drop GUI pada smatphone.

Pada bagian selanjutnya kita akan kirim-kirim data menggunakan standar komunikasi IOT ke cloud yaitu MQTT - PUB SUB.





Share:

Wemos ESP8266 - Part 2 - Hello TCP / IP

 



Praktek kedua dari Wemos D1 R2 kali ini mulai membahas fungsi wifi dari ESP8266, yang merupakan modul wifi + GPIO (General Purpose Input Output) yang siap dipakai mengirimkan berbagai data ke sistem lain yg memerlukan menggunakan jalur TCP/IP atau kerennya internet. 

Sebelum kita lanjut pada prakteknya, kita perlu mengenal I/O pin yg dimiliki oleh wemos dan ada beberapa catatan yg sedikit berbeda dari modul arduino UNO yg berusaha dijiplak oleh Wemos D1.







Port atau pin pada wemos d1 r2 memiliki level logic 5 volt, ada 14 buah I/O yg sering dipakai dan 1 buah analog input untuk tegangan ADC (0-5 volt 10 bit). Penamaan pin nya ada 2 jenis dan umumnya dapat dilihat pada marking tulisan di sebelah portnya. Kalau dilihat dari atas maka Pin nya dinamakan D0 - D13 , sedangkan kalau di balik pada belakang board, nama markingnya ditulis sebagai GPIO X yang nilainya acak. Kadang ada library seperti DHT11 yg bisa menggunakan pin marking atas, namun sebaiknya agar mengikuti pola GPIO Arduino (marking bawah) seperti berikut :



  • D0 dan D1 = RX dan TX dari uart, jangan dipakai karena berhubungan dengan debug, kecuali memang terpaksa
  • D2 (GPIO 16) = Pin ini entah kenapa ter pull down (ada resistor didalamnya yg default GND) , jadi dihindari untuk komunikasi data semisal DHT 11
  • D3 - D10 ( GPIO lihat gambar) = Pin I/O yg aman digunakan
  • D11 - D13 = Terhubung dengan port SPI/programming, jadi kadang ada yg butuh dilepas saat download program dari sketch menuju wemos
  • D14 - D15 = jarang dipakai karena berhubungan dengan data Esp8266
  • A0 = Input analog untuk ADC


Pin I/O 14 terhubung LED pada tengah  board  wemos (marking led SCK)  dan Pin I/O  2 terhubung juga dengan LED pada  Modul ESP8266  sehingga kita dapat bermain-main seperti script dibawah atau menggunakannya untuk keperluan lain. Led pada Pin 14 aktif High sedangkan Led pada pin 2 aktif Low. 






#define LED1 14  //Led board wemos
#define LED2 2 //Led Esp 8266
void setup() {


 pinMode(LED1, OUTPUT);
 pinMode(LED2, OUTPUT);

}

void loop() {
  
 digitalWrite(LED1, LOW);
 digitalWrite(LED2, LOW);
 delay(1000);
 
 digitalWrite(LED1, HIGH);
 digitalWrite(LED2, HIGH);
 delay(1000);
  

}


Hasilnya seperti ini :


*) jika menggunakan LED diluar board, jangan lupa menambahkan resistor 220/330 ohm agar tidak jebol.


Okey kita cukupkan bermain LED yg menyilaukan mata ini, kita kembali ke inti dari tulisan yaitu kita akan melakukan komunikasi TCP ke perangkat lain yaitu Smrtphone. Untuk itu install aplikasi bernama TCP Terminal, atau aplikasi sejenis lainnya. Ini tidak terbatas pada aplikasi simulasi TCP terminal lainnya pada PC, tapi akan terlihat lebih keren pada smartphone.



Untuk koneksi wifinya bisa menggunakan 2 mode yaitu mode router di rumah  atau kata lain jika berlangganan indihome / firstmedia dan lain lain maka bisa memanfaatkan wifi dirumah. Atau jika kamu hanya menggunakan smartphone, maka gunakan fasilitas WIFI Hotspot / tethering  pada smartphone kamu.

Selanjutnya kita akan menjalankan TCP terminal dan memanfaatkannya sebagai TCP server seperti setting berikut :





Script dibawah ini saya buatkan dalam dua mode Router wifi di rumah atau Hotspot smartphone, buka tutup comment untuk menyesuaikan. Untuk kelancaran praktek, sebaiknya membaca dulu praktek DHT 11 di bagian sebelumnya  PART 1.



#include <ESP8266WiFi.h>  //library wifi
#include "DHT.h" //Library DHT 11

#define DHTPIN D7   // lib dht bisa menggunakan penamaan pin DX
#define DHTTYPE DHT11
  
DHT dht(DHTPIN, DHTTYPE);

const char* ssid = "nama wifi"; // Nama wifi yg dipakai
const char* password =  "password"; //  WiFi password

const char* host = "192.168.0.100"; // mode router, gunakan IP HP kamu
//String host="";  //mode Hotspot atau tethering smartphone
const uint16_t port = 4000; //port TCP

WiFiClient klien; 

void setup() {
  Serial.begin(9600);
  dht.begin();
 
  WiFi.begin(ssid, password);
 
  while (WiFi.status() != WL_CONNECTED) {
    delay(500);
    Serial.println("Terhubung ke WiFi..");
  }
    Serial.println("Koneksi WiFi Berhasil");

  Serial.println("");
  Serial.println("IP address: ");
//  host = WiFi.gatewayIP().toString(); //buka comment jika mode hotspot
  Serial.print("Host IP : ");
  Serial.println(host);
  Serial.print("Local IP : ");
  Serial.println(WiFi.localIP());
  
}


void SendTempHumid(){
  
 String datae ="";
  
  float h = dht.readHumidity();
  float t = dht.readTemperature();


   if (isnan(h) || isnan(t) ) {
    Serial.println(F("Failed to read from DHT sensor!"));
    return;
  }



datae+= F("Humidity: ");
datae+= String(h);
datae+= F("%  Temperature: ");
datae+= String(t); 
datae+= F(" °C") ;

Serial.println(datae);

  Serial.print("Terhubung ke ");
  Serial.print(host);
  Serial.print(':');
  Serial.println(port);

  Serial.println("...kirim data ke server..\n");
  

   if (!klien.connect(host, port)) {
    Serial.println("connection failed");
    delay(5000);
    return;
  }

  // kirim data TCP ke server
  if (klien.connected()) {
    klien.println(datae);
  }


}


void loop() {
 
SendTempHumid();
delay(5000);

}


Tampilan di monitor sketch kamu seperti ini :





Dan jika koneksi sukses maka pada smartphone kamu akan terkirim data pengukuran dari sensor suhu dan kelembaban DHT 11.



Praktek selanjutnya disini.

Share:

Kontak Penulis



12179018.png (60×60)
+628155737755

Mail : ahocool@gmail.com

Site View

Categories

555 (8) 7 segmen (3) adc (4) amplifier (2) analog (19) android (12) antares (8) arduino (26) artikel (11) attiny (3) attiny2313 (19) audio (5) baterai (5) blog (1) bluetooth (1) chatgpt (2) cmos (2) crypto (2) dasar (46) digital (11) dimmer (5) display (3) esp8266 (25) euro2020 (13) gcc (1) iklan (1) infrared (2) Input Output (3) iot (58) jam (7) jualan (12) kereta api (1) keyboard (1) keypad (3) kios pulsa (2) kit (6) komponen (17) komputer (3) komunikasi (1) kontrol (8) lain-lain (8) lcd (2) led (14) led matrix (6) line tracer (1) lm35 (1) lora (7) MATV (1) memory (1) metal detector (4) microcontroller (70) micropython (6) mikrokontroler (1) mikrokontroller (14) mikrotik (5) modbus (9) mqtt (3) ninmedia (5) ntp (1) paket belajar (19) palang pintu otomatis (1) parabola (88) pcb (2) power (1) praktek (2) project (33) proyek (1) python (7) radio (26) raspberry pi (4) remote (1) revisi (1) rfid (1) robot (1) rpm (2) rs232 (1) script break down (3) sdcard (3) sensor (2) sharing (3) signage (1) sinyal (1) sms (6) software (18) solar (1) solusi (1) tachometer (2) technology (1) teknologi (2) telegram (2) telepon (9) televisi (167) television (28) transistor (2) troubleshoot (3) tulisan (93) tutorial (108) tv digital (6) tvri (2) vu meter (2) vumeter (2) wav player (3) wayang (1) wifi (3)

Arsip Blog

Diskusi


kaskus
Forum Hobby Elektronika