Mengirim Data Sensor ke MYSQL Database dengan Nodemcu ESP8266

Hallo warrior ! Pada pertemuan ini kita akan coba membahas mengenai cara mengirim sebuah data sensor dari Nodemcu ESP8266 ke database MYSQL dan menampilkannya di database.

Dengan begini kamu dapat menyimpan seluruh data dari sensor dan menampilkannya langsung secara realtime di komputer yang sudah kamu siapkan.

Introduction

Perkembangan zaman yang begitu pesat memaksa kita untuk terus berpikir dan berinovasi akan teknologi yang tepat guna dan memberikan banyak manfaat kepada kita para manusia.

Salah satunya mungkin sebuah sistem yang dapat memberikan data secara realtime, guna memudahkan kita untuk memonitoring sistem irigasi atau tanaman yang kekurangan air dan butuh kita beri pupuk untuk kesuburannya.

Iliustrasi Petani Melakukan Monitoring di Laprop (src : pelitadesa)

Pada kesempatan ini kita akan coba melakukan sebuah percobaan dengan mengirimkan data dari sensor kelembaban tanah yang terhubung dengan esp8266 ke server yang sudah terinstall database mysql.

Dengan begitu nantinya esp8266 yang sudah terhubung ke server akan mengirimkan datanya melalui WiFi, lalu data tersebut akan diproses dan disimpan di database mysql. Data yang sudah tersimpan selanjutnya akan ditampilkan oleh webserver di komputer server maupun komputer lain yang terhubung ke server.

Ilustasi Pengiriman data sensor Nodemcu ke Server Database Mysql

Server yang sudah kita siapkan disini merupakan sebuah komputer yang sudah terinstall layanan webserver (apache/nginx) dan juga database server (mysql/mariadb dan phpmyadmin).

Jika kita belum memilikinya, kita dapat menggunakan aplikasi XAMPP yang dapat memeberikan komputer kita layanan webserver dan juga database server tersebut. Untuk penjelasan dan installasi terkait XAMPP dapat kalian baca pada artikel yang sebelumnya saya buat.

Baca Artikel : Mengenal XAMPP dan Cara Installasi XAMPP (Webserver dan Database Server).

Setelah aplikasi XAMPP sudah kita installkan di komputer, nantinya kita akan menjalankan membuat database dan membuat aplikasi web sederhana untuk menampilkannya.

Persiapan

Berikut merupakan beberapa perangkat yang perlu kita persiapkan pada praktek ini, diantaranya adalah sebagai berikut :

1. Nodemcu/ESP8266
2. Sensor kelembaban tanah
3. Komputer/Server yang sudah terinstall XAMPP

Rangkaian

Karena pada praktek ini kita menggunakan sensor kelembaban tanah, maka rangkaian yang kita pergunakan adalah sebagai berikut.

Rangkaian Nodemcu dengan Sensor kelembaban tanah

Rangkaian ESP12F dengan Sensor kelembaban tanah

Membuat Database baru

Hal pertama yang perlu kita lakukan setelah setelah menginstall XAMPP dan menjalankan beberapa hal dasarnya ialah membuat database baru, buka phpmyadmin lalu buat sebuah database dengan nama dbwarriornux.

Membuat Database baru

Setelah database berhasil dibuat, masuk kedalam tab SQL pada database tersebut lalu masukan script berikut untuk membuat sebuah table baru beserta isinya. Klik Go untuk melanjutkan.

1 2 3 4 5

CREATE TABLE datasensor ( id INT(6) UNSIGNED AUTO_INCREMENT PRIMARY KEY, data INT(10), `waktu` TIMESTAMP NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP )"

Membuat sebuah tabel baru pada database dbwarriornux

Setelah berhasil, maka hasilkan akan terlihat seperti dibawah ini. Terdapat 3 tabel baru sesuai yang sudah dibuat dalam script diatas.

Tampilan Database dan Table yang sudah dibuat

Maka dengan begini database sudah berhasil kita siapkan, selanjutnya kita akan buat sebuah web sederhana untuk menerima data dan menampilkan isi dari database mysql.

Halaman Penerima Data

