Wemos d1 peticiones http a node red

Vídeo

A continuación, encontrara el vídeo en donde se explica el funcionamiento del circuito.

Acerca del proyecto

En este post vamos a enviar peticiones http desde una placa wemos D1 hacia un servidor creado con node-red, vamos a ver la conexión que necesitamos en la placa, las librerías con las que vamos a trabajar para poder utilizar el protocolo http y en node red vamos a crear un pequeño servidor utilizando los nodos http.

Conocimiento previo

Para realizar este proyecto se requiere conocimiento previo de los siguientes temas, si aun no has trabajado con lo que se menciona en la siguiente tabla, allí están los links a los post para que puedas dar un repaso adicional o puedas recordar el conocimiento necesario para poder realizar este proyecto.

¿Qué vamos a hacer?

Primero que todo vamos a entender cómo funciona la conexión entre la placa wemos D1 y el servidor donde tenemos instalado con node red; en la placa wemos D1 no tenemos que hacer ninguna conexión, ya que esta cuenta con todos los componentes electrónicos necesarios para funcionar lo único que ni tamos hacer es conectarlo al computador y tener previamente instalado en el equipo el entorno y de arduino configurado para trabajar con el ESP8266.

Ahora en nuestro mismo equipo de cómputo vamos a instalar todo el entorno de node-red para poder crear el servidor y poderle enviar las peticiones get y post que vamos a trabajar en este contenido.

Observemos la siguiente imagen:

El equipo de cómputo se va a conectar a una red local donde nos va a dar una dirección IP, esta dirección IP es la que vamos a utilizar para configurar el servidor de node-red y para indicarle a la tarjeta wemos D1 donde tiene que ir a buscar el servidor, es decir cuando el servidor node-red arranque la dirección IP que posee es dónde vamos a hacer las peticiones get y post.

Ahora nosotros estamos trabajando en una red local pero también podemos trabajar en la nube, nosotros tenemos un servidor y ese servidor tiene una dirección IP o un nombre de dominio, la tarjeta wemos D1 también se puede conectar donde hay que indicarle en la configuración de conexión el nombre de dominio o la IP.

Por último no se conecta en el puerto 1880, esta configuración también se la podemos cambiar pero por defecto vamos a dejar ese puerto cuando estemos en la tarjeta wemos D1 también le tenemos que indicar el puerto donde se va a conectar para que la conexión sea satisfactoria.

HTTP

En el post HTTP explico todo lo relacionado con este protocolo, básicamente es la conexión entre un cliente y un servidor donde donde el cliente realiza una petición al servidor: get, post, put, entre otras, y ésta retorna una respuesta con un estado (200,404,500) además de un mensaje que lo podemos encapsular en: texto plano, formato xml o cómo vamos a trabajar en este post que es en formato json. A continuación solamente se va a explicar los métodos que podemos trabajar con node-red, y unas cuantas respuestas que nos puede devolver el servidor:

Métodos peticiones

Las peticiones básicamente son formas de solicitar información a un servidor donde contiene la url, el método y la información de lo que solicitamos al servidor, las siguientes peticiones son las que vamos a trabajar en este contenido, aunque cabe aclarar que no red soporta la petición get, post, put y delete.

GET

Es una petición que solamente se debe utilizar para solicitar recursos al servidor, normalmente se utiliza para recuperar registros o para poder traer información de datos que ya se encuentran almacenados en el servidor.

POST

Es un recurso que se utiliza para enviar información por medio de un objeto normalmente de tipo json la cual nos va a retornar al igual que la información que se acaba de guardar en el servidor, básicamente se utiliza para cuando queremos guardar alguna variable o queremos enviarle datos al servidor.

Métodos respuesta

Los códigos de respuesta del protocolo http nos indican si la petición que hemos solicitado desde el cliente al servidor ha sido aceptada o ha presentado algún error, con estos códigos podemos identificar cada una de esas excepciones o podemos indicar que la petición ha sido satisfactoria y que la respuesta va a ser satisfactoria, para este ejemplo: vamos a trabajar con dos respuestas que nos va a devolver el servidor que es el código 200 y el código 404.

200

Las respuestas 200 significa que la petición ha sido satisfactoria y lo que hemos enviado a guardar o a solicitar de recurso ha tenido éxito y el servidor ha podido completar el proceso solicitado.

404

La respuesta 404 indica que el servidor no ha podido encontrar el recurso específico o que a generado un error Al momento de procesarla solicitud que estamos enviando.

Node red

