Published November 20, 2022 © GPL3+

Plant Monitoring - Flutter & Websockets

In this project we are going to use the Seeed Studios‘ XIAO ESP32C dev board to read moisture data and send it to our app via WebSocket

BeginnerWork in progress1,087

Things used in this project

Software apps and online services

ESP32 IoT Plant Monitor

Story

Originally posted in Diyusthad.com

Intro

IoT Plant Monitor project we are going to use the Seeed Studios‘ new XIAO ESP32C development board to read moisture sensor data and send it to our application via WebSocket.

Concept

The concept is to run a WebSocket server in XIAO ESP32C which will read and calibrate the data from a bunch of sensors like a Soil Moisture Sensor, pH Sensor, Temperature Sensor, and Humidity Sensor and send all this information in JSON format to connected clients via the WebSockets whenever the client request for the data.

In our case, the client is a mobile application that I build in flutter which can handle multiple WebSocket connections and display all the received information in the app dashboard in an elegant graphical interface.

Note, in the below example we are only using a Soil Moisture Sensor because currently, I am not having the other sensors. In Sha Allah, I will do another project when Seeed Studio ships them.

What is WebSockets?

WebSocket is a bidirectional, full-duplex protocol used for client-server communication, Unlike HTTP, WebSocket begins with ws:/ or wss:/. Since it is a stateful protocol, the client and server connection will remain active until one of them decides to terminate the connection (client or server). The connection is cut off from both ends after being closed by either the client or the server.

Testing Video

Working Video

Read full instructions and code at https://diyusthad.com/2022/11/iot-plant-monitor-using-xiao-esp32-flutter-app.html

Code

XIAOplantMonitoring

// IoT Plant Monitor
// by diyusthad.com

#include <WiFi.h>
#include <WebSocketsServer.h>

int sensorPin = A0;
int moistureSensorValue = 0;

const char* ssid = "YOUR WiFi SSID";
const char* password = "WiFi PASSWORD"; 

WebSocketsServer webSocket = WebSocketsServer(80);

// Called when receiving message from WebSocket client
void onWebSocketEvent(uint8_t num,
                      WStype_t type,
                      uint8_t * payload,
                      size_t length) {


  switch (type) {

    // Client has disconnected
    case WStype_DISCONNECTED:
      Serial.printf("[%u] Disconnected!\n", num);
      break;

    // New client has connected
    case WStype_CONNECTED:
      {
        IPAddress ip = webSocket.remoteIP(num);
        Serial.printf("[%u] Connection from ", num);
        Serial.println(ip.toString());
      }

    // Send data back to client
    case WStype_TEXT:
      Serial.printf("[%u] Text: %s\n", num, payload);
      readSensor(num);
      break;

    // For everything else: do nothing
    case WStype_BIN:
    case WStype_ERROR:
    case WStype_FRAGMENT_TEXT_START:
    case WStype_FRAGMENT_BIN_START:
    case WStype_FRAGMENT:
    case WStype_FRAGMENT_FIN:
    default:
      break;
  }
}

void setup() {

  // Start Serial port
  Serial.begin(115200);

  // Connect to access point
  Serial.println("Connecting");
  WiFi.begin(ssid, password);
  while ( WiFi.status() != WL_CONNECTED ) {
    delay(500);
    Serial.print(".");
  }

  // Print IP address
  Serial.println("Connected!");
  Serial.print("My IP address: ");
  Serial.println(WiFi.localIP());

  // Start WebSocket server and assign callback
  webSocket.begin();
  webSocket.onEvent(onWebSocketEvent);

}

void readSensor(int num) {

  moistureSensorValue = analogRead(sensorPin); //Read analog data from the sensor
  int mapvalue = map(moistureSensorValue, 1100, 2700, 0, 100); // map the value
  String mapMoistureSensorValue = String(mapvalue); // convert the value to string

  // convert the string to JSON formate
  // I have used dummy values for temperature, humidity and pH
  String json = "{\"water_level\":";
  json += mapMoistureSensorValue;
  json += ",\"temperature\":0.5,\"humidity\":0.7,\"ph\":0.2}";

  webSocket.sendTXT(num, json); //send data to client

}

void loop()
{
  webSocket.loop();
}