Pada bagian ini kita akan mebuat sebuah halaman web php sederhana untuk menerima data sensor yang dikirimkan oleh nodemcu esp8266.

Pertama buat direktori baru dengan nama web-warriornux di htdoc dalam direktori XAMPP, setelah itu buat file dengan nama write-data.php lalu isikan program dibawah ini. Setelah itu Simpan.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19

<?php       //Variabel database     $servername = "localhost";     $username = "root";     $password = "";     $dbname = "dbwarriornux";       $conn = mysqli_connect("$servername", "$username", "$password","$dbname");       // Prepare the SQL statement          $result = mysqli_query ($conn,"INSERT INTO datasensor (data) VALUES ('".$_GET["data"]."')");              if (!$result)         {             die ('Invalid query: '.mysqli_error($conn));         }   ?>

Halaman Menampilkan Data

Selanjutnya setelah kita membuat halaman untuk menerima data, kita akan membuat halaman untuk menampilkan data yang sudah diterima dan disimpan di database mysql. Data yang ditampilkan nantinya akan berupa sebuah tabel sederhana.

Buat sebuah file baru dengan nama index.php didalam direktori web-warriornux, lalu isikan program berikut pada file tersebut.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66

<?php   require("koneksi.php"); // memanggil file koneksi.php untuk koneksi ke database ?>   <!DOCTYPE html> <html>   <head>   <meta http-equiv="refresh" content="5">   </head>     <body>       <style>         #wntable {           border-collapse: collapse;           width: 50%;         }           #wntable td, #wntable th {           border: 1px solid #ddd;           padding: 8px;         }           #wntable tr:nth-child(even){background-color: #f2f2f2;}           #wntable tr:hover {background-color: #ddd;}           #wntable th {           padding-top: 12px;           padding-bottom: 12px;           text-align: left;           background-color: #00A8A9;           color: white;         }       </style>         <div id="cards" class="cards" align="center">           <h1> Data Sensor Kelembaban Warriornux</h1>           <table id="wntable">           <tr>             <th>No</th>             <th>Data</th>             <th>Waktu</th>           </tr>           <?php             $sql = mysqli_query($koneksi, "SELECT * FROM datasensor ORDER BY id DESC");             if(mysqli_num_rows($sql) == 0){             echo '<tr><td colspan="14">Data Tidak Ada.</td></tr>'; // jika tidak ada entri di database maka tampilkan 'Data Tidak Ada.'           }else{ // jika terdapat entri maka tampilkan datanya             $no = 1; // mewakili data dari nomor 1             while($row = mysqli_fetch_assoc($sql)){ // fetch query yang sesuai ke dalam array               echo '               <tr>                 <td>'.$no.'</td>                 <td>'.$row['data'].'</td>                 <td>'.$row['waktu'].'</td>               </tr>               ';               $no++; // mewakili data kedua dan seterusnya             }           }           ?>         </table>       </div>   </body> </html>

Halaman Koneksi Database

Halaman yang kita buat sebelumnya adalah halaman untuk menampilkan saja, ada satu bagian yang berfungsi untuk menghubungkan halaman penampil data dengan database mysql yaitu yang akan kita buat sekarang.

Masih didalam direktory yang sebelumnya, buat sebuah file baru dengan nama koneksi.php lalu isikan dengan program berikut.

1 2 3 4 5 6 7 8 9 10 11 12 13 14

<?php   //Variabel database     $servername = "localhost";     $username = "root";     $password = "";     $dbname = "dbwarriornux";   $koneksi = mysqli_connect($servername, $username, $password, $dbname); // menggunakan mysqli_connect   if(mysqli_connect_errno()){ // mengecek apakah koneksi database error echo 'Gagal melakukan koneksi ke Database : '.mysqli_connect_error(); // pesan ketika koneksi database error } ?>

Sketch Program ESP8266

Setelah web sederhana untuk menerima dan menampilkan data sudah kita buat, sekarang giliran nodemcu esp8266 yang kita program. Silahkan modifikasi, compile dan upload program berikut dibawah ini.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85

