Author CETECH11 | Last edit 24/12/2023 by CETECH11
esp, ESP32, Espressif, wireless, relay, wemos ESP32_with_WebSerial-_A_Comprehensive_Guide_15.JPG Creation
Hardware components:-
Espressif Wemos D1 Mini
Software apps and online services:-
Arduino IDE
WebSerial is a web standard that allows websites to communicate with serial devices. It bridges the web and the physical world, enabling web applications to interact with hardware devices. This opens up a world of possibilities for IoT projects, allowing real-time interaction between web applications and physical devices.
You must check out PCBWAY for ordering PCBs online for cheap!
You get 10 good-quality PCBs manufactured and shipped to your doorstep for cheap. You will also get a discount on shipping on your first order. Upload your Gerber files onto PCBWAY to get them manufactured with good quality and quick turnaround time. PCBWay now could provide a complete product solution, from design to enclosure production. Check out their online Gerber viewer function. With reward points, you can get free stuff from their gift shop. Also, check out this useful blog on PCBWay Plugin for KiCad from here. Using this plugin, you can directly order PCBs in just one click after completing your design in KiCad.
Before we can use WebSerial with the ESP32, we need to set up the ESP32 development environment. Here are the steps:
File > Preferences > Additional Boards Manager URLs
and adding the ESP32 board manager URL. This will allow the Arduino IDE to recognize the ESP32 board and provide the appropriate options for programming it.Tools > Board > ESP32 Arduino
and select your ESP32 board. This tells the Arduino IDE that you will be programming an ESP32 board.
Next, we need to install the WebSerial library. Here’s how:
Sketch > Include Library > Manage Libraries
.WebSerial
.Install
.
/*
WebSerial Demo
------
This example code works for both ESP8266 & ESP32 Microcontrollers
WebSerial is accessible at your ESP's <IPAddress>/webserial URL.
Author: Ayush Sharma
Checkout WebSerial Pro: https://webserial.pro
*/
#include <Arduino.h>
#if defined(ESP8266)
#include <ESP8266WiFi.h>
#include <ESPAsyncTCP.h>
#elif defined(ESP32)
#include <WiFi.h>
#include <AsyncTCP.h>
#endif
#include <ESPAsyncWebServer.h>
#include <WebSerial.h>
#define Relay 2
AsyncWebServer server(80);
const char* ssid = "ELDRADO"; // Your WiFi SSID
const char* password = "amazon123"; // Your WiFi Password
/* Message callback of WebSerial */
void recvMsg(uint8_t *data, size_t len){
WebSerial.println("Received Data...");
String d = "";
for(int i=0; i < len; i++){
d += char(data[i]);
}
WebSerial.println(d);
if (d == "ON"){
digitalWrite(Relay, HIGH);
}
if (d=="OFF"){
digitalWrite(Relay, LOW);
}
}
void setup() {
Serial.begin(115200);
pinMode(Relay, OUTPUT);
WiFi.mode(WIFI_STA);
WiFi.begin(ssid, password);
if (WiFi.waitForConnectResult() != WL_CONNECTED) {
Serial.printf("WiFi Failed!\n");
return;
}
Serial.print("IP Address: ");
Serial.println(WiFi.localIP());
// WebSerial is accessible at "<IP Address>/webserial" in browser
WebSerial.begin(&server);
/* Attach Message Callback */
WebSerial.msgCallback(recvMsg);
server.begin();
}
void loop() {
}
In my case here is the response.Node: Change the Wi-Fi credentials.
en none 0 Published
You entered an invalid page name, with one or many of the following characters :
< > @ ~ : * € £ ` + = / \ | [ ] { } ; ? #