Una vez entendido todas las definiciones mencionadas anteriormente y tener instalado node-red procedemos a crear las peticiones get y post que vamos a trabajar en este contenido, vamos a explicar el flujo que vamos a crear para esta petición dónde tenemos un cuadro de los nudos que hemos trabajado con sus características y vamos a dejar el código json para que puedan importar el flujo directamente a su entorno de trabajo.

Petición get

Para crear la peticion get y dar una respuesta json vamos a crear el siguiente flujo de nodos.

A continuación, tenemos los nodos que estamos usando en la petición get y su configuración.

Nodo	Nombre	Configuración
	http in	Method get URL /sensor
	template	Name Page Property msg.payload Template {"sitio":"codigoelectronica.com","key":"{{payload.key}}","device":"{{payload.device}}","serial":"{{payload.serial}}"}
	change	Name Set Headers Rules [set: msg.headers] [to: (json):{}] [set: msg.headers.content-type] [to: (string):{application/json}]
	http response	statusCode: Es el código de respuesta que vamos a retornar al servidor, por defecto es 200 pero podemos colocar cualquier código de respuesta http.

Con el nodo http in creamos un punto de entrada al servidor, en este se configura el recurso url donde para la petición get, esta información se la pasamos al nodo template donde obtenemos de la variable payload los parámetros que se enviran desde la petición, qui podemos procesar los datos y manipularlos según la necesidad de la aplicación, en templare creamos la respuesta json que le enviaremos al cliente. Ahora el el node change creamos los heades que usara http out, principalmente la respuesta en formato json y por ultimo tenemos el nodo de http response donde podemos colocar el código de estado o respuesta http que le indicara al cliente si su petición se proceso correctamente o tubo algún error.

A continuación tenemos el código json para que lo pueda importar en node-red:

