🤲🏿 👩🏿‍🤝‍👩🏻 🔕 Controlamos los LED utilizando Web Bluetooth API y Arduino 🔟 🌀 🌼

- Hervidores, balanzas, juguetes, bombillas, cafeteras ... Los módulos Bluetooth están integrados en estos y otros dispositivos.
- por qué?
- Permitir al usuario administrar sus dispositivos a través de la aplicación. Por ejemplo, controle la iluminación de la habitación.
- Oh, ¿es posible ensamblar algún dispositivo simple y administrarlo directamente a través del navegador?
- si! Y este artículo es solo sobre eso.

Poco de teoría

Aquí daré algunos términos básicos que necesitamos para implementar la tarea (hablaremos de ello un poco más adelante) en la vida.

Bluetooth

Un estándar de radio inalámbrico que conecta varios tipos de dispositivos en distancias cortas. Para controlar las glándulas a través de la API web de Bluetooth, necesitamos Bluetooth v4.0.

Gatt

Los atributos genéricos son un árbol de capacidades de transmisión constante de un dispositivo bluetooth.

Servicios

Hay servicios dentro del dispositivo bluetooth. Un servicio en sí mismo es una colección de características y relaciones con otros servicios. Cada servicio tiene su propio UID y nombre. A menudo, se encontrarán "servicios desconocidos". Esto se debe al hecho de que la cantidad de dispositivos y sus casos de uso es grande.

Caracteristicas

Dentro de cada servicio hay características en las que puede escribir, leerlos y también suscribirse a ellos. La función también tiene su propio UID.

Desafío

Como tarea, elegí una implementación de sitio que puede:

Encienda los LED en diferentes colores y apáguelos.
Haga que los LED brillen en diferentes colores.

Y, como puede entender por la declaración del problema, debe aprender a conectarse y desconectarse de un dispositivo bluetooth.

Componentes

Para completar la tarea, seleccioné la siguiente lista de elementos necesarios:

Arduino
Módulo Bluetooth v4.0 (HM-10 en mi caso).
Dos LED de tres colores.
Tablero de pan.
Cables de conexión.
Resistencias

Esta lista no es estricta para la implementación. Estoy seguro de que puede reemplazar Arduino con algo más y elegir un módulo bluetooth diferente. Pero el artículo considerará la interacción con estos componentes.

Cómo debería funcionar

Brevemente, la esencia es esta: nos conectamos al módulo bluetooth y transmitimos un cierto código (de 1 a 4 inclusive). Si el código es válido, se ilumina uno de los tres colores o los LED parpadean con todos los colores posibles (rojo, verde, azul) durante algún tiempo.

Cocinando

Primero debe recopilar un diagrama de trabajo y cargar un boceto de Arduino. A continuación doy el circuito (Fig. 1) y el código de boceto que obtuve.

Fig. 1 (diagrama de montaje)

#include <SoftwareSerial.h> int green_pin = 2; int red_pin = 3; int blue_pin = 4; int BLINK_STEPS = 3; int BLINK_DELAY = 100; SoftwareSerial mySerial(7, 8); // RX, TX void setup() { Serial.begin(9600); mySerial.begin(9600); pinMode(green_pin, OUTPUT); pinMode(red_pin, OUTPUT); pinMode(blue_pin, OUTPUT); } int code; void loop() { if (mySerial.available()) { code = mySerial.read(); shutDownAll(); if (code > 0 && code < 5) { analogWrite(code, 200); } if (code == 1) { blinked(); } } } void shutDownAll() { analogWrite(green_pin, 0); analogWrite(red_pin, 0); analogWrite(blue_pin, 0); } void blinked() { int steps = 0; while(steps <= BLINK_STEPS) { analogWrite(green_pin, 200); delay(BLINK_DELAY); analogWrite(green_pin, 0); delay(BLINK_DELAY); analogWrite(red_pin, 200); delay(BLINK_DELAY); analogWrite(red_pin, 0); delay(BLINK_DELAY); analogWrite(blue_pin, 200); delay(BLINK_DELAY); analogWrite(blue_pin, 0); delay(BLINK_DELAY); steps += 1; } }

Ultima cocina

Entonces, descargamos el boceto, conectamos el circuito a la alimentación. Que sigue Para trabajar con la API web de Bluetooth, necesitamos saber el nombre de nuestro dispositivo y a qué servicio queremos acceder. Puede utilizar la aplicación "nRF Connect" para esto.

Activamos la aplicación y vemos una lista de dispositivos bluetooth cerca de nosotros (Fig. 2).

Fig. 2 (Lista de dispositivos que encontró la aplicación)

El dispositivo con el nombre "CC41-A" me interesó y no en vano.

Después de conectarse al dispositivo, tenemos disponible una lista de sus servicios (Fig. 3). Es poco probable que encontremos algo interesante en la "Información del dispositivo", por lo que audazmente hacemos clic en el "Servicio desconocido".

