Smart Gate Automation: WIFI Control for Under $10

I searched the entire internet, including YouTube, in search of someone who successfully controlled their automatic gate using WiFi or a cell phone. However, the tutorials I came across were not exactly what I was looking for, but they gave me some ideas nonetheless. After consulting the documentation of the Quiko QK CE220BATRL4 control board and watching a video from Quiko on YouTube, I decided to create my own remote control and share with you all the steps of the project.

• 1 x ESP8266 NodeMCU module
• 1 x 2-channel relay module, 5V, 10A
• 4 male pin headers
• 2 x 20 female pin headers
• 1 x 2-pin screw terminal
• 1 x Perforated board (5x7 cm)
• Some wires
• Solder and soldering iron
• 5V power adapter

The project aims to create a device for remote control, allowing control of the gate system (Quiko QK CE220BATRL4 model) either locally via WiFi or from anywhere in the world via the internet. This will provide greater flexibility in gate control, addressing scenarios such as:

• Returning home and realizing the gate remote is left somewhere else.
• Your child arrives home, but no one is there to open the gate.
• Someone (from the family, of course) wants to enter, but the gate remote is far away, and you cannot or do not want to move to open it.

All these situations can be resolved with a simple press of a button on your smartphone, whether you are at home or outside.

In the following, we will determine the solution to construct this system.

Upon consulting the user manual for the gate controller (Quiko QK CE220BATRL4 model), I noticed that there are two inputs (pin1 and pin7), labeled as Start and Pedestrian, respectively, which act as normally open push buttons (NO).

- The "Start" function initiates a standard cycle of opening and closing the gate by activating both motors A and B. The cycle parameters are already pre-programmed.

- The "Pedestrian" function initiates a standard cycle of opening a single gate leaf, useful for the passage of a person, bicycle, etc. It activates only motor A, with the cycle parameters already programmed.

To invoke the "Start" function, it is sufficient to simulate a push button between pin1 (yellow) and pin8 (+24V red). Similarly, to activate the "Pedestrian" function, another push button is simulated between pin7 (yellow) and pin8 (+24V red). These two push buttons can be implemented using two relays controlled by a microcontroller, such as the ESP8266 NodeMCU in this case.

The diagram is pretty simple:

The relays module and the ESP8266 are connected as follows:

• Com -> input 8 +24V
• NO (relay1) -> input 1 Start
• NO (relay2) -> input 7 Pedestrian
• GND -> GND
• VCC -> +5V
• In1 -> D1
• In2 -> D2

You can also use 2 separate relay modules with:

• Com (relay1) -> input 8 +24V
• Com (relay2) -> input 8 +24V
• NO (relay1) -> input 1 Start
• NO (relay2) -> input 7 Pedestrian
• GND (relay1) -> GND
• VCC (relay1) -> +5V
• GND (relay2) -> GND
• VCC (relay2) -> +5V
• In (relay1) -> D1
• In (relay2) -> D2

Connect the esp8266 to PC using a USB cable and upload the following sketch:

smart_gate_opener.ino

/***************************************************************
 * Copyright [2024] [iot-tunisia.tn]
 * Sketch for controlling of quiko gate opener
 * Parts from this sketch were inspired from: randomnerdtutorials.com
 ***************************************************************/
#include <AsyncElegantOTA.h>
#include <Arduino.h>
#include <ESP8266WiFi.h>
#include <ESPAsyncTCP.h>
#include <ESPAsyncWebServer.h>
#include "LittleFS.h"
#include <ESP8266HTTPClient.h>
#include <WiFiClient.h>
#include <ESPAsyncWiFiManager.h>

// Assign each GPIO to a relay
int start_relay = 5; // start_relay corresonds to relay1 and GPIO 5 to D1
int pedest_relay = 4; // pedest_relay corresponds to relay2 and GPIO 4 corresponds to D2

const char* PARAM_INPUT = "relay_number";

// Define new custom host name for wifi connection
String newHostname = "ESP_SGO";

// Initialize the LittleFS file system and print status messages
void initFS() {
  if (!LittleFS.begin()) {
    Serial.println("LittleFS mounting failed");
  }
  Serial.println("LittleFS mounted successfully");
}  