/* * Program From www.warriornux.com */   #include <ESP8266WiFi.h>   //Konfigurasi WiFi const char *ssid = "warriornux.com"; const char *password = "c0c0d0tb4u";   //IP Address Server yang terpasang XAMPP const char *host = "192.168.43.96";   void setup() {   Serial.begin(115200);      WiFi.mode(WIFI_STA);   WiFi.begin(ssid, password);   Serial.println("");     Serial.print("Connecting");   while (WiFi.status() != WL_CONNECTED) {     delay(500);     Serial.print(".");   }     //Jika koneksi berhasil, maka akan muncul address di serial monitor   Serial.println("");   Serial.print("Connected to ");   Serial.println(ssid);   Serial.print("IP address: ");   Serial.println(WiFi.localIP()); }   int value = 0;   void loop() {   // Proses Pengiriman -----------------------------------------------------------   delay(1000);   ++value;     // Membaca Sensor Analog -------------------------------------------------------   int datasensor=analogRead(A0);   Serial.println(datasensor);     Serial.print("connecting to ");   Serial.println(host);   // Mengirimkan ke alamat host dengan port 80 -----------------------------------   WiFiClient client;   const int httpPort = 80;   if (!client.connect(host, httpPort)) {     Serial.println("connection failed");     return;   }   // Isi Konten yang dikirim adalah alamat ip si esp -----------------------------   String url = "/web-warriornux/write-data.php?data=";   url += datasensor;     Serial.print("Requesting URL: ");   Serial.println(url);   // Mengirimkan Request ke Server -----------------------------------------------   client.print(String("GET ") + url + " HTTP/1.1\r\n" +                "Host: " + host + "\r\n" +                "Connection: close\r\n\r\n");   unsigned long timeout = millis();   while (client.available() == 0) {     if (millis() - timeout > 1000) {       Serial.println(">>> Client Timeout !");       client.stop();       return;     }   }   // Read all the lines of the reply from server and print them to Serial   while (client.available()) {     String line = client.readStringUntil('\r');     Serial.print(line);   }     Serial.println();   Serial.println("closing connection"); }

Sesuaikan SSID dan Password dari Wifi yang kalian gunakan, pada bagian atas ada IP Address Server XAMPP yang merupakan alamat penerima data yang akan di transfer dari nodemcu.

Untuk mengetahui IP Address dari komputer kalian yang sudah terinstall XAMP, kalian dapat membuka cmd/command prompt di windows dan ketikan ipconfig. Atau jika kalian menggunakan linux bisa jalan kan ifconfig, maka disana akan terlihat IP yang kalian gunakan.

Hasil Percobaan

Setelah serangkain tahap demi tahap sudah kalian lakukan, sekarang kita coba lihat hasilnya. Jiak komunikasi dan pengiriman data berhasil dilakukan maka console arduino IDE akan terlihat seperti berikut.

Hasil Pengiriman Data Berhasil dari Nodemcu ESP8266

Jika kita membuka dan melihat isi database didalam phpmyadmin, akan terlihat beberapa data yang sudah masuk seperti berikut.

Database yang sudah terisi data

Terakhir kita dapat lihat hasilnya di web sederhana yang sudah kita buat tadi, buka localhost lalu lihat datanya akan tampil seperti gambar berikut.

Data sensor ditampilan di Web Sederhana

Dengan begini kita dapat melihat web sederhana menampilkan data dari sensor yang dikirimkan melalui nodemcu esp8266 dan tersimpan langsung di database mysql secara realtime.

Bagi kalian yang sudah memiliki basic sebagai developer mungkin dapat mengubah halaman penampil data mysql menjadi lebih menarik dan interaktif lagi, karena memang web penampil pada artikel ini terlihat cukup sederhana.

Kesimpulan

Setelah kita melakukan serangkaian percobaan diatas kita dapat menyimpulkan bahwa untuk membangun sebuah sistem pengiriman data yang realtime kita memerlukan penampung data yaitu database mysql.

Dan untuk menampilkan data tersebut kita membutuhkan web sederhana yang sudah terinstall di webserver dan terkoneksi langsung dengan database. Semua dapat dijalankan dengan aplikasi XAMPP sebagai host untuk webserver dan database server.

Sehingga nantinya nodemcu esp8266 dapat mengirimkan data sensornya ke server host yang sudah terinstall webserver dan juga database server.