Hallo Warrior, pada pembahasan ini kita akan membahas tutorial bagaimana membuat sebuah webpage webserver internal pada ESP8266. Dimana nantinya kita dapat memanggil alamat ip dari ESP8266 di browser dan menampilkan halaman webpage didalamnya.
Introduction
Web Server merupakan layanan yang berfungsi sebagai penerima permintaan yang dikirimkan melalui browser, kemudian memberikan tanggapan permintaan dalam bentuk halaman situs web (webpage) atau lebih umumnya dalam dokumen HTML.
Saat mengambil halaman website, browser akan mengirimkan permintaan ke alamat server yang dituju, kemudian HTTP request akan dikirimkan ke web server lalu diproses. Setelah itu webserver mengirimkan HTTP Respon ke browser dan memprosesnya menjadi halaman situs web. Jika diilustrasikan maka akan seperti gambar dibawah ini.

Praktek
Persiapan Perangkat
Pada praktek ini kita hanya perlu menyiapkan perangkat NodeMCU atau ESP8266series lainnya untuk digunakan.
Sketch Program
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 | #include <ESP8266WiFi.h> #include <ESP8266WebServer.h> const char* ssid = "jenamonster"; // Nama SSID AP/Hotspot const char* password = "1234567890"; // Password Wifi ESP8266WebServer server(80); //Menyatakan Webserver pada port 80 void setup() { Serial.begin(115200); delay(10); // Connect to WiFi network ------------------------------------------------ Serial.println(); Serial.println(); Serial.print("Connecting to "); Serial.println(ssid); // Mengatur WiFi ---------------------------------------------------------- WiFi.mode(WIFI_STA); // Mode Station WiFi.begin(ssid, password); // Mencocokan SSID dan Password while (WiFi.status() != WL_CONNECTED) { delay(500); Serial.print("."); } // Print status Connect --------------------------------------------------- Serial.println(""); Serial.println("WiFi connected"); Serial.println("IP address: "); Serial.println(WiFi.localIP()); // Membuat tampilan Webpage ----------------------------------------------- server.on("/", []() { server.send(200, "text/plain", "Hello Para Warrior IoT"); }); // Bagian ini opsional jika ingin membuat page lain ---------------------- server.on("/status", []() { server.send(200, "text/plain", "Ini adalah Page Status Aktif"); }); server.begin(); Serial.println("Webserver dijalankan"); } void loop() { server.handleClient(); } |
Setelah itu compile dan upload program pada perangkat NodeMCU/ESP8266 yang akan kalian jadikan web server. Program webserver ini berjalan sebagai web server station.
Hasil Percobaan
Serial Monitor
Setelah Program berhasil di upload, selanjutnya kita buka serial monitor untuk melihat IP Address yang dimiliki oleh perangkat NodeMCU/ESP8266 Seperti berikut.

Alamat IP diatas akan berubah-ubah setiap 3 hari sekali, apabila kalian ingin memastikan IP Addressnya fix maka kalian dapat mengunjungi tutorial berikut : Static IP Address ESP8266.
Browser
Selanjutnya untuk mengakses webpage pada webserver, kita hanya perlu membuka browser pada komputer/smartphone yang terkoneksi pada jaringan wifi yang sama. Selanjutnya panggil alamat IP yang ada pada serial monitor tadi.

Selanjutnya kita coba mengakses webpage yang lain, yaitu status. Kita hanya perlu menambahkan /status pada ujung alamat ip addressnya, hasilnya akan seperti berikut.

Kesimpulan
Dari hasil percobaan yang sudah kita lakukan, dapat kita lihat bahwa perangkat ESP8266 dapat membuat sebuah web server internal dan menampilkan webpage yang dapat kita akses melalui browser. Kita dapat membuat lebih dari satu halaman dalam webserver tersebut.
Referensi
- https://www.niagahoster.co.id/blog/web-server-adalah/
- Example Program Library ESP8266
Artikel Terkait
- Pengertian Modul Wifi ESP8266 - January 5, 2021
- Setup Desktop GUI di Instance GCP - December 25, 2020
- Menjalankan Aplikasi Android di Ubuntu 16.04 Menggunakan ARChon - December 20, 2020