// Create AsyncWebServer object on port 80
AsyncWebServer server(80);
DNSServer dns;

void setup() {
  Serial.begin(115200);

  // Set all relays to off when the program starts
  pinMode(start_relay, OUTPUT);
  pinMode(pedest_relay, OUTPUT);
  digitalWrite(start_relay, HIGH);
  digitalWrite(pedest_relay, HIGH);

  // WiFiManager
  // Local initialization. Once its business is done, there is no need to keep it around
  AsyncWiFiManager wifiManager(&server,&dns);

  // Set new hostname
  WiFi.hostname(newHostname.c_str());

  // Get New Hostname
  Serial.printf("New hostname: %s\n", WiFi.hostname().c_str());

  // exit after config instead of connecting
  wifiManager.setBreakAfterConfig(true);

  if(!wifiManager.autoConnect("SGO", "12345678")) {
    Serial.println("failed to connect, we should reset and see if it connects");
    delay(3000);
    ESP.reset();
    delay(5000);
  }

  // if you get here you have connected to the WiFi
  Serial.println("connected...successfully!:)");
    
  // Print ESP Local IP Address
  Serial.println("local ip");
  Serial.println(WiFi.localIP());

  initFS();

  // Web Server Root URL
  server.on("/", HTTP_GET, [](AsyncWebServerRequest *request){
    request->send(LittleFS, "/index.html", "text/html");
  });
  server.serveStatic("/", LittleFS, "/");

  // Send a GET request to <ESP_IP>/update?relay=<inputMessage>&state=<inputMessage2>
  server.on("/action", HTTP_GET, [] (AsyncWebServerRequest *request) {
    String inputMessage;
    String inputParam;

    // GET input1 value on <ESP_IP>/update?relay=<inputMessage>
    if (request->hasParam(PARAM_INPUT)) {
      inputMessage = request->getParam(PARAM_INPUT)->value();

      if (inputMessage.toInt() == 1) {
        digitalWrite(start_relay, LOW);
        delay(500);
        digitalWrite(start_relay, HIGH);
      } else if (inputMessage.toInt() == 2) {
        digitalWrite(pedest_relay, LOW);
        delay(500);
        digitalWrite(pedest_relay, HIGH);
      } 
    } else {
      inputMessage = "No message sent";
      inputParam = "none";
    }
    Serial.println(inputMessage);
    request->send(200, "text/plain", "OK");
  });

  // Start ElegantOTA
  AsyncElegantOTA.begin(&server);

  // Start server
  server.begin();
}
  
void loop() {

}

Brief description:

This Arduino sketch is designed for controlling a Quiko gate opener using an ESP8266 device. It sets up a web server to handle requests for controlling relays connected to the gate opener. The device is configured to connect to a WiFi network using a setup process facilitated by the AsyncWiFiManager library. The sketch also initializes the LittleFS file system and provides over-the-air update capabilities using AsyncElegantOTA. The main functionality involves serving a simple web interface for relay control and displaying a custom HTML page.

 digitalWrite(start_relay, LOW);
 delay(500);
 digitalWrite(start_relay, HIGH);

This code simulates the push button that controls the Start function of the gate control board.

digitalWrite(pedest_relay, LOW);
delay(500);
digitalWrite(pedest_relay, HIGH);

This code simulates the push button that controls the Pedestrian function of the gate control board.

In the same folder as smart_gate_opener.ino you should create a new folder with the name data, inside that folder create a new html file index.html with the following code:

<!DOCTYPE HTML>
<html>


<head>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <style>
    html {
      font-family: Arial;
      display: inline-block;
      text-align: center;
    }


    h2 {
      font-size: 3.0rem;
    }


    p {
      font-size: 3.0rem;
    }


    body {
      max-width: 600px;
      margin: 0px auto;
      padding-bottom: 25px;
    }
    .button {
      display: inline-block;
      padding: 15px 25px;
      font-size: 24px;
      cursor: pointer;
      text-align: center;
      text-decoration: none;
      outline: none;
      color: #fff;
      background-color: #04AA6D;
      border: none;
      border-radius: 15px;
      box-shadow: 0 9px #999;
    }
    .button:hover {
      background-color: #3e8e41
    }
    .button:active {
      background-color: #3e8e41;
      box-shadow: 0 5px #666;
      transform: translateY(4px);
    }
  </style>
