Build an ESP8266 Web Server with Arduino IDE - Code and Schematics
HTML-код
- Опубликовано: 13 июл 2024
- For complete project details (schematics + source code), visit ► randomnerdtutorials.com/esp82...
Like my page on Facebook:
/ randomnerdtutorials
Add me on Google+:
plus.google.com/+RuiSantosdotme
Follow me on twitter:
/ ruisantosdotme
Subscribe for more projects like this!
bit.ly/subscribeRNT 
Наука
You can always find the the schematics and source code at ► randomnerdtutorials.com/esp8266-web-server/
Rui Santos. I need help, My router don't give me the ip address and the code is = to your code, naturaly whith my ip en pass, can you help me whith this please. Thank.
thank you so much for making this video, but I want to know why doesn't the esp-01 code doesn't work once you unplug and then reconnect?
i'm unable to install libraly can you give that library link seperatly through git hub
I cant control it from another router
Ayan Bhattacharjee i am pretty new to this but i think the IP address is assigned by the WiFi router, so when you reconnect it can be a different IP address than the original one
I don't think I've ever been this happy to see 2 LED's light up before😁 Thanks!
so straightforward, clear and EXACTLY what I was looking for!! thank you!
I know this video is older but..
VERY WELL EXPLAINED! I understood the code mostly but having you go through it in fragments was very much useful! Thank You sir!
Worked FIRST TIME, I am truly grateful, I can now ‘play’ with a piece of working code and change it to suit.
Although I have been coding for many years, and have been building Arduino projects for the last 18 months, webservers and IoT scared me, a total black art. You demystified this, and gave me a chance to start on my own IoT projects.
Thank you
Next stage is to add images, to make it look nicer. 👍😀
Excellent introduction to using a web server with the ESP8266. Clear and concise as a great starting point for other applications. Thank you!
This is my first projekt with ESP8266 01. IT WORKS! THANK YOU very much. Im so happy!
thank you so much!!!! I tried a lot of other codes and yours was the only one that worked with 4 leds.
Thank to friend Rui Santos for sharing this very well explained tutorial, which worked perfectly on both NodeMCU and ESP8266 01.
High quality tutorial, much appreciated.
Very well explained. Thank you very much
Thanks for a great video, one of the best tutorials on this subject.
Thank you, Rui Santos. It works. You explained very very clear, no need to edit code, work at first time.
exactly what I am looking for and it works well, many thanks
Thank you so much for the code and explanation. Very clearly explained
just what I needed! I modified some things to give it my personal touch and it worked very well! Thank you for sharing this!!
You're welcome! I'm glad it worked
It has been running successfully. Thank you
Thank you very much for your easy explanation.
It's a great program.
And simple and good design CSS
Best tutorial I ever seen. completely useful !!!
Very well explained, thank you!
nice project
the web interface looks fine
Thank you so much it was very helpful!
Thank you very much, works well with ESP8266-01 with PlatformIO IDE
It works bro....Great explanation ... Thank you :)
that was really really good mann
Excellent, finally got it work, Thanks!!
Thanks , really good video!😄
THANK YOU !! This helped me out so much
Excelente!!! É simples e eficiente! Muito Obrigado!
Great tutorial, thank you!
Thanks for the explanation on what everything does to build the webpage. Do you have any video showing how I could do text input and output on the webpage and pass it along into variables?
Big fan of your site, keep up with the good work!
Thank you! I'm glad you find it helpful
thank you so much
It worked without any hiccups
great video 🔥🔥🔥🔥🔥 clear as water
Thanks a lot broo, it worked so perfectly!!
Nice one bro! wish i can give more than 0ne thumbs up for this vid tut
this is super cool! great video! is it possible to create dynamic "dashboards" (user interface that shows real-time data on graphs and other interfaces) using this method? or is it just static html?
great tutorial. thanks very much!
Very well explained .Thanks
Many thanks for a great tutorial
Excelent video and well explained, it is what I was looking for.
Thank you for share your knowledge for us.
I subscribe to your channel right now
Thank you. It works with ESP8266-01. Program using Arduino. Change GPIO4 to GPIO0 and GPIO5 to GPIO2
ruclips.net/video/LrNd83p3XTw/видео.html
Great video!
Bom trabalho companheiro! :) Vou tentar usar noções do teu código para meter um daqueles relés integrados com uma ESP-01 - que usam a porta série :)
muito bom parabéns! simples e funcional.
very good! simple at functionallity
Great. Nowadays async webservers seem to be more popular, but in this case the traditional webserver works just as well
Great tutorial!
Thanks a lot for sharing :)
Superb..thanks bro
Your explanation is exemplary....
Funktioniert super sehr gut erklärt
Thank you so much. This video is so well explained and your schematics and codes are flawless. I took your design and added some PhP and javascript. You can now control
the LED from anywhere in the world. All thanks to you.
Please I need the PHP and javascript files I'm trying to do the same but did't work
@@ALasmry707 do you know anything about port forwarding?
Darmin Axel not really I’m a beginner but I have my own hosting and domino that I wanna use for this project. If you can help me with the sample of code that will be appreciated
Do a little research on port forwarding. You need to own a domain to do this. If you do not own a domain, you're going to have to type type your internet iP address in your browser to turn on the lights .
Here go here
darmin.ca/led.php
That's my website. I'm using php to tell my server to connect to my home router and connect to the esp and turn on the lights
@@ALasmry707 ok good , u got your own domain. Um.. lets chat somewhere else.
Thank you for this video. Would it be possible for you to create one based on ESP8266 soft access point and how we can connect to it to setup the wifi of the device? Just about all of the videos I've seen on the ESP8266 have you hard code the wifi info into the base code. That's kind of a bummer having to recompile the code to use the device on a different network. Is this covered in your home iot course? Thank you.
Thank you was a very usefull tutorial!
Excelente ,muchas gracias por el aporte!
Very well explained 👍👍
thank you Rui ; worked like a charm
you install what version on board esp8266?
Muito obrigado! Ajudou-me muito a entender a comunicação por http.
verry cool !!!สุดยอดจริงๆครับจะนำไปลองใช้ดูนะครับ
I would like to know, as the web server, is it possible to add some javascript code to the client.println in order to do additional JS stuff on the data and represent it through the webpage?
Excellent tutorial!!
Thank you!
Rui, in my case I have to change the label of the button, to fit the right state of it (button class).
If I would want to create a button just a few seconds ON or with controlled time ON, what is the best approach? Tks
Your explain is the better frien, I don't stand very mush the english but, I can stand your explain, thank so mush. From chile thank.
Thank you!
Great job!, You could in the future do the same but that the spy is connected to some arduino card and control it through it. Thanks!
Great vid
Excellent!
Thank you
You're welcome! Thanks for watching
Used this and changed it a bit. Now I can turn on the lights from anywhere in the world.
Can you help me with that ??
Hey just a question, With what kind of commands can I show a picture, draw(box,line,traingle) or animation commands?
I just want to say thank u so much.
thank you so Much
Thank you very much i try it web server.
Olá! Hello! Descobri o canal sem querer. Estava mesmo à procura de um canal deste género! PS: Descobri logo que eras português nos primeiros segundos do vídeo devido ao sotaque. Keep it up ;)
hola amigo
Thank you much
thanks! i was looking exactly for this, im making an android app to work with this :)
I'm glad it was helpful Juan! Thanks for watching
Nice video
Thanks for sharing such an awesome project. Can you please add Physical Push Button Switches with Status Feedback to operate the same with those Switches as well.
Awaiting your positive response . Thanks
Спасибо! Все доходчиво расжовано :)
Hello AWESOME Rui , Wish u r doing well
thanks you Rui sharing your effort with us... really saved us and helped us a lot ... one more q please, how can we have a static ip so we don't need to open the serial port every time i reboot it to know the new dhcp random ip
you are amazing
Thanks for this tutorial, how can I add two external pushbuttons to (local) control both leds as well as through the website?
write this before void setup():
int in1=0;
int in2=0;
#define inpin5 1;
#define inpin4 2;
and in the void setup():
pinMode(inpin5,INPUT);
and into the loop:
in1 = DigitalRead(inpin5);
if(in1==HiGH){
digitalWrite(5,HIGH);
}
else
{
digitalWrite(5,LOW);
}
in2 = DigitalRead(inpin4);
if(in2==HiGH){
digitalWrite(4,HIGH);
}
else
{
digitalWrite(4,LOW);
}
(the input pin for the led at the pin4 is at 1 and for the led at the pin 5 is pin1)
hey, its work fine tranks my friend 🙂
Excellent Video and guide. Worked right out of the box. With the excellent code comments I was able to easily identify how to add an additional button and LED to control. As a suggestion, with remote applications, the battery condition is very important. It would be good if programs like these are extended a little to show the battery voltage using analogue pin reading.
Awesome! That was the goal of my tutorial and I'm glad it was easy to follow. Unfortunately for Wi-Fi devices that require a constant Wi-Fi connection is not a good idea to use batteries, because it will drain your battery very quickly...
Yes Rui, I'm beginning to see that now as I play more with the ESP. However in duty cycled sensor applications it is obviously OK to use battery (which is different to this app). I'm curious, with the ESP in one of the low power "sleep" modes, is it possible wake the device to perform a function and put it to sleep again. I know I'm stretching the envelope :). With the quality of your tutorials, I'll be registering for your courses! Thanks J
Will the Web Server Arduino work with the iPhone 4S?
Cheers
Hi, Rui, this project it's mixable with other one with esp32 cam that you done before? I'm assuming that we can use gpio pins in esp32 for switches and at the same time using the live camera over the webserver. I'm planning to use as a doorbell, without audio. It is feasible?
Tks in advance
yeah dont think he cared
this was very usefull got this working in a matter of minutes but my device said version number 0.9 that didn't work in Arduino I tried version 1.0 that worked something to watch out for
Hello Rui.
Should we switch from get to post method? I mean, get is very likely to be sniffed out.
thank you
Hi Rui, good night. I'm Marcos (Barueri-Sao Paulo-Brazil) how do I change one of the buttons to momentary? (for use on garage door)
Thank you.
/*********
Rui Santos
Complete project details at randomnerdtutorials.com
*********/
// Load Wi-Fi library
#include
// Replace with your network credentials
const char* ssid = "do you really";
const char* password = "want to know";
// Set web server port number to 80
WiFiServer server(80);
// Variable to store the HTTP request
String header;
// Auxiliar variables to store the current output state
String output5State = "off";
String output4State = "off";
// Assign output variables to GPIO pins
const int output5 = 5;
const int output4 = 4;
// Current time
unsigned long currentTime = millis();
// Previous time
unsigned long previousTime = 0;
// Define timeout time in milliseconds (example: 2000ms = 2s)
const long timeoutTime = 2000;
void setup() {
Serial.begin(9600);
// Initialize the output variables as outputs
pinMode(output5, OUTPUT);
pinMode(output4, OUTPUT);
// Set outputs to LOW
digitalWrite(output5, LOW);
digitalWrite(output4, LOW);
// Connect to Wi-Fi network with SSID and password
Serial.print("Connecting to ");
Serial.println(ssid);
WiFi.begin(ssid, password);
while (WiFi.status() != WL_CONNECTED) {
delay(500);
Serial.print(".");
}
// Print local IP address and start web server
Serial.println("");
Serial.println("WiFi connected.");
Serial.println("IP address: ");
Serial.println(WiFi.localIP());
server.begin();
}
void loop(){
WiFiClient client = server.available(); // Listen for incoming clients
if (client) { // If a new client connects,
Serial.println("New Client."); // print a message out in the serial port
String currentLine = ""; // make a String to hold incoming data from the client
currentTime = millis();
previousTime = currentTime;
while (client.connected() && currentTime - previousTime = 0) {
Serial.println("GPIO 5 on");
output5State = "on";
digitalWrite(output5, HIGH);
delay(100);
digitalWrite(output5, LOW);
} else if (header.indexOf("GET /5/off") >= 0) {
Serial.println("GPIO 5 off");
output5State = "off";
digitalWrite(output5, LOW);
} else if (header.indexOf("GET /4/on") >= 0) {
Serial.println("GPIO 4 on");
output4State = "on";
digitalWrite(output4, HIGH);
delay(100);
digitalWrite(output4, LOW);
} else if (header.indexOf("GET /4/off") >= 0) {
Serial.println("GPIO 4 off");
output4State = "off";
digitalWrite(output4, LOW);
}
// Display the HTML web page
client.println("");
client.println("");
client.println("");
// CSS to style the on/off buttons
// Feel free to change the background-color and font-size attributes to fit your preferences
client.println("html { font-family: Helvetica; display: inline-block; margin: 0px auto; text-align: center;}");
client.println(".button { background-color: #195B6A; border: none; color: white; padding: 16px 40px;");
client.println("text-decoration: none; font-size: 30px; margin: 2px; cursor: pointer;}");
client.println(".button2 {background-color: #77878A;}");
// Web Page Heading
client.println("ESP8266 Web Server");
// Display current state, and ON/OFF buttons for GPIO 5
client.println("GPIO 5 - State " + output5State + "");
// If the output5State is off, it displays the ON button
if (output5State=="off") {
client.println("ON");
} else {
client.println("OFF");
}
// Display current state, and ON/OFF buttons for GPIO 4
client.println("GPIO 4 - State " + output4State + "");
// If the output4State is off, it displays the ON button
if (output4State=="off") {
client.println("ON");
} else {
client.println("OFF");
}
client.println("");
// The HTTP response ends with another blank line
client.println();
// Break out of the while loop
break;
} else { // if you got a newline, then clear currentLine
currentLine = "";
}
} else if (c != '
') { // if you got anything else but a carriage return character,
currentLine += c; // add it to the end of the currentLine
}
}
}
// Clear the header variable
header = "";
// Close the connection
client.stop();
Serial.println("Client disconnected.");
Serial.println("");
}
}
NICE ONE DUDE!!! ...WORKS FANTASTIC!!! ....can't understand why my smartfone wont connect to the gui via the address given by DHCP on my system; - it only works if I connect to the devices OWN built in AP (unsecured) ...How do I secure that one???
Hi, Thanks for sharing this nice project. Can we do this with stm32f103c8t6 + esp8266 wifi module, instead of NodeMCU board?
And Control stm32f103c8t6 via web server?
can it be made accessible from anywhere or only local area network?
With small code modification, you can put the ESP8266 in static IP address mode
Please DO TELL!!! ...I am looking in the direction of the ESP8266WiFi.h component (trying to find it) ...the code given here works ...but WHERE does IT mention DHCP; - and why does the browser on my PC access it from my networks DHCP ...but my smartfone gets an address ONLY off the BUILT IN DHCP on the Device; - WHERE did the 192.168.4.0 network come from???
Parabéns mt bom
Its awesome.. please help me. can you please explain how to create this to access from any network
Hello. Is this connection only on the same network or anywhere in the world?
Which is the protocol used to communicate with nodemcu?
Hi Rui, the gpio displays off, but the button displays on and vice versa. Can it be changed so that both are on or off? Or it would be better if the gpio status won't be displayed. Also can we change the title instead of ESP8266 can we change it to something else. Thanks.
hi thank you for this information can you show how we can track nodemcu by api key in gcp
Thanks ma man
You're welcome! Thanks for watching
Hi
Can you help with the esp8266 in home automation?
I'm using it for home automation and the problem is when it reboots as the power gone, it automatically turns everything on .
I don't need anything to be on state.
Please help with it ?