Membuat Web Server I/O dengan Arduino

Dengan Arduino kita dapat membuat sebuah web server sederhana semacam Apache, Nginx,  Mongoose, dll. Tentunya dengan skala yang terbatas. Web server dengan Arduino ini banyak dimanfaatkan untuk meng-interface-kan perangkat I/O melalui protokol TCP/IP. Untuk media jaringannya, tergantung kebutuhan, bisa melalui jaringan intranet (LAN) maupun internet. Sekali lagi, tergantung kebutuhan, sehingga topologi jaringannya pun menyesuaikan dengan kebutuhan tersebut.

Untuk membuat web server I/O dengan Arduino, Anda membutuhkan tambahan modul Ethernet atau WIFI. Bentuknya dapat berupa ‘shield’ (Ethernet shield atau WIFI shield) maupun berupa modul (Ethernet/WIFI module). Kalau bentuknya berupa shield, Anda dapat langsung menancapkannya ke Arduino Uno, tapi jika bentuknya modul Anda harus mengkoneksikan keduanya dengan beberapa kabel jumper. Untuk tutorial kali, kita akan menggunakan sebuah Ethernet shield sebagai jembatan antara Arduino (Uno) dengan dunia TCP/IP.

Alat dan Bahan Web Server – Arduino

  1. Arduino Uno (versi SMD harga 45.500 beli di sini, versi DIP harga65.000 beli di situ)
  2. Ethernet Shield (harga 73.500 beli di sini)
  3. Kabel jumper Male to Male (1 buah) – beli di sini

[AdSense-A]

Tujuan Percobaan

Membuat web server I/O sederhana dengan Arduino dan Ethernet shield. Jika ada input pada pin 2 terbuka atau tertutup akan menampilkannya pada web, dan dapat dibuka melalui web server.

Gambar Rangkaian Web Server – Arduino

web server io sederhana dengan arduino

Gambar rangkaiannya sederhana aja bukan? cukup menggunakan ethernet shield dan satu jumperan kabel ke pin 2. Jumperan ini sebenarnya hanya untuk membedakan saat pin 2 ber-logic ‘1’ atau ‘0’ dengan menghubungkannya ke 5V atau ke ground.

Sketch

Jika hardware sudah siap, upload-lah sketch berikut ke Arduino

/*
Web Server I/O sederhana dengan Arduino dan ethernet shield
*/

#include <SPI.h>
#include <Ethernet.h>
byte mac[] = {0xDE, 0xAD, 0xBE, 0xE2, 0xF1, 0xED };
IPAddress ip(192,168,27,177);

EthernetServer server(80);
String HTTP_req;

int ind1 = 0;

void setup() {
// Open serial communications and wait for port to open:
Serial.begin(9600);
while (!Serial) {
}

Ethernet.begin(mac, ip);
server.begin();
Serial.print("IP server ");
Serial.println(Ethernet.localIP());
pinMode(2, INPUT_PULLUP);
digitalWrite(2, LOW);
}

void loop() {
//cek indikator
ind1 = digitalRead(2); 

// listen for incoming clients
EthernetClient client = server.available();
if (client) {
Serial.println("new client");
// an http request ends with a blank line
boolean currentLineIsBlank = true;
while (client.connected()) {
if (client.available()) {
char c = client.read();
HTTP_req += c;
Serial.write(c);
if (c == '\n' && currentLineIsBlank) {
client.println("HTTP/1.1 200 OK");
client.println("Content-Type: text/html");
client.println("Connection: close"); 
client.println("Refresh: 5"); // refresh page tiap 5 detik
client.println();
client.println("<!DOCTYPE HTML>");
client.println("<html>");
client.println("<H1>");
client.println("Web Server IO dengan Arduino");
client.println("</H1>");
client.println("<br />");
//tampilkan indikator
client.println("Indikator1 : ");
client.println(ind1);
client.println("<br />");
client.println("<br />");

client.println("</html>");
HTTP_req = "";
break;
}
if (c == '\n') {
currentLineIsBlank = true;
} 
else if (c != '\r') {
currentLineIsBlank = false;
}
}
}
delay(100);
client.stop();
Serial.println("client disonnected");

}
}

Pengujian Web Server dengan Arduino