</head>

<body>
  <h2>SGO Web Server</h2>
  <button class="button" onclick="toggleRelay(1)">Start</button>
  <button class="button" onclick="toggleRelay(2)">Pedestrian</button>

  <script>
  function toggleRelay(number) {
    var xhr = new XMLHttpRequest();
    xhr.onreadystatechange = function() {
      if (xhr.readyState == 4 && xhr.status == 200) {
        // Optional: Handle the response from the server if needed
        console.log(xhr.responseText);
      }
    };
  
    // Send request to update relay status
    xhr.open("GET", "/action?relay_number=" + number, true);
    xhr.send();
  }
  </script>
 </body>  
</html>

You must download the jquery library ( jquery-3.6.4.min.js) from the following link: https://jquery.com/download/ and save it to the data folder, now your data folder should looks like that: folder_tree.png

You need to use an older version of Arduino IDE, for example, version 1.8.19, to be able to upload the contents of the 'data' folder using LittleFS

Now that the sketch is uploaded to the esp8266, we can start the test of our circuit following the steps above:

• Connect the esp8266 to the PC via usb cable and go to the serial monitor in Arduino IDE.
• Connect to the new access point (SGO) with the credentials you set in your arduino sketch.
• A wifi portal is launched at the ip adress given in the serial monitor usually: 192.168.1.14 from which you can enter the wifi credentials that the esp8266 should connect to.
• Once the connection is established a web server is then launched at the new ip adress given in the serial monitor.
• Go to that ip adress (192.168.1.33 in my case) and you should see a simple web page with two buttons Start and Pedestrian that will command the 2 relays.
• Make some tests and check the serial monitor for output

After test success we can now go to the final assembly and make some soldering, you can put the final device in a separate IP55 box, but i prefer to hold it inside the main control board box as there is enough space inside.

I put the 5V adapter into a 220V wall socket near the control box.

Everything in place and the Esp8266 is connected to the wifi.

Go to the Ip adress printed previously in the serial monitor (192.168.33 in my case) and enjoy controlling your gate from your smartphone in your local network.

So far, gate control is only possible on a local Wi-Fi network. To control it from anywhere in the world, you need to use the port forwarding technique. To do so, first, ensure that your router supports port forwarding. Then you have to find a service that allows you to connect to your device or server using a domain name instead of an IP address like No-ip This can be particularly useful when your Internet Service Provider (ISP) assigns you a dynamic IP address that may change periodically..

Please follow these steps to get a free hostname (or paid if you want)

1. Account Creation:

- To use No-IP, you need to create an account on their website. You can choose a free or paid hostname plan with additional features.

2. Setting Up Hostnames:

  - After creating an account, you can set up hostnames for your devices. These hostnames act as aliases for your changing IP address. You can create multiple hostnames depending on your needs.

3. Dynamic Update Clients:

  - No-IP offers dynamic update clients for various platforms (Windows, Mac, Linux, routers, etc.). These clients automatically update your hostname with the current IP address, ensuring that your domain always points to the correct location.

4. Port Forwarding:

  - For remote access to devices behind a router, you might need to configure port forwarding. This involves directing incoming traffic on a specific port to the appropriate device on your local network. No-IP's services can be used in conjunction with port forwarding for remote access.

5. Security Considerations:

  - While using No-IP, it's essential to consider security measures, especially when opening ports for remote access. Ensure that you use strong passwords, keep your devices and software updated, and be cautious about exposing services to the internet.

No-ip documentation and even several youtube videos describe in detail how to portforward a local adress ip, feel free to read and watch.

In this tutorial, we focused on the Italian model Quiko , but I think that other gate control models work in the same way. Therefore, it is possible to control them remotely as we did for this model.

Finally, I hope that this instructable was useful to you and may have been the starting point for some of you for further improvement.

Do not hesitate to make comments and ask your questions,

See you soon in another IoT project!

iot-tunisia