ESP8266 Web Client For API Access Using Arduino IDE (Mac OSX and Windows) | Weather Station Demo

[Music] hi I'm Cisco with acrobotic and I'm here to show you another tip for working with your esp8266 microcontroller in other videos we've shown you how to run a server on the espd 266 that responds to http requests that are sent to it another big use for the espd 266 is to send out requests to other servers to do this we need to make use of a web client instead of or in addition to the web server as you'll see in this video we'll make use of the esp8266 Wi-Fi client library to build a web client we'll use the client to request weather information from the Weather Underground servers we'll then use our old web server code to display that weather information inside of a very simple web page so the way a web client interacts with a web server is through what's called an API you can read more about apis using the link in the description but we can just quickly think about them as a collection of URLs that allow the client to tell the server to perform a certain action if you recall from our web server code we had an API comprised by two URLs one of them printed a simple hello world message on a web page and the other one toggle an LED on and off in the case of the Weather Underground servers we need to take a couple of steps in order to access their API the first thing we'll need is to create an account we can up on the top right corner click on join and fill out the information in the interest of time we've already done this so we're going to go ahead and log to our [Music] account we you can then go to the more section up in the top navigation bar and click on weather API for developers if this is a first time you're going through this process you'll be presented with a series of questions in our case we've already gone through the key settings option for requesting what's called an API key an API key allows us to access the Weather Underground servers privately and it makes sure that if you're accessing in some data and I'm accessing the same data our accounts stay separate so we'll need to keep track of this key information when we move on to writing the code in the Arduino IDE with the API key information we can actually go ahead and already request some data from the Weather Underground API so if I open a new tab on the browser and I enter the following URL and I go ahead and paste my API key followed by conditions letter q and the city and Country for which I want to request weather information in this case I'm going to be choosing Sydney Australia CU our friends from Down Under are actually watching a lot of our videos we finished the whole thing with a Json and what comes back is a Json formatted response including all or a lot of weather information from Sydney Australia now we're going to be using the espd 266 and that Wi-Fi client library in order to make the same requests we'll make a copy of our simple web server code open up the file for editing and because the response is formatted in Json as we've done in other videos we're going to be using the Arduino Json Library make sure that you have it installed using the library manager menu from your Arduino ID I already have it installed so I'll just go ahead and close the window the next thing we're going to need is three constant values I'm going to be using Define statements to specify them the first is our API key and as you saw before we'll use it in order to construct the URL that will specify next will be the location and I'll name this Wu location and I'll set it to be Sydney Australia but we need to put the country first lastly I'll just specify the URL of the Weather Underground API I'll name it wurl one more thing I'll need is going to be a variable that I'll use to hold that response that comes from the servers I'll set it out to be a static Char array that I'll name response buffer or rest buffer for sure I'll make it really big cuz as you saw a lot of information comes back from the server I'll simply add one more route to our server I'll call it get data and it will run a function also called get data that I'm about to write and in that function we'll send out the request to the Weather Underground servers as always that function returns nothing and it takes no parameters and the first thing we'll build is the actual request that is going to be sent out to the server when we use the browser all that request was put together by the browser itself so here we need to specify things manually I'll declare it as a constant character array that I'll name request and I'll use different lines in order to make it a a little bit more readable the first thing will be the method that we'll use it's going to be the get method and then it's followed by the path following the URL that we're sending the request to so if you recall from what we type in the browser this look like API our key which we've Define as W API key then conditions the letter Q the location which we've defined as Wu location and it ended in Json we also need to specify the version of HTTP that we're using this whole thing needs to be finish with a carriage return and a new line character other things that were specified by the browser and now we need to do manually is the user agent to accept everything from everywhere to close the connection once it's done and lastly another set of carriage return and new line characters just for seeing what this translates to I'm going to use a Serial print statement in order to visualize it on the seral [Music] monitor we also want to add the host parameter we'll set it to be the URL followed by a courage return and a new line character and I'll go ahead and fix this little typo now that we have the request we can instantiate a Wi-Fi client object and use it in order to First connect to the server we'll specify Port 80 which is the default [Music] Port then to send out the request and lastly to flush out the communication between the client and the server we'll give the server a second to respond then we can use the connected method of the client object to know that we're in fact connected to the server and if data is available in the response we use the available method to process it the way we're going to process it is by putting it inside our response buffer and I'll be using an index in order to keep track of it the way to access the data is using the read method of the client object between reads we'll just add a small delay I'll declare the index as a 16bit onsite integer once all the data is processed I can go ahead and call the stop method and because the server is going to give me a whole lot of things in addition to the response that I'm interested in I'm going to do a simple trick if we go back to the browser we'll see that the part of the response that we're interested in begins with a curly brace we can use the string character method to find that curly brace inside of the response buffer that'll return a character pointer that I'll name Jason [Music] go ahead and fix this typo now that the data is stream we can go ahead and use the uino Json library to parse it I'll use a dynamic Json buffer because a static one creates problems due to the large size of the data as we've done in the past we'll be using the parse object method in order to extract the data that we want if we go back to the browser and look at the dat data we'll see that the top level of the Json response contains other parameters that we're not interested in what we really want is the current observation so we can parse the root object looking for that current observation now we can pick and choose the different weather parameters that we would like to display in my case I'm going to be choosing weather and the temperature in degre cels they will be of type string and I'll use the names of the keys as the variable names as a reminder for temperature Celsius is temp c and for the weather it's simply weather the last thing we'll want to do is send out the response to anyone requesting the data we'll use our server. send method in order to do this it'll be of type 200 and we'll send it as a plain text and we'll construct a message of typ string that will simply say temperature in celsius and the weather information so now we can open up the file in our Arduino ID make sure that the correct port and board are selected and connect the board to the computer and upload the code now we're ready to test it we'll open up the serial monitor reset the board get the IP address and go back to the browser type in the IP address followed by the path get data if everything goes according to plan you'll see the message we constructed that is the temperature in Celsius and the actual weather of the city that you chose we see that it's cloudy in Australia and so is here in Pas Arena if you like our videos you can go to our Channel and click the support button but whatever you do don't forget to like subscribe or leave us a comment until next time

Channel: datasith

Views: 33,204

Keywords: ESP32, ESP8266, Arduino, IDE, NodeMcu, Tutorials, Makers, Learn, Guide, IoT, Internet Of Things, Raspberry Pi, Wireless, Communication, Weather, Creative, Sensor, Python, Programming, C++, Beginner, Electronics, DIY, MicroPython, 3d Printing, CAD, Fusion 360, Education, Tutorial, Intro, Introduction, Web, Developer, HTML, Datalogger, Project, Sensors, Data, Visualization, Webserver, Server, Client, App, WebApp, Wemos, Robot, Robotics, Robots, Easy, Adafruit, Sparkfun, OS X, Windows, Linux, Embedded, Kickstarter, RC, Fun, Build, Engineering

Id: 8xqgdXvn3yw

Length: 14min 3sec (843 seconds)

Published: Sun Feb 26 2017