Anda di sini

Pemrograman

[Tutorial] Langkah-Langkah Implementasi Metode Internet of Things (IoT) Untuk Menciptakan Perangkat Tepat Guna Dengan Node MCU ESP-12E dan CloudMQTT

Agus Ady Aryanto - 06 November 2016 19:01:27 10

Internet of Things memiliki sistem kerja dengan memanfaatkan sebuah argumentasi pemrograman, dimana tiap-tiap perintah argumennya itu menghasilkan sebuah interaksi antara sesama mesin yang terhubung secara otomatis tanpa campur tangan manusia dan dalam jarak berapapun. Internetlah yang menjadi penghubung di antara kedua interaksi mesin tersebut, sementara manusia hanya bertugas sebagai pengatur dan pengawas bekerjanya alat tersebut secara langsung. Banyak manfaat yang didapatkan dari internet of things. Pekerjaan yang kita lakukan menjadi cepat, mudah, dan efisien. Kita juga bisa mendeteksi pengguna dimanapun ia berada. Berikut adalah alur kerja dari Metode Internet of Things :

Gambar 1 : Alur Metode Internet of Things

Message Queuing Telemetry Transport (MQTT) adalah protokol yang berjalan diatas TCP/IP. Cara kerjanya hampir sama dengan client server dengan penamaan yang lebih dikenal sebagai istilah publish - subcribe pada protokol ini.

Gambar 2 : Protokol MQTT

OK...itu sedikit pengenalan saja mengenai apa saja yang terlibat dalam eksperimen kali ini. Berikutnya mari kita mulai melangkah dengan tahapan seperti berikut ini :

Install Board NodeMCU ESP-12E Pada Arduino IDE

  • Buka Arduino IDE (Gunakan versi Terbaru)

  • Berikutnya pilih Tools - Board - Boards Manager.

  • Kemudian silahkan cari ESP8266 pada form search dan diisntall. Saat menginstall Board, perhatikan versinya yang akan diinstall karena akan berpengaruh dengan Arduino Idenya, Disini saya install versi terlama.

  • Jika berhasil instal akan terlihat board NodeMCU 12E seperti ini :

  • Selesai...

Ok..untuk installasi board NodeMCU pada Arduino IDE sudah selesai, berikutnya kita akan membuat sebuah Broker untuk menampung data yang di publish maupun permintaan subcribe melalui protokol MQTT.

Broker yang akan kita gunakan yaitu https://www.cloudmqtt.com/ yang disediakan gratis maupun berbayar. Tentu kalau kita membuat akun yang gratis pastinya memiliki beberapa keterbatasan, namun akun yang gratis ini sudah cukup untuk sekedar eksperimen dalam cakupan pendidikan saja. Baik kita langsung saja membuat akun di web ini dengan cara seperti berikut ini :

Membuat Akun pada CloudMQTT

  • Dan akan dibawa ke halaman login. Jika belum membuat akun, silahkan buat akun dengan memasukan email dan lakukan verifikasi.

  • Klik verifikasi email dan lengkapi identitas akun.

  • Jika sudah melengkapi identitas, akan dibawa ke halaman utama dari akun.

  • Selanjutnya buat sebuah contoh broker dengan memilih menu Create pada halaman utama akun

silahkan lengkapi form yang diminta seperti nama, letak dataya dan jenis akunnya. Pada pemilihan jenis akunnya ada yang berbayar ada yang gratis, untuk yang gratis bisa dipilih Cute Cat, dengan keterbatasan koneksi yang dimiliki untuk akun jenis ini..

  • Detail akun yang telah dibuat.

  • Sampai sini akun sudah dapat digunakan, sekarang coba untuk meng-testnya melihat tampilan informasi dari perangkat sensor secara langsung dengan memilih menu Websocket UI.

Pada halaman ini bisa digunakan untuk melakukan komunikasi. Sebagai contoh coba dibagian send message masukan topik (publish) yaitu ("/led") dengan dikuti pesananya di form Message seperti yang terlihat pada gambar diatas jika pesan berhasil dikirim maka akan diterima pada bagian Receieved Messages.

  • Selesai...

Sampai sini beberapa persiapan sudah terselesaikan, berikutnya mari kita kembali pada pemrograman untuk NodeMCU 12E dengan Arduino IDE. Berikut ini tahapannya :

  • Merangkai Skematika Alat

  • Kode Program Arduino
#include <ESP8266WiFi.h>
#include <PubSubClient.h>

