Enchufe controlado desde tu propio servidor API-REST

English Version: https://dev.to/alfredodemiguel/plug-in-controlled-from-your-own-api-rest-server-168

Construir desde cero, un enchufe, que pueda ser manejado desde su propia wifi o desde internet, es un trabajo, que requiere conocer un poco de muchas cosas. Si decides acompañarme, veras:

• Como diseñar una pcb con KiCad.
• Como diseñar una caja con FreeCAD.
• Programación arduino de un Wemos D1 mini.
• Programación de un servidor API.
• Programación de una web para administración desde Internet.
• Meter las aplicaciones en contenedores Docker y subir las aplicaciones a Heroku.

El enchufe que vamos a hacer, es un enchufe, que toma la electricidad de la red, e internamente la transforma de 220v a 5v, para poder alimentar un Wemos D1 mini, y un pequeño rele, que es el encargado de dejar pasar los 220v según nuestras indicaciones. Además el enchufe, tiene dos capacidades adicionales y opcionales. La primera es enviar un email, cuando se activa. Y la segunda es ponerse en funcionamiento en caso de detectar movimiento. La configuración inicial se hace desde su propia wifi, y la administración de este enchufe se puede hacer desde su propia wifi o desde una web pública, que también crearemos nosotros.

Hay muchos temas a tratar, y por ello no voy a profundizar en ninguno, pero si voy a intentar dar las claves principales, para que te puedas hacer tu propia versión del enchufe, o si lo prefieres copiar el mio. Todos los diseños y el código lo tienes en: https://github.com/alfredodemiguel/Proyectos/tree/master/smartplug

DISEÑO HARWARE

Con el programa KiCad, tienes que seguir los siguientes pasos, para poder diseñar una pcb que puedas mandar fabricar, a uno de los muchos fabricantes

• El primero consiste en crear el esquema. Este punto es donde decides como tomaras las electricidad de la red, para alimentar el enchufe, cuando corresponda, y para alimentar el Wemos D1 mini, junto al rele, y un sensor de movimiento y unos leds. La lista de todos los elementos utilizados y los enlaces a Amazon están en el fichero ListaComponentes.txt

