Introduction: Temperature Sensor Web Display With the ESP8266
So I just had to get one of the ESP8266 chips and give it a try.
I was really intrigued by the size and also the possibility of using it as a stand alone system. I bought one online from AliExpress for a few dollars and waited the necessary month for delivery but all was well when it eventually arrived.
Step 1: What I Used
For my trial I wanted to use the ESP8266 to read a digital thermometer and transfer the results to a web site for visualization.
Here's what I used:
1 Keyes Arduino Compatible DS18B20 Digital Temperature Sensor
1 Lithium ion battery 3.7v (which I salvaged from an old digital camera).
Step 2: Connecting Everything Up
Well I won't go through all the nitty gritty of the wiring as there are better instructables out there but the attached diagram is a good starting point
The main points are:
1. I used a mini breadboard to connect the ESP and the Thermometer to the battery.
2. I made use of a USB to TTL converter (also bought from AliExpress). Makes life nice and easy in order to upload your code to the ESP board.
3. Arduino IDE used to write and upload the program
Step 3: The Arduino Code
So this is the beauty if the ESP8266. We can avoid having to use an arduino board at all and just use the ESP itself.
My program simply:
1. Reads the temperature sensor
2. Sends the data to a web page
3. Puts the ESP board into sleep mode.
Step 3 is the most critical since we want this to run on a battery and therefore use as little power as possible. We do this by invoking the ESP's deepSleep() command, passing the function a duration for when it is to wake up again. As a result the program only ever runs once, and only as far as the deepSleep() command. When the board wakes up it performs a reset and starts the program again.
The following is the main snippet:
Temperature = sensors.getTempCByIndex(0);
t = Temperature.toFloat() * 100;
//I multiply it by 100 so that I can pass a full integer to the web page
//At the web page I then divide by 100 to get the full decimal value.
Temperature = String(t);
// Why "byIndex"? // You can have more than one IC on the same bus.
// 0 refers to the first IC on the wire
sendToWeb(Temperature); // My web page is a simple PHP page which expects a single parameter
// I simply do a HTTP GET to pass the data.
ESP.deepSleep(SLEEPTIMEINSECONDS * 1000000);
delay(1000); //Should never get here
Step 4: The Web Page
The web site is composed of two aspects:
1. A PHP page which accepts the temperature posts and writes the data to a txt file with the corresponding date and time of the temperature reading. Watch out for the time zone your web server is in. I found my website was sitting somewhere in the US ( I'm in Europe) and saving the US local date time. This was easily fixed by setting the time zone in the PHP code.
2. A HTML + javscript page which displays the temperature chart.