Wifi ESP13 shield
Verouderd vanwege de seriële aansluiting naar de Arduino. Dit maakt geen object dat kan communiceren met een MQTT bibliotheek.

Beschrijving
http://blog.cindypotvin.com/connecting-esp8266-to-your-network/ Wifi comes in many sizes and prices (overview). This ESP8266 shield is used in a Internet of Things project. A manual can be found at the site of the Chinese developers.

Before starting

A Wifi shield always consumes a lot of power. In fact too much to just feed a project including Wifi trough USB. This shield always needs an external 9Vdc power supply connected to the shield. Although all LEDs will light as they are supposed to do, your shield will not work properly without an extra power supply. The red LED signals a power supply, even when power is too low. The blue LED signals activities by blinking.

When programming Arduino with IDE SW1 must switch to off position. SW1 refers to the entire block so to both switches at the same time. This must be done to disconnect the serial connection between the 2 boards. More specific is this done to disconnect the direct serial connection between the ESP8266 chip and for example an Arduino Uno. Must I switch it back to ON after programming? Yes if you are using transparent modus since the serial connection is made through this port. No if you would want to use your ESP8260 stand-alone. But you must reflash it to achieve that state. Reflashing is not part of this tutorial.

First connection

alt Assuming that everything is still set to Factory Defaults the shield acts as a Wifi network. It takes 2 steps to configure your shield:
  1. You can connect to this network station which is called DoitWiFi_Config. This usually is very easy to do with any mobile phone. Go to your Wifi configuration and connect to the DoitWiFi_Config.

  2. Once connected to this network you can find the built-in server at 192.168.4.1. What you should get is something like image 2. You can now use your device as stand-alone network.
But this means that you have to change your Wifi connection every time you want to use your IoT project. And that is not very practical. So you want to have this IoT device connected to your router and let it have an IP-address by DHCP. To do so in the configuration screen Station should be enabled to yes. Then select your router from the AP-list and add the password. From now on this IoT device can be addressed as for example 192.168.2.4 from anywhere in your local home network.

Next adjust the router so that this address will be fixed from now on.

Fixed addressNameWebsite
192.168.2.4FrontDoorIoT
192.168.2.10GreenhouseMonitor
192.168.2.15WindowStrawberries
192.168.2.19PropagatorMonitor

When the Station: radio button is set back to No then the IP-address will be 192.168.4.1 again and only reachable through its own WiFi connection again.

192.168.4.1 First communication
We want to achieve that we can tell our IoT how to set its outputs and we want to receive sensor values acquired by our IoT project. We want to do this with a PHP program that is optimized for mobile phones. Basically is the Arduino the webserver and the PHP program is the client.

Outputs
Upload this ESP13-1 sketch and when uploaded open the Serial Monitor. Next try 192.168.2.4:9000?switch1=on&switch2=aut& in the browser of any computer on your LAN. You will receive the entire GET request in your Arduino Serial Monitor. It should look something like this:

GET /?switch1=on&switch2=aut& HTTP/1.1
Host: 192.168.2.3:9000.0 (X11; Ubuntu; Linux x86_64; rv:47.0) Gecko/20100101 Firefox/47.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate
Connection: keep-alive

This is basically how an µcontroller (IoT project) receives data (=commands) from a web page using this shield.

Inputs
Now we also want to return an answer from our IoT project to the calling website. To do so first upload this ESP13-2 sketch. Then you can open the ESP13-2.php page. So through this site you can switch on/off a light at our office and read our sensors.

192.168.4.19 Propagator first communication
We want to achieve that we can call this device from any browser by using 192.168.2.19:9000. We should receive a web page with all current values shown. The request that is send by the browser looks like:

GET / HTTP/1.1
Host: 192.168.2.19:9000
User-Agent: Mozilla/5.86_64; rv:52.0) Gecko/20100101 Firefox/52.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate
Connection: keep-alive
Upgrade-Insecure-Requests: 1

We DO receive the request and we also print an answer to the serial port. However the browser screen stays white and the TAB keeps telling me "Connecting". That changes after inserting
Serial.print("Content-Length: 102"); //Finish html after amount of chars