const char *ssid =  "";   // nama ssid dari wi-fi, jangan lebih dari 32 karakter
const char *pass =  "";   // password dari wi-fi

//------------------------------ Konfigurasi server pada https://www.cloudmqtt.com/ 
// perhatikan akun CloudMQTT yang telah dibuat, kemudian pastikan konfigurasi yang diperlukan ini, sama dengan akun yang anda miliki.
const char *mqtt_server = "";
const int mqtt_port = ;
const char *mqtt_user = "";
const char *mqtt_pass = "";
//------------------------------ End Konfigurasi server pada https://www.cloudmqtt.com/

//deklarasi variabel untuk led 
int led = 16;
int led2 = 4;

//deklarasi konfigurasi server
WiFiClient wclient;
PubSubClient client(wclient, mqtt_server, mqtt_port);

//------------------------------ fungsi untuk menerima nilai balik (subcribe)
void callback(const MQTT::Publish& pub) {
  if(pub.payload_string() == "1")
  {
    digitalWrite(led, HIGH);
    client.publish("/led/state", "Lampu Hidup");
  }
  else if(pub.payload_string() == "0")
  {
    digitalWrite(led, LOW);
    client.publish("/led/state", "Lampu Mati");
  }
 
  Serial.println(pub.payload_string()); 
}
//------------------------------ End fungsi untuk menerima nilai balik (subcribe)

void setup() {
  // Setup console
  Serial.begin(115200);
  delay(10);
  Serial.println();
  Serial.println();
  pinMode(led, OUTPUT);
  pinMode(led2, OUTPUT);
}

void loop() {
  //----------------------------- cek apakah wi-fi sudah tersambung
  if (WiFi.status() != WL_CONNECTED) {
    Serial.print("Connecting to ");
    Serial.print(ssid);
    Serial.println("...");
    WiFi.begin(ssid, pass);

    if (WiFi.waitForConnectResult() != WL_CONNECTED)
      return;
    Serial.println("WiFi connected");
  }
  //----------------------------- End cek apakah wi-fi sudah tersambung

  //----------------------------- cek apakah ESP sudah tersambung dengan server
  if (WiFi.status() == WL_CONNECTED) {
    if (!client.connected()) {
      Serial.println("Connecting to MQTT server");
      if (client.connect(MQTT::Connect("arduinoClient2").set_auth(mqtt_user, mqtt_pass))) {
        Serial.println("Connected to MQTT server");
        client.set_callback(callback);
        client.subscribe("/led");
        client.publish("/led/state", "0");
      } else {
        Serial.println("Could not connect to MQTT server");   
      }
    }
    //----------------------------- cek apakah ESP sudah tersambung dengan server

    if (client.connected())
      client.loop();
  }
}

  • Kode WEB

Untuk code webnya dapat anda download dibawah. Namun, perlu dijelaskan sedikit pada file websocket.js -nya diperlukan konfigurasi akun yang sama pada https://www.cloudmqtt.com/ seperti dibawah ini :

//================================== START Bagian yang perlu diperhatikan untuk dikonfigurasi dengan Akun Cloud MQTT ================
//membuat client baru
  client = new Paho.MQTT.Client("host", port ,"learn_" + parseInt(Math.random() * 100, 10)); 
  

  // deklarasi beberapa variabel untuk menghandle proses login
  client.onConnectionLost = onConnectionLost;
  client.onMessageArrived = onMessageArrived;
  var options = {
    useSSL: true,
    userName: "",   // username akun cloudmqtt.com
    password: "",    // password akun cloudmqtt.com
    onSuccess:onConnect,
    onFailure:doFail
  }
//================================== END Bagian yang perlu diperhatikan untuk dikonfigurasi dengan Akun Cloud MQTT ================


  // connect the client
  client.connect(options);
  
  // fungsi jika client berhasil terhubung dengan server
  function onConnect() {
      console.log("onConnect");
      
      //sebagai subscribe
      client.subscribe("/led/state");
      
      //sebagai publisher
      // message = new Paho.MQTT.Message("-");
      // message.destinationName = "/cloudmqtt";
      // client.send(message); 
  }
  
  function doFail(e){
    console.log(e);
  }

  // fungsi jika client dan server gagal terhubung
  function onConnectionLost(responseObject) {
      if (responseObject.errorCode !== 0) {
        console.log("onConnectionLost:"+responseObject.errorMessage);
      }
  }

  // fungsi yang digunakan untuk menerima pesan (pesan dari ESP)
  function onMessageArrived(message) {
      console.log("onMessageArrived:"+message.payloadString);
      document.getElementById("messangeSubcribe").innerHTML = message.payloadString;
  }  
     
  // fungsi untuk mengirimkan pesan ke ESP
  function onPublishMessage(topic, message)
  {
      message = new Paho.MQTT.Message(message);
      message.destinationName = topic;
      client.send(message);
  }
  • Selesai

