ESP8266 Web Server POST Requests With JSON Data In Arduino IDE (Mac OSX and Windows)
HTML-код
- Опубликовано: 2 авг 2024
- • Your support helps me post videos more frequently:
/ acrobotic
www.paypal.me/acrobotic
buymeacoff.ee/acrobotic
BTC: 1ZpLvgETofMuzCaKoq5XJZKSwe5UNkwLM
==========
• Find me on:
/ acrobotic
/ acrobotic
/ acrobotic
==========
• My shops:
acrobotic.com/shop
amazon.com/shops/acrobotic
==========
• Description:
In this video I show you how to send data to, and process it on, a web server running on the ESP8266. I start with the web server code that was set up in another video ( • ESP8266 Web Server Ste... ), and add a route where to send the data. When the JSON-formatted data is received, it's sent to a callback function, which processes it and extracts the included parameters. The JSON-formatted data specifies the pan and tilt of a servo-powered USB camera mount. I go over the process, step-by-step, of how to write code using the Arduino IDE.
One of the most common tasks when using the ESP8266 is setting it up as a device that connects to a network and responds to traffic on it (i.e., a web server). I wanted to show you, in detail, how to take things further by using the web server to receive custom data formatted in JSON and included inside of a POST request.
==========
• Project parts:
ACROBOTIC Development Board for ESP8266:
acrobotic.com/products/acr-00018
amzn.to/2dAZ1mW (affiliate)
ACROBOTIC Pan and Tilt USB Camera Mount:
acrobotic.com/products/acs-00008
==========
• Project code:
Firmware for the Arduino IDE:
github.com/acrobotic/Ai_Tips_...
Install curl (Mac and Windows):
curl.haxx.se/download.html
==========
• Tutorials:
Detailed guide for getting started with the ESP8266 Development Board:
learn.acrobotic.com/tutorials/...
==========
• Music:
Jason Shaw (audionautix.com/). Creative Commons License 3.0.
==========
#ESP8266 #Arduino #Tutorial 
Наука
Hey guys, anyone new coming into this video please note that the ArduinoJson library has updated to version 6. With that, the Parse method has been replaced with a document method.
New code is as follows:
String data_string = server.arg("plain");
StaticJsonDocument jDoc;
DeserializationError err = deserializeJson(jDoc, data_string);
JsonObject object = jDoc.as();
const char* pan = object["pan"];
const char* tilt = object["tilt"];
Pan = pan;
Tilt = tilt;
At least this is what I have used with success.
Good luck
Nice. Thanks for sharing, I switched to version 6 for the latest videos, but these older ones could definitely use an update. I really appreciate posting your solution to get around the incompatibility issues brought by the update!
Thanks!
Thank you! It was really helpful
bro can you give me solution firstly it says Pan Tilt not defined and if Serial.print(pan) it gives null like at the serial monitor can you provide the link from which i can learn the version 6 more
I just discovered your video series. I am new to the web side of micro-controllers, your commentary and interactive coding certainly filled in a number of blanks in my quest to understand IOT communication. Very well done thank-you.
Thanks so much for watching, we're glad you are finding the content useful! Plenty more videos are on the way :)
What i like most about this channel is that the videos are made simple and very easy to understand. Rather than throwing too many things at us in one go (which is only going to confuse us more and leave us frustrated), the videos are sequenced in a manner that allows us to learn step by step in an incremental fashion making life much easier for a beginner like me. I thoroughly enjoy your videos and wish to see more of them. Thank you!!
Thanks for the kind words, Pavan. I'm glad you liked the content!
After watching your videos i realised just how much esp8266 is capabale of and i may have barely scratched it’s surface. It really packs a punch. The more you learn the lesser you know. Big things do come in small packages and esp8266 is a living testimony. :)
Awesome man! Nicrle tutorial! Thanks.
Excellent tutorial! I'm eager to try it out!
Thanks! When you try it out, shoot us an email if you have any questions!
Very useful and well presented. Thanks!
Thanks for watching our videos, Capi!
Awesome tutorial 👍🏽
Thanks for the kind words, we're glad you liked it!
super and helpful video, thnks!
Thanks for watching!
Thank you. great video.
Thanks for watching! We're glad you found the vid useful!
thank you so much, very hepful
Great! Grateful! Obrigado!
You're welcome! Por favor!
Great video. Thanks!
No problem, thanks for watching!
Also, there's no good reason to search for "plain", it's just how the library works :)
ACROBOTIC Ah I saw your answer for a similar question on an old comment down below so I deleted that part. Thanks anyway :D
Another great, clear, helpful tutorial! Thanks! I also would like to see a tutorial where two ESP8266's communicate -MQTT would be an added bonus using an MQTT broker such as a Raspberry Pi.
Glad to have you back as a viewer! :) We'll most definitely be covering those two topics!
We've got a couple more vids on sending data to the server using your own clients (Python/JavaScript), but then we'll switch it up to requesting data from the ESP8266 from online APIs, as well as other ESP8266s. Fun times ahead!
super tutorial..thx
We're glad you liked it, thanks for watching!
Thanks for video training
I have problem in my project I used arduino uno with esp8266 node Mcu to measure two analog PH& Turbidity I check first code of arduino uno in serial I get the result test of 2 sensors how can I program arduino uno and node mcu in that 2 sensors to get result on web will write the program for arduino uno and esp8266 node mcu thanks
thank you, excellent tutorial.
could you please do another tutorial for sending the commands from another esp8266?
Thanks for watching, sure thing we'll add it to our queue! :)
Can we upload the code to Arduino instead of the esp module, and then connect the esp to Arduino board?
i have an esp 8266 and a i2c 16,2 lcd, i have made a text box thats suppose to display the user input to lcd screen but i dont know how to grab that user input and put that data inside a variable for displaying on lcd with the lcd command, it sais filenot found on the actual lcd display so im half way there how do i use the posted user data? without using any sd card!
Two words: good luck! :)
More seriously though, always try to break down your project into smaller pieces. Having problems with displaying data on the LCD? Just focus on that. Print out the variable in question to the Serial Monitor until you see the data you need. Thanks for watching!
can the opposite way be done node mcu sends json to pc with values
Night Shade, yes, you can do it in a few ways. The simplest is sending JSON back after receiving a GET request from the PC:
server.on("/, HTTP_GET,
server.send(200, "text/json", [](){"{success:true}" );
});
The other way is to use the WiFiClient object. The built-in examples are pretty good!
Thanks for watching!
Hi Cisco, you are doing a great job your videos are really beneficial. I was wondering how is it possible to control the servo if the user and ESP8266 both are on different networks?
Hi, Mohammad. Thank you for your kind words. The easiest way is to use a service like IFTTT. We'll be making a video this week about this subject. Later on, we'll explain how to do it using your own server instead of a 3rd party. We appreciate having you as a viewer of our videos :)
ACROBOTIC : Thanks for writting back, really excited to learn IFTTT for integration. If i have a hosted server some where and want to recieve data(commands) from it through JSON and control servo or any other thing. how this can be done?
The gist of it is to program your ESP8266 to periodically ask the server, "should I move the servo", and you should configure the server to respond "no" or "yes, to 125 degrees [for example]". Lastly, your server should have a GUI to facilitate specifying the servo angles. Hope this helps.
Hello sir, Thank you very much for all your tutorials but i couldn't watch all them yet because lack of time, So i want to ask you a quick question about my graduation project. I hope you can help me :)
In my project i should use 3 Things, (Raspberry Pi 3 ) as a Server, WeMoS D1R2(will managed by server) so it will "turn on" or "turn off" the light bulb according the server input and Android Phone(I will create an Application to send request to Raspberry Pi 3 Server like "turn on the light in the room 1") and basically i have to create my home server.
So i tried to create a server on the Raspberry Pi using (ExpressJS and mongoDb) and i made it. But i am not sure how to manage WeMoS using that server and i thought i can create my API and i can provide real-time JSON object to the wemos so it can read the status of the light and according to that value it can do its job as like as below.
{ _id:1,status: 'on', image_url: '/open_light.jpg', redirect_url: 'Close Light',redirect_status: 'off' }
So my question is, Is there any other good way to mange wemos using raspberry pi 3 server if not then how to parse JSON object from external web server ?, Because my server will run on Raspberry Pi. So i hope you can help me sir :) Thank you very much.
That's not a quick question (and neither is the answer). Good luck with the project :)
Hi, Im trying to use serial.print to print the data in the JSON but i dont get any data with the arduino. When i enter to the url the function is executed.
Make sure you convert the JSON data to a string! Thanks for watching our videos :)
I'm really happy that I've found your channel. I'm working on a project and I'd like to contact you for some questions, would it be possible? Thanks in advance and keep up the good work!
Sorry, it's hard for me to do 1-on-1 chats any more given the size of the community. Best of luck and thanks for stopping by!
Fair enough! Thanks for your fast reply. Do you have any video where I can see how to make my ESP8266 post to a rest API with a JSON body and a header? It'd be great.
Yep, for the ESP8266 to send out requests we can use the WiFiClient class. This is an example of using it to send a POST request of JSON-formatted temp/humidity data to a visualization API:
vid:
ruclips.net/video/oI5SwqfiB5E/видео.html
code:
github.com/acrobotic/Ai_Demos_ESP8266/blob/master/dht_dataviz_ubidots/dht_dataviz_ubidots/dht_dataviz_ubidots.ino
Thanks for checking out our vids!
ACROBOTIC I managed to do it with your video, I can't be thankful enough!
That's awesome! I'm so glad it did, thanks again for watching and also for following up and letting me know :)
Hey I've been following your other videos. I got one with a websocket to work. Question is which would have a better response? A websocket or json? I'd like to build a robot car.
Heya, thanks for checking out my videos. That's great that you got something working. So websockets is comparable to AJAX, for example. JSON is just how you format the data that's transmitted between devices. I'd go for websockets since they're designed to work as close to real-time as possible. GL!
Very nice but for future leave view on code for most of time, please. Only time you have to change view is when you show us reaction of the devices controlled by the program. At any other moment i would like to read and analyze code instead of watching you:P BTW your english sounds pretty clear, one of the few that I am able to understand without focusing too much on understanding
Thanks, we also have the code on the description so that you can have it open and analyze it as we're explaining it (you can even pause the video for extra time). The main reason we don't leave it on for a longer time is so that the video itself doesn't become too long. Thanks for watching!
I meant very comfortable for learners on your chanel would be id they can read code, rewrite to their sketch needed parts and listen you in the same time without jumping between pause button, sketch, opened your sketch downloaded from here. At the moment i have to do 'jumping' because whatever you wrote i have not enough time to rewrite at the same time, because immediatly after one line you change view to you body. You don't have to explain me how to manage with this problem, every kid can click pause etc. This is just tip from me (learner of this tutorial who see what can disturb with getting your lesson) to you, what is the thing you can do to improve your guide to actually free of imperfection. As we know removing problems is always better than manage with. Regards :)
you think , not using colored coding and choosing complex name is cool ?
I got a message "StaticJsonBuffer not declared in this scope". I had installed ArduinoJson by Benoit Blanchon version 6.7.0-beta. When I changed library to ArduinoJson version 5.13.14. (Sketch > Include Library > Manage libraries, search for Arduino Json) the sketch compiled without any errors. I thought this information might help other users of this video.
Yup, thanks for sharing! I make a point to mention the version in future videos, but it's an issue with older ones. Thanks again!
Great video, is it possible to use just AT commands to Post to a website in JSON format without reprogramming the ESP8266, thanks!
Thanks! Honestly, I don't know what the limitations of AT commands are, though I suspect it should be possible to specify the method of HTTP requests. Sorry I wasn't very helpful.
@@datasith You are very helpful !
hi please could you tell me how I would do the same thing but with the esp8266 in access point mode? I eventually aim to make a mobile app that can send json to an esp8266 without the need for a network. Also, how would you store this json permanently on the chip so it can be accessible on a restart?
Anything you put on the firmware will be available on restart! To set it into AP mode, you can use the method:
WiFi.softAP(ssid, password);
Thanks so much for watching, good luck with the app!
Sir, how to call a webapi in esp8266 and post data as json object ?
Look at my other videos where I use the WebClient class to do so. Thanks for watching!
Hi. Very nice tutorial.
But I did not get --> server.arg("plain") ??
What does it means? What are other possible values instead "plain"?
It's a simple trick to find the argument we're interested in:
github.com/esp8266/Arduino/issues/2129
You can use numbers as indexes. Thanks for watching!
Thanks :)
This code doesnt work for ardujson 6
Hi, can you please help in creating a standalone system ... in which we can control a servo or any appliance from a website .... as esp8266 gets different ip everytime in same or different wifi ... how can we do this globally
That would require setting up a server on the internet with which the ESP8266 should communicate. Your requests should be sent to the server, and the ESP8266 should constantly check for new requests on the server. Try watching our Cayenne video for an example on how to do it using a 3rd party service.
Thanx for the valuable reply ... Can you please highlight the topic need to cover to do the same without third party service , so that i can build a independent system.....
How to add JSON Library to arduino?
As it's shown on this video series.
can we POST command to send images to ESP8266 and the display these on tft
Yup. I trust that you're able to figure out the display part. For uploading have a look at:
tttapa.github.io/ESP8266/Chap12%20-%20Uploading%20to%20Server.html
I'm also making a video on a drag-and-drop web interface. Stay tuned!
@@datasith Thanks a lot for the reply:)
I want to send the mpu6050 imu sensor's rotation and acceleration values to the webpage.
Can you help me out?
Certainly! First try an example sketch to get the MPU6050 data and print it to the Serial monitor. Then, use the code in this video: ruclips.net/video/8xqgdXvn3yw/видео.html. Modify it so that instead of using the DHT-22 sensor readings, it uses the MPU6050's!
HTH
yeah thanks!
I tried as you said and i was able to print it on the serial monitor.
I want to send the data by sending post requests to a php page on the server.
Sorry!
I didn't get the video you posted.I cannot use the weather url's and location.
I just want that esp8266 should fetch data from the mpu6050 and send http POST requests to the php page on the server.
On the video we mentioned, the code illustrates how to construct a GET request sent to a server (using *client.print()*). You need to change the code and use it to send a POST request to your PHP page's URL. Inside the request, you'll need to include the data as part of the request. See this example:
github.com/esp8266/Arduino/issues/1853#issuecomment-249169974
Another option is to use the HTTPClient object, for which we don't have any examples in our videos yet, but there's quite a few out there!
Good tutorial but doesn't need the disco music
Guess we'll agree to disagree :)
Can you please add a tutorial to send a json to some other server
Will do! Thanks for watching!
Hi can I use mit app inventor to send the pan tilt data? If so can you please help me how to do it.. Thks
I haven't used App Inventor, but it looks possible. Substitute the URL to your IP address using this example: stackoverflow.com/questions/26572060/app-inventor-2-post
But sir if you want to control the servo from an android phone how are you doing it if you are not using mit app inventor? Is there a better way?
I'm on the side of "whatever works" :)
Personally, I've used Android Studio to develop simple apps like this one for controlling servos.
Once you're familiar with App Inventor, I encourage you to try it!
@@datasith OK sir.. Thks a lot for your help :)
What will be the URL if we have to do same using Browser
Well thanks for your project !!
I didn't know jay z can code
JsonObject& jObject = jBuffer.parseObject(data); has a error
Double-check your code, and make sure the ArduinoJson library is installed. Thanks for watching!
no the error comes when i code this command specifically
why not just use pan = server.arg("pan"); and tilt = server.arg("tilt");
Interesting if it works (I haven't tried your way). When I made this vid you could only get the string passed as a URL parameter by using server.arg("plain"). Things might have changed since then. My logic was that I wanted to use JSON, so the argument is a formatted string that reads {"pan":A_VALUUE,"tilt":ANOTHER_VALUE}. It could pass each value as URL parameters, one called "pan" and another called "tilt", and your suggestion would work. However, JSON is the standard way of passing data so that's why you need the extra code.
@@datasith I see yes I use it when passing data from forms so an input box could have the name "User" and you could then use server.hasarg("User"); to detect it and String value = server.arg("User"); to get it.
Awesome, thanks for sharing. This was definitely not possible a couple of years ago :)
Loud Intro compared to the video! Good Tut otherwise.
Good tut all around, especially the intro!
thank you so much, very hepful
You're welcome, thanks so much for watching!