En una publicación anterior, vimos cómo crear notificaciones interactivas utilizando IFTTT y cómo hacerlo para dispositivos iOS. Para Android, tenemos otra opción que no requiere aplicaciones de terceros: usar la plataforma HTML5 de Home Assistant.
De acuerdo con el sitio web de Home Assistant, estas notificaciones son compatibles con Chrome y Firefox, funcionando de manera similar a las notificaciones de sitios web de noticias. Lo mejor de todo es que permiten interactuar directamente con Home Assistant, facilitando la ejecución de acciones en respuesta a las notificaciones enviadas desde HA.
Tras esta guía, seremos capaces de enviar notificaciones push a nuestros dispositivos con acciones a realizar.
Para poder utilizar esta funcionalidad, nuestro sistema tiene que ser accesible desde el exterior y con https. En nuestro caso, el sistema está configurado con Duckdns por lo que no hay problema.
Primero, debemos crear un proyecto en console.cloud.google con el nombre que queramos. De momento simplemente con crearlo será suficiente.
Seguidamente necesitamos verificar nuestro dominio. Esto es un paso necesario para que la plataforma pueda enviar mensajes en nuestro nombre. Para ello iremos a console.cloud.google , seleccionaremos el proyecto que acabamos de crear en el paso anterior y en la pestaña "Verificación de dominio" añadiremos el dominio de nuestra instancia de Home assistant seguido de /local:
Tras clickar en Añadir un dominio, nos saldrá un dialogo pidiendo verificar que este dominio es nuestra propiedad:
Clickaremos en Ir y se nos abrirá el Centro para webmasters de google. Aquí podremos verificar nuestro dominio. Clickaremos en añadir una propiedad y volveremos a escribir el dominio anterior, seguido de /local. Lo que vamos a hacer es obtener un fichero HTML con un token que nos ofrecerá google, y lo ubicaremos en el directorio /config/www de nuestro Home Assistant. De esa manera, google podrá comprobar que efectivamente ese dominio es nuestro. Para ello, en la siguiente página descargaremos el fichero:
SI no teníamos creado el directorio /config/www, lo creamos y colocamos este fichero descargado, sin modificar y con el mismo nombre. Una vez hecho esto, muy importante reiniciar Home Assistant.
Cuando HA haya iniciado de nuevo, haremos click en "Verificar" para que google verifique nuestro dominio
Una vez verificado nuestro dominio, tenemos que añadir el proyecto en el Firebase de google. Navegamos a console.firebase.google.Haremos click sobre Añadir proyecto y seleccionaremos nuestro proyecto creado previamente:
Cuando esté añadido, haremos click en la rueda dentada en el menú de la izquierda, y en el menú seleccionaremos "Configuración del proyecto". Navegaremos a la pestaña "Mensajería en la nube" y tendremos nuestras claves a anotar: Clave del servidor y ID Del remitente
En home assistant necesitaremos definir la plataforma dentro del fichero Configuration.yaml:
1 2 3 4 5 |
notify: - platform: html5 name: pushchrome gcm_api_key: API_KEY gcm_sender_id: SENDER_ID |
Donde API_KEY será la Clave del servidor obtenida anteriormente, y SENDER_ID el ID del remitente del paso anterior.
Deberemos habilitar las notificaciones en cada uno de los dispositivos que queramos recibir. Para ello, accederemos a nuestra instancia de Home Assistant desde Chrome o Firefox y desde cualquier dispositivo salvo iOS (Windows, Linux, Android). Haremos click sobre el icono del usuario en el menú y habilitaremos Notificaciones push:
Para probar que nos funcionan las notificaciones, accederemos a la consola de desarrollador y llamaremos al servicio:
Hasta aquí venimos de configurar el servicio de notificaciones y ya somos capaces de enviar nuestra primera notificación de ejemplo. Al final de este post seremos capaces de tener notificaciones interactivas donde podremos ejecutar comandos de respuesta.
Para facilitar este post, realizaremos la configuración siguiendo un ejemplo. Nuestro ejemplo consistirá en poder abrir la puerta si llaman al timbre, como por ejemplo si hemos realizado la modificación al vídeo portero, aunque esto solo servirá de ejemplo.
Lo primero que tenemos que hacer es crear una automatización o editar alguna existente con la cual queramos disparar una notificación por HTML5. Por ejemplo, cuando llamen al timbre.
De esa manera, cuando llamen al timbre recibiremos la notificación en los dispositivos suscritos. De momento, realizaremos la automatización notificando a todos los usuarios suscritos.
Vamos a seguir con el ejemplo del videoportero. Suponiendo que hemos llamado a nuestra plataforma "notifications.htmlpush", un ejemplo de notificación sería el siguiente:
1 2 3 4 5 6 7 8 9 10 11 12 13 |
- id: '1' alias: 'Pican a la puerta' hide_entity: true trigger: platform: state entity_id: binary_sensor.timbre_videportero from: 'off' to: 'on' action: - service: notify.htmlpush data: message: 'Estan llamando al timbre' title: 'Timbre' |
Con esto, recibiremos una notificación cuando nos llamen al timbre. Hasta aquí, nada distinto a lo que teníamos anteriormente.
Sin embargo, la potencia de estas notificaciones reside en que también pueden ponerse acciones a ejecutar. En nuestro caso, vamos a configurar en la notificación de llamada al timbre vamos a añadir un botón para abrir la puerta. Para ello, dentro del servicio notify.htmlpush, añadiremos los parametros action, dentro de otra clave 'data'. Modificamos la acción anterior para que quede como sigue:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
- id: '1' alias: 'Pican a la puerta' hide_entity: true trigger: platform: state entity_id: binary_sensor.timbre_videportero from: 'off' to: 'on' action: - service: notify.htmlpush data: message: 'Estan llamando al timbre' title: 'Timbre' data: actions: - action: "abrir_puerta" title: "Abrir" |
De esta manera, tendremos un botón en la notificación para abrir la puerta:
Si quisiéramos más acciones, podríamos añadirlas en al array de actions.
Ahora debemos interceptar el comando, es decir, configurar el qué queremos hacer cuando hagan click en una acción u en otra. es por eso que es importante al nombre de la acción, el valor que aparece en la clave - action. Es importante que sea único en toda la app, ya que será la clave que nos ayudará a identificar en las automatizaciones qué acción o script queremos ejecutar.
Para ello, añadimos una nueva automatización para interceptar el "abrir_puerta":
1 2 3 4 5 6 7 8 9 10 11 12 |
- alias: "abrir puerta" trigger: platform: event event_type: html5_notification.clicked event_data: action: abrir_puerta action: - service: script.turn_on entity_id: script.videportero - service: notify.pushchrome data: message: "Puerta abierta" |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 |
################### # # Automatización para cuando llaman a la puerta # ##################### - id: '1' alias: 'Pican a la puerta' hide_entity: true trigger: platform: state entity_id: binary_sensor.timbre_videportero from: 'off' to: 'on' action: - service: notify.htmlpush data: message: 'Estan llamando al timbre' title: 'Timbre' data: actions: - action: "abrir_puerta" title: "Abrir" ##Callback de las acciones - alias: "abrir puerta" trigger: platform: event event_type: html5_notification.clicked event_data: action: abrir_puerta action: - service: script.turn_on entity_id: script.videportero - service: notify.pushchrome data: message: "Puerta abierta" |
Con la configuración anterior, todos los dispositivos suscritos recibirían la notificación, y podrían tomar la determinación de abrir o no la puerta. Sin embargo, se puede filtrar este comportamiento para enviar solo la notificación a algunos dispositivos.
Para ello, con cada suscripción, Home assistant habrá creado una entrada en un fichero json en /config/html5_push_registrations.conf como la siguiente:
1 2 3 4 5 6 7 8 9 10 11 |
"unnamed device": { "browser": "chrome", "subscription": { "endpoint": "https://android.googleapis.com/gcm/send/fQooZ....", "expirationTime": null, "keys": { "auth": "4wK[...]", "p256dh": "BNKW5Oa_JoFAMVP[...]E" } } } |
SI vamos añadiendo las suscripciones una a una, podremos saber de qué dispositivo son. A continuación podemos editar el nombre "unnamed device" y poner lo que queramos, por ejemplo, "Mi movil"
1 2 3 4 5 6 7 8 9 10 11 |
"Mi movil": { "browser": "chrome", "subscription": { "endpoint": "https://android.googleapis.com/gcm/send/fQooZ....", "expirationTime": null, "keys": { "auth": "4wK[...]", "p256dh": "BNKW5Oa_JoFAMVP[...]E" } } } |
A continuación, después de los cambios , es necesario reiniciar HA.
Una vez arrancado, podemos editar las automatizaciones añadiendo a quién queremos enviar la notificación. SI no indicamos nada, se enviarán a todos los dispositivos suscritos. Para ello, debemos añadir un atributo target indicando a quién va dirigida la notificación. Así, si quisiéramos enviar la anterior sólo al dispositivo Mi MOvil, editado anteriormente, nuestra automatización quedaría como sigue:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
- id: '1' alias: 'Pican a la puerta' hide_entity: true trigger: platform: state entity_id: binary_sensor.timbre_videportero from: 'off' to: 'on' action: - service: notify.htmlpush data: message: 'Estan llamando al timbre' title: 'Timbre' target: 'Mi movil' data: actions: - action: "abrir_puerta" title: "Abrir" |
Como en todas las ocasiones, podemos usar templates en los mensajes, títulos, etc y con esto, ya tenemos nuestras notificaciones bidireccionales funcionando!