Fig. 3 (Lista de servicios del dispositivo)

En la captura de pantalla a continuación (Fig. 4), puede notar lo más importante para nosotros: escribir en la característica y leerla.

Cuando resolví el problema descrito anteriormente, traté de enviar el valor "2" a la característica. Como resultado, mi par de LED comenzó a ponerse verde. Casi un exito. Ahora tenemos que hacer lo mismo, pero no a través de una aplicación móvil, sino a través de un navegador.

Fig. 4 (característica desconocida)

Aquí está la lista de datos que recibimos de la aplicación para continuar con la tarea:

El nombre del dispositivo.
UID del servicio.
Características de UID.

Implementación web

Antes de comenzar a escribir código JavaScript, hay algunos puntos a tener en cuenta:

La API es experimental.
Funciona en Chrome e Internet de Samsung.
Se requiere conexión a través de HTTPS.
No daré ejemplos de código HTML y CSS, ya que en el marco de este artículo no hay nada interesante en ellos, pero dejaré un enlace al repositorio y al sitio web al final del artículo.

Javascript

Trabajar con la API web de Bluetooth se basa en Promise. A continuación daré ejemplos de código por fases. El código fuente completo se puede encontrar en el repositorio al que se dejará el enlace.

Primero necesitamos conectarnos al dispositivo. Solicitamos dispositivos y en el filtro transferimos el nombre del dispositivo y el UID de servicio con el que trabajaremos. Si no especifica el servicio por adelantado, en el futuro no será posible interactuar con él.

 navigator.bluetooth.requestDevice({ filters: [ { name: MY_BLUETOOTH_NAME }, { services: [SEND_SERVICE] }, ] })

Después de hacer clic en el botón "Conectar", se abrirá una ventana (Fig. 5), en la que debe seleccionar un dispositivo y hacer clic en el botón de conexión.

Fig. 5 (Ventana con dispositivo accesible para la conexión)

Cuando está conectado, se devuelve una Promesa que contiene "dispositivo", al que puede conectarse. Ok, escribámoslo en una variable y creemos una conexión.

 .then(device => { myDevice = device; return device.gatt.connect(); })

Después de eso, se nos devuelve una Promesa que contiene "servidor". Luego solicitamos "servicio" del "servidor", pasando allí el UID del servicio (que espiamos a través de la aplicación). Luego obtenemos una Promesa que contiene "servicio", desde la cual solicitamos "característica", pasándole el UID (que también observamos a través de la aplicación).

 .then(server => server.getPrimaryService(SEND_SERVICE)) .then(service => service.getCharacteristic(SEND_SERVICE_CHARACTERISTIC))

Y solo ahora ya podemos comenzar a hacer algo. Por ejemplo, almaceno una característica en una variable y cuelgo los controladores de clic de botón. En sus atributos de datos contienen un código que se escribirá en la característica al hacer clic.

Los controladores de clic de botón contienen el siguiente código:

 const code = Number(event.target.dataset.code); if (code === 1) { toggleLigthCharacteristic.writeValue(Uint8Array.of(code)); return; } toggleLigthCharacteristic.readValue() .then(currentCode => { const convertedCode = currentCode.getUint8(0); toggleLigthCharacteristic.writeValue( Uint8Array.of(convertedCode === code ? 0 : code) ); });

Es necesario pasar una matriz uint8 a la característica, por lo tanto, para convertir el código que se le pasará, debe usar Uint8Array.

Según lo planeado, el código 1 hace que los LED parpadeen en tres colores y luego se apaguen. Pero, ¿cómo apagar el LED si se le ha transmitido el código 3 y el LED sigue encendido? ¿O encender un color diferente?

Leo el valor que se encuentra en la característica, lo convierto usando getUint8 y, si el código coincide, envío cualquier valor no válido (por ejemplo, 0). Si el valor es válido, lo convertiré a la unidad de matriz8 y lo escribiré en la característica.

Para la solución final de la tarea, solo necesita aprender a desconectarse del dispositivo. Ya tenemos un eventListener en el botón "Desconectar", en el que el dispositivo se desconecta del dispositivo bluetooth, se eliminan los EventListeners, se ocultan los botones de control y se escribe indefinido en las variables.

 myDevice.gatt.disconnect(); toggleItemsEventListeners('removeEventListener'); toggleButtonsVisible(); toggleLigthCharacteristic = undefined; myDevice = undefined;

Resumen

Hemos creado una página web simple con la que puede conectarse y controlar un dispositivo bluetooth. Como puede ver, esto es bastante simple. ¡Y los dispositivos que puede ensamblar y administrar de esta manera están limitados solo por su imaginación!

Controlamos los LED utilizando Web Bluetooth API y Arduino