Untuk menguji hardware dan software yang sudah tertanam di Arduino (firmware), hubungkan laptop dengan Ethernet shield melalui kabel LAN (straight). Set IP address laptop dalam satu class dengan IP Arduino. Perhatikan baris 8 pada sketch di atas. IP Arduino adalah 192.168.27.177, maka coba kita set IP laptop menjadi 192.168.27.178. Dengan demikian antara laptop dan Arduino sudah berada dalam satu class IP dan bisa langsung berkomunikasi. Apakah jika beda class IP, kedua device bisa berkomunikasi? Jawabannya bisa saja, namun Anda akan membutuhkan sebuah router untuk mentranslasikan arah komunikasi data.

Kembali ke pengujian kita, untuk sekedar memastikan apakah antara laptop dan Arduino sudah terhubung secara jaringan (LAN), buka jendela command prompt melalui menu Start, dan di kotak search tulis ‘cmd’ [enter]. Berikutnya ping IP Arduino dengan perintah ‘ping 192.168.27.177’ Jika ada reply dari Arduino berarti kedua device sudah terhubung.

Berikutnya buka web browser di laptop Anda, dan ketik IP Arduino yaitu 192.168.27.177. Sesaat kemudian seharusnya akan muncul tampilan seperti gambar di bawah

membuat-web-server-io-dengan-arduino

Kemudian coba jumper pin 2 ke pin GND dan ke pin 5V di Ethernet shield. Perhatikan tampilan di web browser, seharusnya akan berubah-ubah sesuai input yang Anda berikan di pin 2.

Jika menggunakan ethernet shield, maka pin 10, 11, 12, 13 tidak dapat Anda gunakan sebagai pin digital I/O biasa, karena sudah digunakan untuk interfacing dengan ethernet shield melalui protokol SPI.

Selamat, Anda sudah berhasil membuat web server I/O sederhana dengan Arduino. Sekarang tinggal ide Anda, mau dikembangkan seperti apa? Selamat berkreasi….

[AdSense-A]

0 0 votes
Article Rating

Leave a Reply

29 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
Hendrik

saya mau buat judul skripsi tentang sistem informasi debit air dengan arduino uno dan web server, itu mungkin bisa gak di gabungkan antara sensor debit air dengan web servernya

Hendrik

Apa saya harus upload dulu buat sett web server, baru sensor nya?
Apa abang punya coding untuk sett sensor water flow?

Hendrik

Kalau boleh tau keywordnya untuk search apa ya?
Mohon bantuannya

Nudin

Oya mas, kan *hendrik, kan tadi bikin sistem informasi debit air menggunakan web server, apakah kita harus buat webnya juga atau webnya otomatis ada setelah kita udah sketch, makasih

winata

salam kenal mas, saya mau nanya bagai mana cara membuat atau mendesain tampilan web servernya agar lebih menarik, contohnya menambahkan foto atau dan mengganti background, terimakasih mas.

winata

tutorial nya tlg dong mas untuk yang di ethernet shield biar bisa belajar.

Andri Nusantara Putra

Salam kenal mas ajie.
Mau tanya? Untuk coding arduinonya bagaimana ya dan cara menyambungkannya ke hosting saya?

robert

mas salam kenal..

mau tanya mas gabungin sketch web server dan sensor handling bagai mana yaa,,
cobak berikan contoh 1 codding gabungannya mas…
terima kasih

aditya petra

salam kenal mas.. itu dapat IP buat arduinonya darimana ya?

Wahid

assalamu’alaikum mas,
artikel mas sangat menarik, dan saya ingin membuat sesuatu dengan arduino dan juga internet.
Jadi gini mas, saat tugas akhir, saya ingin membuat thermohygrometer berbasis sms untuk notifikasi, serta pada web ada kalkulasi suhu dan kelembaban dalam bentuk grafik, kira kira apa aja yaa yg saya butuhin mas ?
terima kasih sudah mau membantu mas.

Wahid

ooo iya, kalo buat internet gitu bisa pakai modem yg bisa dibawa” gk mas ?
jadi alat thermohygronya bisa lebih portable

Rangga Adi Hasbi

assalamualaikum ,bang ngerti pake modul sim 900a/800l kirim data ke srver pake gprs

HaritsMohd

Waduh mas, ini blog luar biasa keren, luar biasa juga yang numpang iklan ya.. jadi susah baca tulisan mas Ajie, ketutup iklan..

agnes

bisa ajarkan saya ngoding mas ?

wahyu

izin bertanya, saya sudah ngikutin tutorial diatas dan saya ping ip arduino mengunakan cmd terhubung, tapi ketika saya buka di mozila tidak bisa tulisan “unable connect”

Terima kasih sebelumnya

29
0
Would love your thoughts, please comment.x
()
x