Construye un contador con las visitas en tiempo real de una web con Google Analytics y Arduino


En este tutorial podrás aprender a hacer un contador con Arduino como el de la foto.

Contenido

Acerca de este proyecto

Antes de todo

Si te has perdido la primera parte te recomiendo leer este tutorial:
Construye un contador con tus suscriptores de Youtube con Arduino

Funcionamiento

Es importante que sepas que hacen falta dos partes:

1- Programa PHP que tienes que subir a tu servidor, este se encargará de recoger los datos de Google Analytics.

2- Arduino, este se encargará de leer el programa PHP de tu servidor y de mostrar las visitas en el contador.

Requisitos

Servidor VPS o dedicado

Para usar el contador de visitas en tiempo real de Google Analytics necesitarás un hosting (un servidor VPS o dedicado) para alojar un programa hecho con PHP, si necesitas uno te recomiendo Raiola Networks.

Descargar código fuente y librerías

[sociallocker id=”1842″]Descargar código[/sociallocker]

Manos a la obra

Abrir proyecto

– Copia el proyecto contador_general.in en la carpeta de proyectos de Arduino, en mi caso la ruta es:
Documentos/Arduino/

– Abre el fichero contador_general.in

– Si te sale una alerta “el archivo necesita estar dentro de una carpeta de proyecto…” pulsa “Ok” para continuar.

Antes de continuar

En este punto tienes que seguir los mismos pasos del tutorial anterior:

– Instalar placa en Arduino IDE.

– Configurar el puerto de salida.

– Instalar librerías, si ya lo has hecho antes no hace falta que lo hagas de nuevo.

– Configurar wifi.

– Crear un proyecto en Google API Console, si ya lo has creado antes puedes aprovechar el mismo proyecto.

– Activar la API de Google Analytics API en Google API Console.

Subir programa PHP a tu servidor

Te recomiendo renombrar la carpeta analytics a algo que no sea tan fácil y solo puedas recordar tu, por ejemplo: analytics23411

Súbelo a tu servidor, no importa si lo pones en una subcarpeta, todo irá bien mientras el enlace sea accesible desde el navegador.

Descomprime el fichero google-api-php-client.zip fuera de la carpeta analytics23411.

De momento no accedas al programa PHP desde el navegador, todavía no está configurado y es lo que verás a continuación.

Crear ID de cliente de OAuth en Google API Console

Para poder acceder a los datos de Analytics no nos sirve la Clave de API del tutorial anterior, tenemos que crear un ID de cliente de OAuth.

– Entra en Google API Console.

– Haz clic en: Crear credenciales – Crear ID de cliente de OAuth.

– En el campo “Tipo de aplicación”, selecciona la opción: Web.

– En el campo “Nombre”: No importa, deja el valor por defecto “Cliente web 1”.

– Pulsa el botón “Crear”.

– Copia tu ID de cliente y tu secreto de cliente que te proporciona Google API Console.

Configurar Script PHP

– Abre el fichero config.php con un editor de texto como puede ser el bloc de notas, no lo hagas con Word.

– Edita las siguientes variables en el proyecto de Arduino IDE con los datos que has copiado antes:
$google_client_id = ‘1111111111-xxxxxxxx.apps.googleusercontent.com’;
$google_client_secret = ‘xxxxxxxxxxx’;

– Edita la variable que tiene la ruta del programa PHP:
$callback_uri = ‘https://dominio.com/analytics23411/’;

Configurar URI autorizada

– En el panel de Google API Console selecciona el cliente OAuth que has creado, en este caso “Cliente web 1”.

– En el campo “URI de redirección autorizados”, introduce la ruta del script que has subido a tu servidor, en este ejemplo:
https://dominio.com/analytics23411/

– Para confirmar pulsa el botón Guardar.

Acceder al programa PHP desde el navegador

– Entra en la direccón donde has subido el programa PHP, en este tutorial:
https://dominio.com/analytics23411/

– Al entrar te pedirá conectar una cuenta de google, selecciona la cuenta que uses con Analytics.

– Si te salta una alerta “No se ha verificado la aplicación”, no te preocupes, los permisos los estás dando al proyecto tuyo que acabas de crear en Google API Console, para continuar pulsa en “Configuración avanzada” y luego en “ir a dominio.com (no seguro)”.

– Ahora te pedirá permisos para consultar los datos de Analytics, dale al botón “Permitir”.

– Si todo ha ido bien te debería salir un listado de webs vinculadas a tu Analytics, copia el código “Access Token”.

– Pega el código Access Token al final del fichero de configuración.

– Si has configurado bien el Token, al selecciona una web te debería salir el número de visitas.

– Copia el enlace de la página para el siguiente paso, algo como esto:
https://dominio.com/analytics23411/get.php?id=111111111

Configurar programa en Arduino IDE

Vuelve al programa Arduino IDE y modifica estos valores:
#define API_HOST “dominio.com”
#define API_URL “/analytics23411/get.php?id=111111111”

Si tu dominio no tiene HTTPS tendrás que cambiar el puerto 443 por 80:
#define API_PORT 80

El proyecto de Arduino original está configurado para hacer peticiones cada 5 minutos, si quieres actualizar con más frecuencia aquí tienes un ejemplo para actualizar cada minuto:
#define API_TIMEOUT 60000

Ahora toca probarlo

Asegúrate de conectar la placa de Arduino a tu ordenador y el programa Arduino IDE pulsa el botón “Subir”, si no ha aparecido ningún error te debería salir el total de suscriptores en el contador, para más información revisa el apartado “Primeros pasos con Arduino – Ejecutar código”.

Quizás te pueda interesar leer

Construye un contador para mostrar cualquier métrica con Arduino

Construye un contador con tus suscriptores de Youtube con Arduino

Publicado en: DIY