Back to Aaron's home page.
This example shows how to serve data from an analog input and write to a digital output via the Arduino Yun's built-in webserver using the Bridge library. For the analog input side, we will use the Arduino Yun to monitor temperature and humidity via a DHT22 sensor, and this data will be accessible from a web browser. On the digital-write side, we will be turning a simple LED on and off remotely via the web browser
Note 1: This example draws heavily from Arduino's Temperature Web Panel Example.
Note 2: The example goes step-by-step from unboxing the Arduino Yun to having a working system. I use a PC for this example running Windows 8.
Note 3: It is assumed that your PC is wirelessly connected to your WiFi router.
This is the list of software to have installed on your PC:
This video tutorial shows you how to configure your Yun's WiFi. I also find this video tutorial helpful.
Insert the microSD card into the Yun, and follow this tutorial to expand the Yun disk space. The tutorial shows how to split the SD card in two parts. The first part is formatted as FAT32 and could be read from any computer: you can use it to share files between your computer and your Yun. The second part contains the Linux file system. I somewhat arbitrarily chose to split the sd card down the middle: 4 GB for FAT32 and 4 GB for Linux.
You can address your Arduino Yun by its IP address or the name you give in the WiFi setup procedure. What if you don't remember or don't know them?
You can use the Arduino IDE software to easily determine the address of your Yun. In the Arduino IDE menu bar, go to Tools → Port. As an example, see the screen shot below. Here I have my Arduino Yun connected to my PC via USB, which is why you see "COM3 (Arduino Yun)". My Arduino Yun is also set up for WiFi, which is why you see "AaronYun at 192.XXX.X.X (Arduino Yun)". This gives me the IP address of the Yun (192.XXX.X.X) and the name of my Yun (AaronYun). If I disconnect the Arduino Yun from my PC and connect it to a wall outlet directly, the COM3 port will disapear, but I will still be able to connect to the Yun via WiFi and upload files and Arduio sketches.
It is useful to understand the basics of how the Arduino Yun can be used as a server. Basically, once the Yun is configured to connect via WiFi, you can create a client web page that will be uploaded on the SD card that can be accessed from your web browser. I find the following two articles to be very good in introducing this topic: Arduino Yun: Intro to web server and Arduino Yun: Sensor values to HTML page. If these links don't work, you can download the articles as PDFs here: Arduino_Yn_Intro_to_web_server.pdf and YunServer_Sensor_values_to_HTML_page.pdf. As a prerequisite before continuing on, you should carefully follow and replicate the exercise presented in the first tutorial (intro to web server), and at least skim through the second tutorial.
PuTTY and WinSCP make it easy to navigate the file structure of the Arduino Yun's SD card. I find the following article to be an excellent introduction on this topic: Yun - How to Use SD Card. If this link does not work, you can download the article as a PDF here: Yun - How to Use SD Card.pdf. As a prerequisite before continuing on, you should at least skim through this article.
The Arduino Yun should be connected to the DHT sensor and LED circuitry as shown in the schematic below. For power, the Yun is connected to a mini USB to USB cable, which is connected to a USB wall charger. For reference, a good article on the DHT sensor is provided by Adafruit: Adafruit tutorial on DHTxxx temperature humidity sensor.
The total hardware setup includes Yun + external circuitry (presented in figure above), the WiFi router (which doesn't necessarily need to be connected to the internet), and a PC with WiFi enabled. The basic block diagram of this setup is presented in the figure below.
Below is a screenshot of the webpage (which we can access from a browser like Firefox) that is used to send and recieve data from an Arduino Yun via WiFi. This is accomplished using the Yun's built-in webserver and the Bridge library. The webpage itself includes two radio buttons, labeled "LED on" and "LED off", which commands the Yun to turn an LED on and off. The Arduino Yun also collects sensor data (temperature and humidy) from a DHT sensor. At set intervals in time, the webpage requests this sensor data and prints the received data to the same webpage.
To make this all work, we need two elements: the Arduino sketch and the HTML webpage. The client webpage (which is stored on the SD card of the Yun and runs in your browser) is programmed to make a call to the following URLs once a second:
/arduino/temperature/0       This call is sent if the "LED off" radio button is pressed.
/aduino/temperature/1       This call is sent if "LED on" radio button is pressed.
I arbitrarily chose the URL calls /arduino/temperature/0 and /arduinotemperature/1 to signify to the Arduino Yun to turn the LED on and off, respectively. I could have chosen a totally different URL like /arduino/turnnoff and /arduino/turnon . Whatever I chose, it is important that it has /arduino/ in the first part of the URL. We will program the Arduino Yun to know what particular URL request translates to "LED on" and "LED off". The Arduino will read this URL request as a command and turn the LED on and off accordingly. Besides turning the LED on and off, the Arduino will also automatically send back temperature/humidity data to the webpage every time a URL request is made.
The Yun's onboard Atheros 9331 (running Linux and OpenWRT) is setup as a server, which is listening for these URL requests from the localhost. When a URL request is detected, the Atheros 9331 sends the URL as a command string to the Yun's onboard ATmega32u4 chip via the Bridge Library. These commands are called REST commands. The ATmega32u4 chip is programmed to listen for incoming REST commands. If one is recieved, then it reads the REST command (URL string), deterimines what the particular request is, and responds with the correct data, which it then sends back to the server via the Bridge libary. The server then passes this data on to the webpage. Once this is complete, the server listens for the next URL request, thus starting the process all over again. From the webpage's perspective, it makes a call to the Yun server every second, waits for the server response, loads the data recieves, and updates the webpage appropriately.
The files and folders inside the folder labeled "www" above are:
These files can be downloaded here.
To move the webpage files from your PC to the SD card of the Yun, you can place them in the sketch folder of the sketch that you will uploading. When you upload the sketch, the webpage files will be saved to the correct location on the Yun. To access the sketch folder from the menu screen in the Arduino IDE select the following menu options Sketch → Show Sketch Folder.
The HTML code for the main webpage (index.html) is presented below:
The Arduino code is presented below:
Afterer uplading the sketch and webpage files to the Arduino Yun you can use WinSCP to connect to the Yun and see where the webages are located on the SD card.
If you want to make updates to the webpage you can drag the files directly from your PC to the SD card using WinSCP. This method is much faster than having your files "piggy back" on an Arduino sketch that you upload via the Ardiuno IDE (i.e. using the sketch folder technique presented earlier). However, it is advised that you use the Arduino IDE to upload your webpage for the first time, since it creates the correct files for you in the correct directory.
Now open up a web browser like Fire fox and type the following into the address field:http://NAMEOFYOURYUN.local/sd/ where "NAMEOFYOURYUN" is the name you have given your Arduino Yun in the WiFi setup. You will see a list of all the webpages that are stored on the SD card.
Click on the name of your webpage (here we choose "WiFi_send_receive_example")
Let's turn the LED on.