Menghidupkan dan Mematikan Relay 4 Channel dengan NodeMCU / ESP8266 Sebagai Acces Point
 |
| Tampilan WebServer |
Membuat Web Server dengan NodeMCU dan 4 Relay
NodeMCU adalah board berbasis ESP8266 yang sangat populer untuk proyek IoT. Dalam artikel ini, kita akan membahas cara membuat web server menggunakan NodeMCU sebagai akses point dan mengontrol 4 relay dengan logika invers (relay aktif saat pin berlogika false). Relay ini dapat digunakan untuk mengontrol perangkat listrik seperti lampu, kipas angin, dan sebagainya.
Alat dan Bahan
1. NodeMCU (ESP8266)
2. 4 Relay Module 5V
3. Breadboard dan Jumper Wires
4. Sumber Daya 5V
5. Komputer dengan Arduino IDE
6. Koneksi Wi-Fi (jika diperlukan)
Skema Rangkaian
Berikut adalah skema sederhana untuk menghubungkan NodeMCU dengan relay:
- Relay 1: D1
- Relay 2: D2
- Relay 3: D3
- Relay 4: D4
 |
| Wiring , Vcc dan Gnd sambungkan ke 5V (Max Voltage) 2A (minimal current) |
Koneksi:
- Hubungkan pin D1-D4 dari NodeMCU ke IN1-IN4 pada modul relay.
- Hubungkan GND dari NodeMCU ke GND pada modul relay.
- Hubungkan VCC dari modul relay ke sumber daya 5V.
Kode Program
Berikut adalah contoh kode untuk mengatur NodeMCU sebagai web server dan mengontrol relay:
#include <ESP8266WiFi.h>
#include <ESP8266WebServer.h>
const char* ssid = "Your_SSID"; // Ganti dengan SSID Anda
const char* password = "mypasswordxyz"; // Ganti dengan password Anda
ESP8266WebServer server(80);
// Definisi pin relay
const int relay1Pin = D1;
const int relay2Pin = D2;
const int relay3Pin = D3;
const int relay4Pin = D4; //Builtin_LED_Onboard
bool relayStates[4] = {false, false, false, false}; // Status awal relay
void setup() {
Serial.begin(115200);
pinMode(relay1Pin, OUTPUT);
pinMode(relay2Pin, OUTPUT);
pinMode(relay3Pin, OUTPUT);
pinMode(relay4Pin, OUTPUT);
digitalWrite(relay1Pin, HIGH); // Matikan semua relay
digitalWrite(relay2Pin, HIGH);
digitalWrite(relay3Pin, HIGH);
digitalWrite(relay4Pin, HIGH);
WiFi.softAP(ssid, password);
Serial.println("Access Point siap. IP Address: ");
Serial.println(WiFi.softAPIP());
// Menetapkan route untuk homepage
server.on("/", handleRoot);
// Menetapkan route untuk mengontrol relay
server.on("/relay", handleRelay);
server.begin();
}
void loop() {
server.handleClient(); // Menangani klien
}
void handleRoot() {
String html = "<!DOCTYPE HTML><html>";
html += "<head><meta name='viewport' content='width=device-width, initial-scale=1'>";
html += "<style>body { font-family: Arial, sans-serif; background-color: #e3f2fd; margin: 0; padding: 20px; }";
html += "h1 { color: #333; text-align: center; } .container { max-width: 600px; margin: auto; }";
html += ".relay { background: white; border-radius: 10px; padding: 15px; margin: 10px 0; box-shadow: 0 2px 10px rgba(0,0,0,0.1); text-align: center; }";
html += ".status { font-size: 1.2em; margin: 10px 0; } .on { color: green; } .off { color: red; }";
html += "a { text-decoration: none; color: white; padding: 10px 15px; border-radius: 5px; }";
html += ".btn-on { background-color: #4caf50; } .btn-off { background-color: #f44336; }</style>";
html += "</head><body><div class='container'><h1>Kontrol Relay</h1>";
// Menampilkan status setiap relay
for (int i = 0; i < 4; i++) {
html += "<div class='relay'>Relay " + String(i + 1) + "<div class='status'>Status: ";
html += relayStates[i] ? "<span class='on'>ON</span>" : "<span class='off'>OFF</span>";
html += "</div><a class='btn-on' href=\"/relay?num=" + String(i) + "&state=on\">Hidupkan</a> ";
html += "<a class='btn-off' href=\"/relay?num=" + String(i) + "&state=off\">Matikan</a></div>";
}
html += "</div></body></html>";
server.send(200, "text/html", html); // Mengirim HTML
}
void handleRelay() {
if (server.hasArg("num") && server.hasArg("state")) {
int relayNum = server.arg("num").toInt(); // Mendapatkan nomor relay
String state = server.arg("state"); // Mendapatkan status
if (relayNum >= 0 && relayNum < 4) {
int pin = (relayNum == 0) ? relay1Pin : (relayNum == 1) ? relay2Pin : (relayNum == 2) ? relay3Pin : relay4Pin;
if (state == "on") {
digitalWrite(pin, LOW); // Hidupkan relay
relayStates[relayNum] = true;
Serial.print("Relay ");
Serial.print(relayNum + 1);
Serial.println(" dinyalakan.");
} else if (state == "off") {
digitalWrite(pin, HIGH); // Matikan relay
relayStates[relayNum] = false;
Serial.print("Relay ");
Serial.print(relayNum + 1);
Serial.println(" dimatikan.");
}
server.sendHeader("Location", "/"); // Redirect ke homepage
server.send(302, "text/plain", ""); // Mengirim response
} else {
Serial.println("Relay number out of bounds.");
server.send(400, "text/plain", "Bad Request");
}
} else {
server.send(400, "text/plain", "Bad Request");
}
}
Penjelasan Kode
1. Konfigurasi WiFi: NodeMCU diatur sebagai akses point dengan SSID dan password yang ditentukan.
2. Pin Relay: Didefinisikan array `relayPins` yang berisi pin yang digunakan untuk relay.
3. Web Server: Server dimulai dan mendengarkan permintaan pada port 80. Ketika klien terhubung, server akan mengirimkan halaman HTML dengan tautan untuk menghidupkan atau mematikan relay.
4. Kontrol Relay: Ketika tautan diklik, status relay akan diubah sesuai permintaan (ON atau OFF).
Mengupload dan Menjalankan
1. Pastikan Anda telah menginstal pustaka ESP8266 di Arduino IDE.
2. Pilih board "NodeMCU" dan port yang sesuai.
3. Upload kode ke NodeMCU.
4. Buka browser dan masukkan alamat IP yang ditampilkan di Serial Monitor untuk mengakses web server.
|
| Tampilan WebServer |
Dengan mengikuti langkah-langkah di atas, Anda telah berhasil membuat web server dengan NodeMCU yang dapat mengontrol 4 relay. Anda dapat memperluas proyek ini dengan menambahkan lebih banyak fitur atau integrasi dengan sensor lainnya. Selamat mencoba!
Umbrella Electronica
.png)