[{"id":"88852082.09755","type":"http in","z":"ff573ca0.4b9f1","name":"","url":"/sensor","method":"get","upload":false,"swaggerDoc":"","x":290,"y":200,"wires":[["93402a0c.cb78e8","26d01be1.cba554"]]},{"id":"93402a0c.cb78e8","type":"template","z":"ff573ca0.4b9f1","name":"Respuesta json","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"{\"sitio\":\"codigoelectronica.com\",\"key\":\"{{payload.key}}\",\"device\":\"{{payload.device}}\",\"serial\":\"{{payload.serial}}\"}","output":"json","x":480,"y":200,"wires":[["3571c1f5.c4d1fe"]]},{"id":"565ee1ff.72f09","type":"http response","z":"ff573ca0.4b9f1","name":"","statusCode":"200","headers":{},"x":740,"y":280,"wires":[]},{"id":"26d01be1.cba554","type":"debug","z":"ff573ca0.4b9f1","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","statusVal":"","statusType":"auto","x":470,"y":140,"wires":[]},{"id":"3571c1f5.c4d1fe","type":"change","z":"ff573ca0.4b9f1","name":"Set Headers","rules":[{"t":"set","p":"headers","pt":"msg","to":"{}","tot":"json"},{"t":"set","p":"headers.content-type","pt":"msg","to":"application/json","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":570,"y":280,"wires":[["565ee1ff.72f09","a0dbdccd.fcafd"]]},{"id":"a0dbdccd.fcafd","type":"debug","z":"ff573ca0.4b9f1","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","statusVal":"","statusType":"auto","x":710,"y":340,"wires":[]}]

Petición post

Para hacer una peticion post cambiamos el metodo en el nodo http, adems vamos a realizar la prueba con el programa postman, aunque puede usar cualquiera con que puedan llamar una url con este tipo de peticion es suficiente.

En esta peticion post enviamos parametros y retornamos una respuesta json, observemos la siguiente imagen:

A continuación, tenemos los nodos que estamos usando en la petición http y su configuración.

Nodo	Nombre	Configuración
	http in	Method post URL /sensor
	template	Name Page Property msg.payload Template {"number":"{{payload.data}}","text":"{{payload.name}}","key":"{{payload.key}}","device":"{{payload.device}}","serial":"{{payload.serial}}"}
	change	Name Set Headers Rules [set: msg.headers] [to: (json):{}] [set: msg.headers.content-type] [to: (string):{application/json}]
	http response	statusCode: Es el código de respuesta que vamos a retornar al servidor, por defecto es 200 pero podemos colocar cualquier código de respuesta http.

Con el nodo http in creamos un punto de entrada al servidor, en este se configura el recurso url donde para la petición post, esta información se la pasamos al nodo template donde obtenemos de la variable payload los parámetros que se enviran desde la petición, qui podemos procesar los datos y manipularlos según la necesidad de la aplicación, en templare creamos la respuesta json que le enviaremos al cliente. Ahora el el node change creamos los heades que usara http out, principalmente la respuesta en formato json y por ultimo tenemos el nodo de http response donde podemos colocar el código de estado o respuesta http que le indicara al cliente si su petición se proceso correctamente o tubo algún error.

A continuación tenemos el código json para que lo pueda importar en node-red:

[{"id":"2001bc6e.86d4f4","type":"http in","z":"ff573ca0.4b9f1","name":"","url":"/sensor","method":"post","upload":false,"swaggerDoc":"","x":310,"y":460,"wires":[["9d11828c.e651e","26d01be1.cba554"]]},{"id":"9d11828c.e651e","type":"template","z":"ff573ca0.4b9f1","name":"Respuesta json","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"{\"number\":\"{{payload.data}}\",\"text\":\"{{payload.name}}\",\"key\":\"{{payload.key}}\",\"device\":\"{{payload.device}}\",\"serial\":\"{{payload.serial}}\"}","output":"str","x":500,"y":460,"wires":[["fe61966.dd0c368"]]},{"id":"fe61966.dd0c368","type":"change","z":"ff573ca0.4b9f1","name":"Set Headers","rules":[{"t":"set","p":"headers","pt":"msg","to":"{}","tot":"json"},{"t":"set","p":"headers.content-type","pt":"msg","to":"application/json","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":530,"y":540,"wires":[["2e1f7d7a.a34052","a0dbdccd.fcafd"]]},{"id":"2e1f7d7a.a34052","type":"http response","z":"ff573ca0.4b9f1","name":"","statusCode":"200","headers":{},"x":720,"y":540,"wires":[]},{"id":"26d01be1.cba554","type":"debug","z":"ff573ca0.4b9f1","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","statusVal":"","statusType":"auto","x":490,"y":400,"wires":[]},{"id":"a0dbdccd.fcafd","type":"debug","z":"ff573ca0.4b9f1","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","statusVal":"","statusType":"auto","x":730,"y":600,"wires":[]}]

Wemos D1

Wemos D1 Wifi tiene el formato de la clásica placa Arduino UNO R3 pero con la diferencia que su chip principal es el conocido ESP8266. Eso ofrece varias ventajas, ya que se puede programar igualmente desde el IDE de Arduino mediante el core correspondiente y además disponemos de un chip con conectividad Wifi muy potente. Por otro lado, la mayoría de pines son los mismos aunque no iguales dadas las diferencias entre ambos sistemas. Los pines digitales de D0 a D13 están disponibles así como el bus I2C y SPI, sin embargo el chip solo tiene una entrada analógica A0. También debes tener en cuenta que todo el sistema funciona a 3.3V por lo que todo lo que conectes debe respetar dicho voltaje.

Código wemos d1

// Paso 1
#include <ESP8266WiFi.h>
#include <ESP8266HTTPClient.h>

// Paso 2
#define SERVER_IP "192.168.0.3:1880"

// Paso 3
#define KEY "U47FHWSB38F"
#define DEVICE "WEMOS-D1-01"
#define SERIAL "wd1-1"

// Paso 4
#ifndef STASSID
#define STASSID "NOMRE_DE_LA_RED"
#define STAPSK  "CONTRASEÑA"
#endif

// Paso 5
WiFiClient client;
HTTPClient http;

void setup() {
    // Paso 6
    Serial.println("Iniciando Wemos D1");
    Serial.begin(115200);
    Serial.println();

    // Paso 7
    WiFi.begin(STASSID, STAPSK);
    Serial.println("Conectando a la red WiFi");
    while (WiFi.status() != WL_CONNECTED) {
        delay(500);
        Serial.print(".");
    }
    Serial.println("");
    Serial.print("Connected! IP address: ");
    Serial.println(WiFi.localIP());
}

void loop() {
    // Paso 10
    if ((WiFi.status() == WL_CONNECTED)) {
        sendGet();
        sendPost();
    }
    delay(10000);
}

// Paso 8
void sendPost() {
    Serial.println("[HTTP] Iniciamos la peticion POST");
    // Paso 8.a
    String serverPeticion = "http://" SERVER_IP;

    // Paso 8.b
    serverPeticion += "/sensor";
    
    // Paso 8.c
    http.begin(client, serverPeticion);
    http.addHeader("Content-Type", "application/json");

    // Paso 8.d
    long randNumber = random(0, 20);
    char randNumberString[40];
    sprintf(randNumberString,"%u",randNumber);
    
    // Paso 8.e
    String jsonData = "{\"key\":\"" KEY "\",\"device\":\"" DEVICE "\",\"serial\":\"" SERIAL "\",\"data\":\"";
    jsonData += randNumberString; 
    jsonData += "\",\"name\":\"oscar\"}";

    // Paso 8.f
    int httpCode = http.POST(jsonData);

    // Paso 8.g
    if (httpCode > 0) {

        // Paso 8.h
        Serial.printf("[HTTP] POST... code: %d\n", httpCode);
        if (httpCode == HTTP_CODE_OK) {
            const String& payload = http.getString();
            Serial.println("Respuesta Json:\n<<");
            Serial.println(payload);
            Serial.println(">>");
        }
    } else {
        Serial.printf("[GET] Petición post fallo, error: %s\n", http.errorToString(httpCode).c_str());
    }
    // Paso 8.i
    http.end();
}

// Paso 9
void sendGet() {
    Serial.println("[HTTP] Iniciamos la peticion GET");

    // Paso 9.a
    String serverPeticion = "http://" SERVER_IP;

    // Paso 9.b
    serverPeticion += "/sensor";

    // Paso 9.c
    serverPeticion += "?key=" KEY "&device=" DEVICE "&serial=" SERIAL;
    
    // Paso 9.d
    http.begin(client, serverPeticion);
    http.addHeader("Content-Type", "application/json");
    
    // Paso 9.e
    int httpCode = http.GET();

    // Paso 9.f
    if (httpCode > 0) {
        // Paso 9.g
        Serial.printf("[HTTP] GET... code: %d\n", httpCode);
        if (httpCode == HTTP_CODE_OK) {
            const String& payload = http.getString();
            Serial.println("Repuesta Json:\n<<");
            Serial.println(payload);
            Serial.println(">>");
        }
    } else {
        Serial.printf("[GET] Petición get fallo, error: %s\n ", http.errorToString(httpCode).c_str());
    }
    // Paso 9.h
    http.end();
}

1. Iniciamos con las librerías esp8266 para la conexión de wi-fi y para las peticiones http que va utilizar este cliente.
2. Vamos a indicar el servidor en este caso es la ip de dónde se encuentra instalado node-red en la red local, adicionalmente colocamos el puerto donde se está ejecutando este servidor.
3. Vamos a indicar unas variables para identificar este dispositivo para poder detectar qué cliente es el que está haciendo la petición, puede ser opcional, he creado 3 variables y le coloca dos valores que pueden ser aleatorios.
4. Proporcionaremos el nombre de la red y la contraseña para que la tarjeta se pueda conectar.
5. Ahora vamos a cargar los objetos del cliente y de las peticiones http que vamos a utilizar en el código.
6. Para poder hacer dibujo y poder visualizar la petición y la respuesta del servidor inicializar hemos la comunicación serial para poder ver todos los mensajes en la consola serial.
7. Ahora con el begin del objeto WIFI le vamos a pasar el nombre de la red y la contraseña para que se pueda autenticar y se pueda conectar a la red wi-fi local, con estatus lo que vamos a hacer es verificar si el dispositivo se ha conectado correctamente de lo contrario lo que va hacer es intentar se conectar hasta que pueda.
8. Ahora procederemos a crear la petición post dónde vamos a enviar unas variables al servidor y éste nos va a responder información todo eso en el formato json.
   1. Vamos a crear una variable de tipo String donde le vamos a indicar el protocolo http y el servidor donde va hacer la conexión.
   2. Procederemos a crear el recurso dónde va a ir a solicitar la información que en este caso es en "/sensor" como hemos dejado en el nodo "http" de node-red para la petición post.
   3. Con begin de http procederemos a setear el objeto cliente y la variable que acabamos de crear con la dirección del servidor y con el recurso que vamos a solicitar.
   4. Ahora vamos a crear un número aleatorio para enviarlo en las variables de la petición post, este número aleatorio lo vamos a convertir en carácter para poderlo concatenar con el la variable de texto que vamos a crear a continuación.
   5. Ahora vamos a crear una variable de texto donde vamos a concatenar todas las variables que vamos a enviar al servidor incluyendo los datos del punto 3 además del número aleatorio que acabamos de crear, tenga en cuenta que esto es un texto plano pero debemos dejar la estructura en formato json para qué la librería http la pueda interpretar .
   6. Vamos a crear la petición post con el objeto http a ésta como parámetro le vamos a colocar el texto plano con todas las variables qué vamos a enviar al servidor, adicionalmente este parámetro nos va a devolver la respuesta en el código http que devuelve el servidor qué vamos a interpretar a continuación.
   7. Esta respuesta nos está doliendo en un número Así que en este condicional podemos decir si es el código 200, el 404, otro código de respuesta http en este caso nos interesa saber si se retorno una respuesta para eso vamos a indicar que si el código es mayor a 0 sabemos que el servidor ya nos respondió algo.
   8. Ahora HTTP_CODE_OK pertenece a la librería http, es la respuesta 200 que estamos comparando para verificar si se ha retornado con satisfacción lo que hemos enviado al servidor en la petición post, luego vamos a utilizar getString del objeto http para obtener el mensaje que nos devuelve el servidor que en este caso es un texto plano pero con la estructura json.
   9. Por último damos por terminado la petición http
9. Procederemos a crear la petición get dónde vamos a solicitar información al servidor y las variables se las vamos a setear por la url.
   1. Vamos a crear una variable de tipo String donde le vamos a indicar el protocolo http y el servidor donde va hacer la conexión.
   2. Procederemos a crear el recurso dónde va a ir a solicitar la información que en este caso es en "/sensor" como hemos dejado en el nodo "http" de node-red para la petición get.
   3. A la variable texto creado anteriormente le damos a concatenar los parámetros ya que éstos se envían por la url obsérvese que estos parámetros son los que hemos creado en el punto 3.
   4. Con begin de http procederemos a setear el objeto cliente y la variable que acabamos de crear con la dirección del servidor y con el recurso que vamos a solicitar.
   5. Con get del objeto http vamos a crear esta petición, pero aquí no vamos a aceptar ningún texto plano ya que la información que le vamos a enviar al servidor la estamos colocando en la url.
   6. Esta respuesta nos está doliendo en un número Así que en este condicional podemos decir si es el código 200, el 404, otro código de respuesta http en este caso nos interesa saber si se retorno una respuesta para eso vamos a indicar que si el código es mayor a 0 sabemos que el servidor ya nos respondió algo.
   7. Ahora HTTP_CODE_OK pertenece a la librería http, es la respuesta 200 que estamos comparando para verificar si se ha retornado con satisfacción lo que hemos enviado al servidor en la petición post, luego vamos a utilizar getString del objeto http para obtener el mensaje que nos devuelve el servidor que en este caso es un texto plano pero con la estructura json.
   8. Por último damos por terminado la petición http
10. Por último en el log lo que vamos a hacer es primero verificar si tenemos conexión al wi-fi de lo contrario esta misma librería intentar hacer la conexión Y por último llamaremos a los métodos get y post que acabamos de crear.

Pruebas de funcionamiento

Procederemos a realizar las pruebas para ello vamos a compilar el código hilo cargaremos a la tarjeta wemos D1, queremos la terminal serial para ver los logs que está generando y nos dirigimos a node-red dónde vamos a ejecutar la aplicación y a desplegar con deploy, vamos a colocar algunos nodos de log para poder visualizar la información que estamos recibiendo y de los clientes y lo que le vamos a enviar.

Prueba get

La prueba con get es la siguiente cuando inicia en nuestra tarjeta wemos D1 automáticamente intentará conectarse a la red WiFi cuando pueda realizar la conexión correctamente a intentar realizar la petición post como podemos observar en la siguiente imagen:

Desde la terminal serial que nos está mostrando el entorno arduino podemos observar qué va a realizar la petición get, esta petición get es recibida por node-red con el nodo http in y podemos observar el primer log donde estamos recibiendo la información que le estamos enviando en la url, estos son los datos que vimos en el punto 9.C del código que tenemos para la tarjeta wemos D1.

También podemos observar que el nodo template recibe el Json donde manipula la información y la está mezclando para generar una nueva respuesta en formato json que la enviamos al response de http, podemos observar esta salida en la terminal debug de node-red, si volvemos al entorno arduino en su terminal serial también podemos observar la respuesta que estamos obteniendo desde el método get, donde podemos manipular la información si usamos la librería de json ara arduino.

Prueba post

Para probar el método post vamos a seguir las mismas indicaciones que utilizamos en el método get, básicamente hacemos la solicitud de la información hacia node-red enviándole como parámetros en formato json los datos que vamos a guardar o a procesar en el servidor, observemos la siguiente imagen:

Desde la terminal serial de arduino podemos observar que se está realizando la petición, cuando vemos en el debut de node-red observamos que estamos recibiendo en formato json los parámetros enviar desde arduino, obsérvese el parámetro Data que es el valor numérico aleatorio que estamos enviando toma distintos valores, si vemos más de dos los podemos ver que el número cambia y con esto podemos enviar tanto valores numéricos como texto hacia node-red desde la placa wemos d1.