El diseño de la primera parte de esta pcb está inspirado en el siguiente post (https://randomnerdtutorials.com/esp8266-hi-link-hlk-pm03/). El resto del diseño es poner las distintas conexiones entre la D1 mini ,el rele, los leds, y el sensor de movimiento.

• El segundo paso consiste en hacer el diseño de la placa, pero tal y como quedará una vez la mandes a fabricar. Por eso en esta parte es necesario que estén todas las piezas referenciadas por sus huellas. Las huellas, son los dibujos de las piezas, pero con sus dimensiones y capacidades.

• El tercer y último paso, consiste en generar los ficheros gerber, que son los que debes de enviar a una de tantas empresas que se publicitan en internet, y que por unos 20,00€ aproximadamente te enviarán 6 ejemplares de la placa que has diseñado.

DISEÑO DE LA CAJA

Esta parte es super divertida. Para diseñar objetos en FreeCad lo que tienes que hacer es poner figuras geométricas, y luego vaciarlas con sus complementarias, dentro del panel part

Por ejemplo para hacer una torreta, donde luego fijaras la placa base, lo que haces es arrastrar un cilindro grande, y luego arrastras otro cilindro mas pequeño en el mismo sitio y haces una operación de resta.

Para hacer las letras tienes que ir al panel draft.

En mi caso opté por tomar como base una caja de Thingiverse y personalizarla, porque tiene detalles como cantos redondeados o un marco al rededor de la tapa para un mejor ajuste.

PROGRAMACIÓN DE LA WEMOS D1 MINI

Como puedes observar el programa está repartido en 12 ficheros, pero no te asustes, puesto que cada uno tiene un propósito sencillo.

• Plug: Este es el encargado en primer lugar de inicializar las variables, con los datos que ha guardado en su memoria flash, como son el usuario, contraseña de acceso y los datos para acceder a la wifi. Y en segundo lugar, como todo programa arduino, tiene un bucle infinito, en el que atiende a su propia wifi, se conecta al servidor api-rest y se comporta según los datos obtenidos.

• Ap_Wifi: El enchufe, da servicio a una wifi que se llama smartplug y que en la ip 192.168.4.1 de servicio a una web desde donde puedes configurar el enchufe y administrarlo.

• Base64,cpp, Base64.h, EMailSender.cpp y EMailSender.h, son librerias para encriptar y desencriptar las contraseñas y para el envío de email respectivamente. Estas librerías las tienes que poner para poder usar luego sus funciones.

• Behavior: Según los datos recibidos desde la web interna y el servidor api-rest, modifica el comportamiento del enchufe, encendiéndolo o apagandolo , activando o desactivando el sensor de presencia o el envío de email.

• Config: Inicializa las variables globales del programa.

• EEprom_IO: Las funciones de escribir y leer en la memoria flash de la Wemos D1 Mini.

• Email: La función encargada de enviar el email.

• Index: Las distintas páginas web que son servidas desde el enchufe. Están hechas en html con css responsive, para que se puedan ver bien desde ordenadores o teléfono móviles.

• Wifi: Se establece comunicación con el servidor api-rest mediante un get y post.

Como dije al principio, puedes copiar mi diseño, pero lo verdaderamente interesante es que podrías hacer tu propia versión cambiando el sensor de presencia por uno de temperatura, o cualquier otra cosa que imagines.

SERVIDOR API-REST

Para poder administrar el enchufe desde internet necesitamos un servidor, y de esta forma el enchufe solo tiene que hacer push o get a una url, para comunicar el estado o obtener nuevas instrucciones. Para lo cual tan solo debe de estar conectado a una red wifi, y te olvidas de abrir puertos para establecer la comunicación.

El servidor que dejo de ejemplo, tiene mas funcionalidades de las necesarias y unos test con Chai Http. Y cuando tu hagas tu propia versión, descubrirás en caso de no saberlo ya, que los test son de gran utilidad, para hacer cambios en el programa, y que no se desmonte todo al añadir una nueva funcionalidad.

Solo voy a hablar de la primera parte del código, donde se llama a los módulos a usar, y se inicializan.

• Express: Es el framework web más popular de Node
• Morgan: Es un middleware que escribe en la consola las peticiones al servidor.
• BodyParser junto con json: Se usa para manejar datos tipo json.
• Cors: Se usa para acceder a nuestro servidor desde dominios distintos al propio.

const express = require('express');
const morgan = require ('morgan');
const bodyParser = require('body-parser');
var cors = require('cors-express');
const app = express();
const port = process.env.PORT || 3017;

app.use (morgan('dev'));
app.use(express.static('.'));
app.use(bodyParser.json());

options = {
allow : {
origin: '*',
methods: 'GET,PUT,POST,DELETE,HEAD,OPTIONS',
headers: 'Content-Type, Authorization, Content-Length,
X-Requested-With, X-HTTP-Method-Override'
}
};

app.use(cors(options));

Las funciones que continúan en el código son muy sencillas y como veras se pueden fácilmente personalizar según las necesidades.

PÁGINA WEB PARA EL MANEJO DE LOS ENCHUFES

Para poder manejar el enchufe desde cualquier sitio es necesaria una web. En esta web, se solicita el usuario y la contraseña que se ha dado al enchufe, durante la configuración inicial que se realiza desde la web que el mismo sirve.(El enchufe en un punto de acceso wifi).

En mi caso he usado React, para hacer la web, pero la verdad es que tu puedes hacerlo en el lenguaje que te sientas mas comodo, existen un montón de tutoriales de como hacer CRUD (create, read, update, delete), aunque en este caso nos quedamos solo con la R y la U, puesto que el create, lo hace el enchufe al conectarse al servidor que hemos creado anteriormente. Y no existe el delete.

Como podrás ver en el código he usado axios, para la parte de comunicación del enchufe con el servidor.

SUBIR A LA NUBE EL SERVIDOR API-REST Y LA WEB DE ADMINISTRACION

Ya lo tenemos casi, ahora solo falta, subir a la nube nuestro servidor api-rest y nuestra web.

Para ello, he elegido, la combinación de docker y Heroku.

Docker, nos permite que nuestra aplicación no se vea afectada por su entorno, y de esta manera, que siempre funcione igual idenpendientemente, de que cambien los sistemas operativos, los parches, y las distintas versiones de los programas que la componen.
Heroku, a día de hoy dispone de un plan gratuito, ideal para hacer pruebas, y si te gusta, existe un plan Hobby. Pero con el Free, es suficiente para el proyecto que nos ocupa.

Suponiendo que ya tenemos correctamente instalado, npm, node, docker y la cuenta gratuita de Heroku.

Lo que tenemos que hacer para subir a la nube el servidor api-rest es crear un fichero dockerfile con el siguiente contenido:

FROM node:12
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
CMD ["npm","start"]

Y luego ejecutamos los siguientes comandos desde la ventana de terminal:

heroku login
heroku container:login
heroku create miapp
heroku container:push web -a miapp
heroku container:release web -a miapp

Y en el caso de la aplicación React lo que hacemos es un build y luego creamos un pequeño servidor express que sirva la página. A partir de este punto, todo es exactamente igual que en el servidor API-REST.