*Catatan

  1. Untuk library ESP12E dan MQTT pada Arduino IDE sudah dilampirkan serta semua kode arduino dan web secara lengkap.
  2. Diperlukan sebuah hostingan untuk menaruh WEB-nya karena brokernya bersifat online.

5.932
Image

Agus Ady Aryanto

Profil pujangga Komang Agus Ady Aryanto belum tersedia.

Komentar

setelah data dapat ditampilkan di cloudmqtt, dan akan disimpan di web secara real time. apakah hanya memasukan codingan websocket.js ? atau ada proses proses lain seperti install paho dan lain lain ? terimakasih mohon bantuannya

Halo,

Kalau tujuannya untuk menyimpan data dari interface web maka sudah cukup menggunakan lib websocket.js. Setahu saya lib paho dll untuk versi PHP yang menggunakan server side.

HTSL://HIGH THINKING SIMPLE LIVING . ME

terimakasih atas responnya. namun disini saya masih belum begitu paham atas penggunaan payloadstring pada : document.getElementById("messangeSubcribe").innerHTML = message.payloadString; . Dikarenakan saya ingin mempublish hasil temperature di web saya sendiri.

bagaimana menurut mas ? terimakasih

Halo,

kalau websocket dari MQTT biasanya format data yg dikirim sama dia adalah javascript object (message), untuk akses datanya dalam format string harus panggil langsung message.payloadString. Kalau tidak yakin bisa di tambahkan console print, misal: console.log(message.payloadString); ntar akan kelihatan isi datanya apa di web browser console (CTRL + SHIFT + J di google chrome).

Kalau document.getElementById("messangeSubcribe").innerHTML = message.payloadString; maksudnya datanya akan dimasukan di bagian <div id="messageSubscribe">[muncul disini]</div> pada HTML web mu.

HTSL://HIGH THINKING SIMPLE LIVING . ME

Terima kasih banyak atas responnya. saya sudah semakin paham.

tapi ternyata terdapat kendala lagi, saat saya menjalankan terkadang connection lost dikarenakan socket closed. bagaimana cara untuk otomatis reconnect ke socket ? terima kasih banyak

Halo,

Untuk bisa auto reconnect saat connection lost caranya sangat gampang, kamu bisa pakai library ini: https://github.com/joewalnes/reconnecting-websocket

Cara pakainya ada di README nya silahkan dibaca, apabila ada kendala bisa diskusi lagi disini.

Selamat mencoba Emo 30

terima kasih ya atas responnyaa. saya coba dulu . kalau ada kendala nanti saya bertanya lagi .

Terima kasih Smile

Makyus,

saya juga pakai itu library sebagai wrapper untuk auto reconnect websocket saat connection lost. Mantep banget

HTSL://HIGH THINKING SIMPLE LIVING . ME

Terimakasih atas bantuannya . Saya sudah bisa menampilkan grafik dan juga menyimpan ke database dari cloudmqtt > javascript . Namun disini saya mengalami kesulitan kembali, apakah ada cara untuk menyimpan ke mysql dari cloudmqtt tanpa harus dijalankan di web terlebih dahulu ?

Terimakasih Good

Halo,

kalau untuk simpan data tanpa buka interface web tidak dimungkinkan, karena pada dasarnyakan kode programnya jalan di web browser (JavaScript).

Tapi kalau aplikasinya dibuat tidak berbasis web, misal menggunakan Python atau bahasa lainnya bisa saja, tinggal buat menggunakan API yg telah disediakan oleh MQTT. Cuma untuk bisa terus simpan data tetap saja harus ada aplikasi yg berjalan untuk melakukan itu.

Begitu kira-kira Biggrin

HTSL://HIGH THINKING SIMPLE LIVING . ME

Mari Gabung

Halo Emo 51 , Ada yang ingin disampaikan? Jangan sungkan untuk gabung diskusi ini. Silahkan Login dulu atau Daftar baru.