Robot Controlado Con Wifi Mediante Raspberry y Node - Js

FACULTAD DE INGENIERA
INGENIERA ELECTRNICA
Control de un robot a travs de internet mediante Raspberry Pi y NODE.js
Trabajo de Fin de Grado
Grado en Ingeniera Electrnica
Autores:
Apellido y Nombres del Alumno: Alaniz, Dario Martin
Apellido y Nombres del Alumno: Casas, Mario David
Fecha de entrega: 09 Noviembre 2017
Curso 2017
1
2
Resumen
El presente proyecto denominado J5 por el framework1 Johnny-five.io2, constituye un
trabajo de investigacin y desarrollo de un vehculo terrestre no tripulado (tanque).
El objetivo es comandar una computadora Raspberry Pi 33 que funciona como servidor
mediante una pgina web, a travs de una red de datos mviles o WIFI de nuestra red local,
donde el cliente pueda interactuar en tiempo real.
Se pretende programar el servidor en Javascript y ejecutarlo sobre Node.js4, que este cuente
con control de sesiones, usuario y contrasea para evitar conexiones simultneas, adems del
acceso a personas no autorizadas, y por ltimo que incluya la posibilidad de verificar el
estado de la conexin a internet con el objetivo de intentar reestablecerla.
En adicin utilizar Socket.io5 para lograr que la comunicacin sea bidireccional en tiempo
real, Johnny-five.io para controlar los puertos GPIO6 de la Raspberry Pi y un puente H7
comercial para energizar los motores de nuestro vehculo.
Adems se contara con una cmara web para la visualizacin de imgenes en directo, esto
gracias a la utilizacin del servidor de televigilancia Motion8.
1
Framework: Esquema para el desarrollo y/o la implementacin de una aplicacin.
2
Johnny-five.io: Framework de robtica.
3
Raspberrypi: Computadora de tamao reducido.
4
Nodejs: Interprete y entorno de programacin JavaScript.
5
Socket.io: Librera que permite la comunicacin bidireccional entre el cliente y el servidor en tiempo real.
6
GPIO: Referencia pgina nmero 14.
7
Puente H: Referencia en pgina nmero 14.
8
Motion: Servidor de televigilancia.
3
Agradecimientos
Agradecemos a la Universidad Nacional de la Patagonia San Juan Bosco por habernos
formado como personas y profesionales. Y proporcionarnos el material necesario para la
realizacin de este proyecto.
A nuestros asesores Daniel Berns y Pablo Rosales por la valiosa colaboracin de sus
conocimientos para el desarrollo de este trabajo.
A Ral Reyes por habernos proporcionado las bateras que utilizamos.
4
NDICE
1. Introduccin ................................................................................................................................ 9
2. Anlisis ...................................................................................................................................... 10
Computadora: ................................................................................................................................ 10
Servidor: ........................................................................................................................................ 11
Plataforma de desarrollo: .............................................................................................................. 13
Fuentes de energa: ........................................................................................................................ 13
Fuente de poder (motores): ....................................................................................................... 13
Fuente de poder (Raspberry Pi 3):............................................................................................. 14
Etapa de potencia: ......................................................................................................................... 15
Cmara web:.................................................................................................................................. 16
Otras tecnologas: .......................................................................................................................... 17
Socket.io: ................................................................................................................................... 17
Express.js: ................................................................................................................................. 17
Raspi-io: .................................................................................................................................... 17
Johnny-five.js: ........................................................................................................................... 17
Express-session.js:..................................................................................................................... 18
Compulsive.js y Temporal.js:.................................................................................................... 18
Connectivity.js: ......................................................................................................................... 18
Servidor de video Motion:......................................................................................................... 18
DNS: (opcional) ........................................................................................................................ 18
Costos del proyecto: ...................................................................................................................... 19
3. Diseo ....................................................................................................................................... 20
Qu es Node.js? ........................................................................................................................... 20
Caractersticas de un lenguaje de programacin: ...................................................................... 20
Infraestructura: .............................................................................................................................. 21
Infraestructura (PHP vs Node.js) .................................................................................................. 21
Caractersticas de Node.js: ............................................................................................................ 22
Io.js:............................................................................................................................................... 22
Comparacin entre JS y IO: ...................................................................................................... 22
Qu es WebSocket? ..................................................................................................................... 23
Cmo funciona?....................................................................................................................... 24
Estructura web:.............................................................................................................................. 24
5
4. Implementacin ......................................................................................................................... 26
Node.js: ......................................................................................................................................... 27
Putty: ............................................................................................................................................. 28
Filezilla:......................................................................................................................................... 28
Vnc: ............................................................................................................................................... 29
Ipscan: ........................................................................................................................................... 29
Motion: .......................................................................................................................................... 30
Sublime text 2: .............................................................................................................................. 31
5. Como funciona: ......................................................................................................................... 32
Cdigo JavaScript: ........................................................................................................................ 32
Cdigo HTML:.............................................................................................................................. 37
Cdigo CSS: .................................................................................................................................. 39
6. Puesta en funcionamiento: ........................................................................................................ 41
7. Conclusiones: ............................................................................................................................ 43
Propuestas para desarrollos futuros: .............................................................................................. 43
8. Bibliografa: .............................................................................................................................. 45
9. Anexos: ..................................................................................................................................... 46
Cdigos JavaScript: ....................................................................................................................... 46
Autentificacin: ......................................................................................................................... 46
Parada de emergencia (forma parte de J5.js):............................................................................ 46
Sesion.js: ................................................................................................................................... 47
J5.JS .......................................................................................................................................... 48
APP.JS:...................................................................................................................................... 49
Cdigo (HTML) ............................................................................................................................ 50
RcD13pfdXYZ.html:................................................................................................................. 50
Pgina Autenticacin (index.html):........................................................................................... 51
Cdigo css: .................................................................................................................................... 52
Style.css(Rd13pfdXYZ): ........................................................................................................... 52
Estilo.css(Autentificacin): ....................................................................................................... 53
6
NDICE DE FIGURAS
Figura 1 Raspberry Pi 3 ...................................................................................................................... 10
Figura 2 Sistema operativo Raspbian ................................................................................................ 11
Figura 3 Servidor APACHE ................................................................................................................. 11
Figura 4 Intrprete y entorno de programacin NODE.JS ................................................................ 12
Figura 5 Plataforma de desarrollo ..................................................................................................... 13
Figura 6 A la izquierda batera de gel, derecha batera LIPO ............................................................ 13
Figura 7 Convertidor de potencia DC/DC Step Down ....................................................................... 14
Figura 8 Esquema bsico convertidor Step Down o Buck ................................................................. 14
Figura 9 GPIO, Raspberry Pi 3............................................................................................................ 15
Figura 10 Puente H ............................................................................................................................ 15
Figura 11 Cmara Web Logitech c170 ............................................................................................... 17
Figura 12 Infraestructura Node.js ..................................................................................................... 21
Figura 13 Infraestructura PHP vs NODE.JS ........................................................................................ 21
Figura 14 PHP vs Node.js ................................................................................................................... 23
Figura 15 Diferentes conexiones ....................................................................................................... 23
Figura 16 Funcionamiento websoekt (handshake) ........................................................................... 24
Figura 17 Estructura del proyecto ..................................................................................................... 24
Figura 18 Pagina inicial login .......................................................................................................... 25
Figura 19 Mensaje ocupado - alguien inicio sesin.......................................................................... 25
Figura 20 Pgina principa .................................................................................................................. 25
Figura 21 Win 32 Disk Imager ........................................................................................................... 26
Figura 22 Pantalla de configuracin Raspberry................................................................................. 27
Figura 23 Logo de node.js ................................................................................................................. 27
Figura 24 Inicio sesin mediante SSH, Putty ..................................................................................... 28
Figura 25 Transferencia de archivos mediante FTP .......................................................................... 28
Figura 26 Logo de VNC (Virtual Network Computing) ...................................................................... 29
Figura 27 Inspeccin de la IP que nuestro servidor de DHCP le asigno a nuestra Raspberry ........... 29
Figura 28 Agregado de usuario y contrasea .................................................................................... 31
Figura 29 Logo Sublime Text 2 .......................................................................................................... 31
7
NDICE DE TABLA
Tabla 1 Especificaciones de la Raspberry pi 3 ................................................................................... 10
Tabla 2 Presupuesto .......................................................................................................................... 19
Tabla 3 Comparacin distintos lenguajes de programacin ............................................................. 20
Tabla 4 Cuadro comparativo blocking vs non blocking ..................................................................... 22
Tabla 5 Comparacin entre Javascript vs IO ..................................................................................... 22
Tabla 6 Conexiones GPIO .................................................................................................................. 41
Tabla 7 Conexin puente H ............................................................................................................... 41
8
1. Introduccin
Este proyecto se desarroll con el objetivo de aplicar los conocimientos adquiridos durante
la carrera, entre ellos:
Comunicaciones 2:
Protocolos TCP/IP y HTTP
Direcciones IP
DNS
FTP
SSH
Digitales 2:
Programacin orientada a micro controladores
Electrnica Industrial:
Convertidos de potencia DC/DC
Variacin de velocidad en motores de corriente continua
Se eligi como vehculo un tanque con el propsito de innovar, de hacer algo llamativo para
los estudiantes de electrnica.
Para el desarrollo del servidor se comenz estudiando las tecnologas disponibles:
Servidor HTTP Apache9 de cdigo abierto
Interprete y entorno de programacin JavaScript Node.js
Simultneamente estudiar el lenguaje HTML y JavaScript para poder programar la pgina
web con la que el cliente podr interactuar en tiempo real, la cual nos mostrara ya sea las
direcciones que nuestro vehculo puede tomar, como as las imgenes captadas por el
dispositivo sensorial.
Explorar alternativas a fin de evitar sesiones simultneas al servidor, por deteccin de
direccin IP, MacAdress, control de sesiones y usuario/contrasea, como as la deteccin de
fallas de conexin a internet y acerca de un servidor dedicado a la transmisin de video en
directo (stream).
Como aplicaciones se pueden destacar:
Unidad robot para uso de escuadrones anti-bombas
Robot explorador (telemetra, fotografa, investigacin)
Entretenimiento
Robot para invernaderos
9
https://www.apache.org/.
9
2. Anlisis
En el siguiente apartado se presentan los diferentes componentes que forman parte del
sistema, como tambin la tecnologa seleccionada para realizar la tarea concreta.
Computadora:
Para ejecutar el servidor y los diferentes servicios de los que se dispone, se necesita un
ordenador donde ejecutar los diferentes sistemas y programas. Se podra utilizar cualquier
ordenador para este trabajo, pero se requiere que tenga un consumo elctrico muy bajo. En
este ordenador se ejecutaran programas, los servicios externos y la pgina web que se
utilizara a modo de interfaz grfica. En el Mercado hay toda clase de ordenadores
disponibles, pero los que resultaron de inters fueron los denominados ordenadores de placa
reducida. Este tipo de equipos son denominados as porque todos los componentes del
ordenador son integrados en la misma placa. De entre todas las posibilidades de las que se
disponen, se ha seleccionado la placa Raspberry Pi 3.
Figura 1 Raspberry Pi 3
Las especificaciones de la tarjeta son:

Caractersticas Raspberry Pi 3b
Procesador 1,2 GHz de cuatro ncleos ARM Cortex-A53
RAM 1GB LPDDR2
Almacenamiento Ranura para micro SD
USB 4 puertos USB 2.0
Conectividad Ethernet socket Ethernet 10/100 BaseT
802.11 b / g / n LAN inalmbrica
Bluetooth 4.1 (Classic Bluetooth y LE)
Energa 800mA hasta 3A a 5V
Pines GPIO 40 pines GPIO
Tabla 1 Especificaciones de la Raspberry pi 3
10
Como la Raspberry Pi es una computadora de bajo costo, se ajust perfectamente a las

necesidades. Con el tamao de una tarjeta de crdito y con los recursos suficientes para
nuestro propsito. Funciona con una alimentacin de 5V, lo que es un consumo muy bajo si
lo comparamos con un ordenador convencional. Para el sistema operativo se utiliz una
tarjeta micro SD, con una capacidad de 16GB, en la que se instal el sistema operativo
Raspbian10. Este SO fue proporcionado por la propia organizacin de la placa, es una versin
de Debian adaptada para la arquitectura ARM de la tarjeta.
Figura 2 Sistema operativo Raspbian
Servidor:
La seleccin del contenedor web fue bastante complicada, puesto que la eleccin de este
marcaba el desarrollo de la aplicacin. Entre las alternativas se encontr Apache y node.js.
Figura 3 Servidor APACHE
Apache es un servidor web HTPP de cdigo abierto, para plataformas comunes como son
Windows y Linux. En un inicio se enfoc a realizar la aplicacin con dicho servidor debido
a su simplicidad. Se program una pgina web simple en HTML, y un script11 en lenguaje
PHP12 el cual realizaba una peticin a un script en Python13 , este comandaba los pines de la
10
Raspbian: Sistema operativo de Linux, basado en Debian Jessie.
11
Script: Archivo de rdenes, archivo de procesamiento por lotes.
12
PHP: Es un lenguaje de cdigo abierto muy popular especialmente adecuado para el desarrollo web.
13
Python: Es un lenguaje de programacin.
11
Raspberry, no obstante los tiempos de respuesta no eran los convenientes para una correcta
interaccin entre el servicio y el cliente.
Figura 4 Intrprete y entorno de programacin NODE.JS
Por otro lado Node.js result ser la opcin adecuada, instalando diversos framework se
lograron tiempos de respuestas casi instantneos, como as el fcil manejo de los puertos
GPIO.
Cabe destacar que en la meta nmero uno declarada de Node.js es "proporcionar una manera
fcil para construir programas de red escalables". En lenguajes como Java y PHP, cada
conexin genera un nuevo hilo que potencialmente viene acompaado de 2 MB de memoria.
En nuestro sistema que tiene 1 GB de RAM, esto da un nmero mximo terico de
conexiones concurrentes de cerca de 500 usuarios. A medida que crece la base de clientes, si
se desea que la aplicacin soporte ms usuarios, se necesita agregar ms y ms servidores.
Desde luego, esto suma en cuanto a los costos de servidor del negocio, a los costos de trfico,
los costos laborales, y ms. Adems de estos costos estn los costos por los problemas
tcnicos potenciales, un usuario puede estar usando diferentes servidores para cada solicitud,
as que cualquier recurso compartido debe almacenarse en todos los servidores. Por todas
estas razones, el cuello de botella en toda la arquitectura de aplicacin Web (incluyendo el
rendimiento del trfico, la velocidad de procesador y la velocidad de memoria) era el nmero
mximo de conexiones concurrentes que poda manejar un servidor.
Node.js resuelve este problema cambiando la forma en que se realiza una conexin con el
servidor. En lugar de generar un nuevo hilo de OS para cada conexin (y de asignarle la
memoria acompaante), cada conexin dispara una ejecucin de evento dentro del proceso
del motor de Node.js. Tambin afirma que nunca se quedar en punto muerto, porque no se
permiten bloqueos y porque no se bloquea directamente para llamados E/S. Node.js afirma
que un servidor que lo ejecute puede soportar decenas de miles de conexiones concurrentes.
Si bien este proyecto se limit a un usuario a la vez, por lo que la memoria RAM no implica
obstculo, si en un futuro se pretendiera hacer algo estanco al que tengan acceso una
numerosa cantidad de usuarios a la vez esto sera factible.
12
Plataforma de desarrollo:
Como plataforma de desarrollo en la cual montar nuestra computadora se eligi un tanque14,
result ser una opcin interesante, debido a que contaba con 4 motores independientes con
caja reductora de velocidad, lo que le daba un torque mximo de 9.5 Kg por motor.
Figura 5 Plataforma de desarrollo
Cabe destacar que estaba construido de acero, contaba con las proporciones adecuadas para
montar la computadora y las fuentes de energa (bateras).
Fuentes de energa:
Fuente de poder (motores):
Los motores de nuestra plataforma de desarrollo necesitan 12V DC y un Amper como
mximo para funcionar correctamente. En el mercado existen varias alternativas como
fuentes de poder DC, entre ellas bateras Lipo, bateras de gel y de plomo acido. Las bateras
de Lipo (litio-polmero) resultaban ser la mejor opcin, por su bajo peso y alta capacidad de
corriente. No obstante resultaban ser muy costosas.
Figura 6 A la izquierda batera de gel, derecha batera LIPO
14
http://www.smartarduino.com/
13
Es importante mencionar que adems de adquirir las bateras era imprescindible un cargador,
y el precio de las de Lipo resultaba muy alto. Por las mencionadas razones de escogi por
utilizar bateras de gel de 12V 5mAh a costa de ganar peso en el vehculo.
Fuente de poder (Raspberry Pi 3):
Como se mencion nuestra computadora se alimenta con 5V de continua y tiene un consumo
mximo de 3A.
Se estudi el regulador lineal LM750515 y el convertidor StepDown16.
El regulador LM7505 resultaba ser prctico y barato, pero tena la desventaja que entregaba
a la salida como mximo 1 A, se poda aumentar esta corriente con transistores externos hasta
2 A.
Figura 7 Convertidor de potencia DC/DC Step Down
El dispositivo StepDown O BUCK, es un convertidor de potencia DC/DC sin aislamiento

galvnico, que obtiene a su salida un voltaje continuo menor que a su entrada. Tambin es
una fuente conmutada con dos dispositivos semiconductores (transistor S y diodo D), un
inductor L y opcionalmente un condensador C a la salida.
Figura 8 Esquema bsico convertidor Step Down o Buck
15
http://www.alldatasheet.com/view.jsp?Searchword=LM7505
16
https://es.wikipedia.org/wiki/Convertidor_Buck
14
Por otra parte, un convertidor Buck puede tener una alta eficiencia (superior al 95% con
circuitos integrados) y autorregulacin.
Este convertidor result ser la eleccin ms conveniente, debido a que se poda regular a
voluntad la tensin de salida, permitiendo en todo su rango una corriente mxima de hasta
5A.
Etapa de potencia:
Los puertos GPIO son pines genricos en un chip, cuyo comportamiento (incluyendo si es
un pin de entrada o salida) se pueden controlar (programar) por el usuario en tiempo de
ejecucin.
Figura 9 GPIO, Raspberry Pi 3
Los pines GPIO no tienen ningn propsito especial definido, y no se utilizan de forma
predeterminada. La idea es que a veces, para el diseo de un sistema completo que utiliza el
chip podra ser til contar con un puado de lneas digitales de control adicionales, y tenerlas
a disposicin ahorra el tiempo de tener que organizar circuitos adicionales para
proporcionarlos.
Debido a la baja potencia de salida con la que cuentan se opt por usar:
Figura 10 Puente H
15
Un Puente H17 es un circuito electrnico que permite que los motores elctricos DC giren en
ambos sentidos, avance y retroceso. Son ampliamente usados en robtica y como
convertidores de potencia. Los puentes H estn disponibles como circuitos integrados, pero
tambin pueden construirse a partir de componentes discretos.
Estructura de un puente H (marcado en rojo)
Los 2 estados bsicos del circuito
El trmino "puente H" proviene de la tpica representacin grfica del circuito. Un puente H
se construye con 4 interruptores (mecnicos o mediante transistores). Cuando los
interruptores S1 y S4 (ver primera figura) estn cerrados (y S2 y S3 abiertos) se aplica una
tensin positiva en el motor, hacindolo girar en un sentido. Abriendo los interruptores S1 y
S4 (y cerrando S2 y S3), el voltaje se invierte, permitiendo el giro en sentido inverso del
motor. Con la nomenclatura que estamos usando, los interruptores S1 y S2 nunca podrn
estar cerrados al mismo tiempo, porque esto cortocircuitara la fuente de tensin. Lo mismo
sucede con S3 y S4.
Cmara web:
Es una cmara de video que se conecta mediante USB en la computadora y permite que los
videos o fotos puedan verse instantneamente y descargarse en lnea. Las cmaras web se
usan en diversas situaciones, desde vigilar el estado del tiempo y el trfico en una carretera
hasta chatear en Internet y videoconferencias. En nuestro caso se busc en la pgina,
elinux.org/RPi_USB_Webcams, cmaras compatibles con Raspbian, se escogi la Logitech
c170 debido a la relacin precio calidad.
17
https://es.wikipedia.org/wiki/Puente_H_(electr%C3%B3nica)
16
Figura 11 Cmara Web Logitech c170
Otras tecnologas:
Otras tecnologas que se utilizaron para el desarrollo de todas las funcionales que componen
el sistema son:
Se utiliz JavaScript para el desarrollo del demonio que estar ejecutndose continuamente
en el servidor. Se eligi este lenguaje en concreto por su universalidad, permite ejecutar la
aplicacin en cualquier dispositivo, y por qu fue diseado para potenciar la interaccin a
travs de internet. Gracias a JavaScript se puede ejecutar cdigo en los navegadores (cliente).
Por ltimo anticipar que node.js es un intrprete de JavaScript del lado del servidor. A
continuacin se mencionan las libreras que se utilizaran para simplificar el trabajo de
desarrollo, entre ellas:
Socket.io:
Es una librera de Node.js que permite manejar eventos en tiempo real mediante una
conexin TCP y todo ello en JavaScript. Es realmente potente y se puede hacer todo tipo de
aplicaciones en tiempo real. Este recurso de node.js facilit poder comandar desde el cliente
(navegador web) nuestra plataforma de manera fcil y veloz.
Express.js:
Es un framework extensible de manejo de servidores HTTP, el cual provee plugins de alto
rendimiento conocidos como middleware. Indispensable para conectar el servidor a internet.
Raspi-io:
Es una biblioteca compatible con Firmata API para Raspbian que se ejecuta en la Raspberry
Pi, que se puede usar como un plugin de E / S con Johnny-Five . Esta librera resulta
fundamental para poder controlar los pines GPIO utilizando J5.
Johnny-five.js:
Es un framework de programacin robtica basado en JavaScript lanzado por Bocoup en el
2012, es opensource, lo cual cuenta con muchos desarrolladores, ingenieros y colaboradores
17
que estn constantemente perfeccionando y agregando cosas nuevas. Es un recurso de

Node.js, y actualmente soporta multiples plataformas. Este framework, permiti controlar los
puertos GPIO. Resulta interesante mencionar que J5 permite comandar hasta 4 arduinos18 de
forma simultnea, algo a destacar teniendo en cuanta que la Raspberry solo posee 40 pines
GPIO y que no cuenta con entradas analgicas.
Para impedir conexiones simultaneas, se analizaron 4 posibles soluciones, entre ellas:
Utilizar la librera de node.js request-ip19 con el fin de obtener la direccin IP del cliente,
para as tener la posibilidad de compararla con una ya prefijada, de este modo lograr que solo
el cliente autorizado tenga acceso a la pgina web. La segunda propuesta sugera utilizar del
mismo modo que la direccin IP, la MacAdress del dispositivo con la librera getmac20. Sin
embargo se opt por utilizar una pgina de autentificacin con la que se impeda el uso de
terceros, y conjuntamente la librera express-session21 para controlar la cantidad de clientes
que se conectaban al servidor, as se logr que solo clientes autorizados logren ingresar a la
pgina y al mismo tiempo impedir clientes concurrentes.
Express-session.js:
Es una librera que permite crear sesiones a travs de un midware22 , permiti control de los
usuarios que accedan a la pgina y posibilit asignarle a cada uno un identificador.
Compulsive.js y Temporal.js:
Son libreras que permiten construir temporizadores, compulsive se utiliz con el propsito
de que transcurrido cierto tiempo la sesin expire y temporal23 para generar un ciclo
repetitivo (loop).
Connectivity.js:
Es una librera que verifica el estado de la conexin a internet y devuelve una funcin.
Servidor de video Motion:
Es un servidor de video dedicado a la vigilancia web, muy verstil, se destacan opciones tales
como, comenzar a grabar o sacar fotos en cuanto detecta movimiento, agregarle usuario y
contrasea para evitar el uso de terceros. Se configur el servidor para que muestre el video
en directo, no grabe ni saque fotos debido al poco espacio de almacenamiento con el que se
cuenta.
DNS: (opcional)
Si bien se limit a que tanto el servidor como el cliente estn conectados a la misma red
dentro de la universidad. En nuestro hogar se cont con la posibilidad de abrir los puertos del
router24 para poder hacer un DNS, este por sus siglas Domain Name System (sistema de
18
Arduino: Plataforma de prototipos electrnica de cdigo abierto.
19
https://www.npmjs.com/package/request-ip
20
https://www.npmjs.com/package/getmac
21
https://www.npmjs.com/package/express-session#reqsessionid-1
22
Midware: Software que se sita entre un sistema operativo y las aplicaciones que se ejecutan en l.
23
https://www.npmjs.com/package/temporal
24
Router: Dispositivo que proporciona conectividad a nivel de red.
18
nombres de dominio) es una tecnologa basada en una base de datos que sirve para resolver
nombres en las redes, es decir para conocer la direccin IP de la mquina donde est alojado
el dominio al que se quiere acceder. Utilizando esta tecnologa result posible acceder al
servidor aun si no se estaba conectado a la misma red. Hay diversas pginas que posibilitan
crear un servidor DNS, entre ellas No-ip25 .
Costos del proyecto:

Al realizar J5, se pudo lograr un vehculo terrestre de bajo costo. La principal ventaja del
prototipo diseado es su arquitectura abierta, la cual le permite a cualquier persona obtener
los planos mecnicos y electrnicos. La arquitectura de J5 se adapta al mbito de la
investigacin, debido a que en este entorno, es necesario incursionar en el rea de la
informtica y en los diversos lenguajes de programacin disponibles, entre los cuales se
pueden destacan JavaScript y HTML, es necesario que los circuitos y el firmware estn
disponibles, por otro lado, es importante que las herramientas informticas necesarias para
desarrollarlo no tengas altos costos. El mayor costo en nuestro proyecto est relacionado con
las partes de la plataforma de desarrollo, adquiridas a travs de un proveedor chino a precios
razonablemente bajos, en comparacin con los precios de los proveedores locales existentes
en el pas en este rubro. En la Tabla 2 se expresan los costos del proyecto.
Cantidad Material Descripcin Precio Subtotal (ARS)
USD ARS
1 Acero Plataforma de desarrollo 173 3027 3027
1 Microcomputador Raspberry Pi 3 43 752 752
2 Batera Bateras de gel --------- --------- ---------
1 Puente H Etapa potencia, 10.28 175 175

energizar motores de
12V
1 Fuente Convertidor stepdown --------- 250 250
5A
1 Cargador de Cargador bateras de gel --------- 700 700
batera de hasta 10mah
1 Gabinete Carcaza plstica --------- 250 250
Raspberry
1 Memoria Memoria sd 16gb clase --------- 300 300
10
1 Conectores Cables hembra-hembra --------- 70 70
Total 5524
Tabla 2 Presupuesto
25
https://www.noip.com/
19
3. Diseo
En este apartado se centrara en la estructura de los elementos que conformaran nuestro
sistema, estas estructuras marcarn las pautas que se seguirn a la hora de programar la
comunicacin entre el servidor y la pgina web.
Qu es Node.js?
JavaScript en el lado del servidor
Basado en la mquina virtual de Chrome (V8 JavaScript Runtime)
V8 est escrito en C (muy rpido)
Multiplataforma (Windows, Macintosh, Linux, etc.)
Es una marca registrada y es open source
Asncrono y orientado a eventos
Ideal para aplicaciones que consumen datos en tiempo real y que se ejecutan a travs
de dispositivos distribuidos
Es un entorno de programacin.
Lo usan muchas empresas (WalMart, Paypal, Yahoo, LinkedIn, eBay, Uber, etc)
Caractersticas de un lenguaje de programacin:
V8
Una gramtica que define su sintaxis
Un compilador que lo interpreta y ejecuta
Node.js
Mecanismos para interactuar con el exterior
Librera estndar (consola, ficheros, red, etc.)
Utilidades (intrprete, depurador, paquetes, etc.)
A modo comparativo:
Node.js Ruby Python PHP
Lenguaje JavaScript Ruby Python PHP
Motor V8 YARV cPython Apache
Entorno Mdulos del Librerias Librerias Librerias
core Standard Standard Standard
Frameworks Express Rails Django Laravel
Tabla 3 Comparacin distintos lenguajes de programacin
20
Infraestructura:
Compila directamente a cdigo mquina sin un intrprete gracias a V8
Modelo I/O (entrada/salida) orientado a eventos, asncrono y de no bloqueo, que lo

hace ligero y eficiente
Figura 12 Infraestructura Node.js
Entendamos:
Paralelismo: varios objetos realizando una accin cada uno simultneamente
(sncrono).
Concurrencia: un solo objeto, con varias tareas activas entre las que va alternando
(asncrono).
Infraestructura (PHP vs Node.js)
Figura 13 Infraestructura PHP vs NODE.JS
21
BLOCKING NON-BLOCKING
Abrir el archivo Abrir el archivo
Leer el archivo Leer el archivo
Imprimir contenido Cuando termines, imprimir contenido
Hacer algo ms Hacer algo ms
Tabla 4 Cuadro comparativo blocking vs non blocking
Caractersticas de Node.js:
Es concurrente26 sin paralelismo27
Es asncrono28 y no bloqueante
Orientado a eventos
Io.js:
Es un fork29 amigable de Node.js, compatible con npm30
Soporte para las ltimas versiones de V8
Desarrollo activo haciendo liberaciones semanales
Integracin continua y ejecucin de pruebas al 100%
Vinculacin con la comunidad
Gobernabilidad abierta por la comunidad y no por empresas
Hoja de ruta predecible
Comparacin entre JS y IO:

JavaScript: Io:
Limita objetivos a largo plazo Comunidad muy activa
Soporte completo en servidores y gestores de Rendimiento ligeramente superior

paquetes
Marca ampliamente conocida y reconocida Soporte para las ltimas versiones de V8
Tabla 5 Comparacin entre Javascript vs IO
26
Concurrencia: Dos o ms operaciones pueden estar ejecutndose al mismo tiempo (asncrono).
27
Paralelismo: Implica la ejecucin simultanea de dos o ms operaciones en el mismo nmeros de CPUs
(asncrono).
28
Asncrono: Un solo objeto, con varias tareas activas entre las que va alternando.
29
Fork: Bifurcacin, partir de un proyecto y hacerle modificaciones.
30
NPM: Gestor de paquetes de NODE.js.
22
Qu es WebSocket?
WebSocket es un protocolo nuevo para la web bajo TCP, por el cual a diferencia de la
conexin que se viene usando HTTP, este es bi-direccional y full-duplex31, esto significa
que HTTP32 es una conexin en una sola direccin, se pide al servidor y se espera la respuesta
(o viceversa con ServerEvents). Pero con websockets el servidor tambin te habla, te puede
llamar y mandar un mensaje en cualquier momento.
Figura 14 PHP vs Node.js
Con esto las posibilidades de un sitio web aumentan considerablemente, pero hay que tener
en cuenta algunas cosas:
Figura 15 Diferentes conexiones
Se inicia con un handshake33 HTTP, por lo que si no hay HTTP no hay WebSockets
Tanto servidor como cliente tienen que soportarlo (para eso tenemos a HTML 5 en
cliente y SocketIO en el servidor)
Slo se puede texto/ JSON (a diferencia del TCP convencional en el que podemos
transmitir streams de bytes)
La conexin TCP va por el puerto 80
31
Full-duplex: Transmite y recibe informacin en ambas direcciones al mismo tiempo.
32
HTTP: HyperText Transfer Protocol.
33
Handshake: Proceso para establecer las normas para la comunicacin.
23
Cmo funciona?
Para iniciar una conexin con el protocolo WS primero el cliente le solicita al servidor que
quiere iniciar esta conexin (handshake: se validan), el servidor responde y a partir de ese
instante dejan de utilizar HTTP y pasan a WS. Aparte de dar la posibilidad de una conexin
bi-direccional, se ahorra el payload34, es decir en estas transmisiones que se hacen por el
protocolo ws ya no se tiene el HTTP header y toda la data de info para que el servidor sepa
que se le est enviando y que se recibe, y qu tipo de conexin se usa, etc.
Figura 16 Funcionamiento websoekt (handshake)
Estructura web:
Para la estructura de la web se decidi seguir una estructura por bloques.
Figura 17 Estructura del proyecto
34
Payload: Brinda una funcin ante un error.
24
Inicialmente se cuenta con un servicio de autentificacin:
Figura 18 Pagina inicial login
Luego con una pantalla que arroja un mensaje cuando un cliente est conectado al servidor.
Figura 19 Mensaje ocupado - alguien inicio sesin
La pgina principal estar dividida en dos zonas diferenciadas, el control de los botones y el
contenedor de video.
Figura 20 Pgina principa
La parte roja de la pgina corresponde a los elementos que sern cliqueables y que permitirn
comandar nuestro vehculo. La parte azul es la interfaz de video, de este modo se consigue
un acceso centralizado a todos los servicios.
25
4. Implementacin
Se debe preparar el entorno donde se ejecutara el servidor. Se comenz preparando la
Raspberry, una vez que se tiene el sistema operativo listo, se puede empezar a instalar las
herramientas necesarias para ejecutar la aplicacin. En la pgina web oficial se puede
encontrar una gran variedad de sistemas operativos, pero el que realmente interesa es
Raspbian. Este sistema es una versin adaptada de Debian que ha sido optimizado para la
placa, cuenta con los programas bsicos que se pueden ejecutar en nuestra tarjeta. Se utilizara
la versin Wheezy, y la aplicacin Win 32 Disk Imager35 para montar la imagen con el
sistema en nuestra tarjeta SD.
Figura 21 Win 32 Disk Imager
Como se puede observar en la imagen superior, la interfaz del programa utilizado para
instalar el SO es bastante sencilla. Win 32 Disk Imager es un programa gratuito que permite
realizar instalaciones de sistemas operativos, realizar y recuperar copias de seguridad.
Cuando el programa termine, se puede colocar la tarjeta de memoria en nuestra Raspberry y
conectarla tanto a la alimentacin como a la red de internet.
Para configurar la Raspberry basta con ejecutar el comando: sudo raspi-config:
En este men se encuentran todas las opciones de configuracin a las que se tiene acceso, en
nuestro sistema.
Expand Filesystem: Permite aumentar el tamao del sistema de archivos.
Enable Boot to Desktop/Scratch: Permite cambiar el tipo de arranque del sistema

operativo, se puede elegir que arranque en modo consola o modo grfico directamente.
Internationalisation Options: En este caso se ha utilizado una codificacin para el
teclado spanish, se ha seleccionado la zona horaria europea en Madrid y se ha cambiado el
idioma a en_esp_UTF-8.
35
http://www.raspberry-projects.com/pi/pi-operating-systems/win32diskimager
26
Es importante mencionar que se debe habilitar el SSH36, la cmara web y VNC.
Figura 22 Pantalla de configuracin Raspberry
La IP que le ha dado el servidor de DHCP37 ha sido la 192.168.1.38, de modo que se conectara

ella a travs del protocolo de SSH. Este protocolo permite acceder y controlar mquinas de
modo remoto a travs de una red. ssh pi@192.168.1.38. Con este comando se puede acceder
a nuestra Raspberry con el usuario pi, de modo que cuando pregunte la contrasea solo
habr que introducir el password por defecto que tiene el SO raspberry. Una vez dentro del
sistema se podr empezar a instalar lo que se necesite.
Node.js:
Previamente a la instalacin de node.js es necesario actualizar las dependencias y libreras
del sistema operativo. En el terminal se ejecuta:
#sudo apt-get update y #sudo apt-get upgrade
Para instalar node.js:
#sudo apt-get install nodejs, luego para instalar libreras solo se necesita poner #sudo npm
install, y para correr para aplicacin sudo node aplicacion.js
Figura 23 Logo de node.js
36
SSH: Es un protocolo que facilita las comunicaciones seguras entre dos sistemas usando una arquitectura
cliente/servidor y que permite a los usuarios conectarse a un host remotamente.
37
DHCP: Es un protocolo cliente-servidor que proporciona automticamente un host de protocolo Internet
(IP) con su direccin IP.
27
Putty:
Por lo tanto PuTTY es un cliente SSH, Telnet, rlogin, y TCP raw con licencia libre, se instal
en la pc (window), para controlar, y editar programas en la Raspberry Pi. Surge de la
necesidad de no conectar la placa a un mouse, teclado ni monitor, solo a la alimentacin y a
internet (wifi).
Figura 24 Inicio sesin mediante SSH, Putty
Filezilla:
FileZilla es un cliente FTP38 multiplataforma de cdigo abierto y software libre, result til
debido a que era ms prctico trabajar en la PC (window) y luego enviar mediante FTP los
archivos a la Raspberry para su utilizacin.
Figura 25 Transferencia de archivos mediante FTP
38
FTP: (File Transfer Protocol) es un protocolo de transferencia de archivos entre sistemas conectados a una
red TCP basado en la arquitectura cliente-servidor.
28
Vnc:
VNC es un programa de software libre basado en una estructura cliente-servidor que permite
tomar el control del ordenador servidor remotamente a travs de un ordenador cliente.
Tambin se denomina software de escritorio remoto. Surge de la necesidad de no depender
de un mouse, teclado ni de un monitor conectado a la placa, solo de la alimentacin y de
internet.
Figura 26 Logo de VNC (Virtual Network Computing)
Ipscan:
Escner de red fiable y gratuito para analizar LAN. El programa escanea todos los
dispositivos de red, le da acceso a las carpetas compartidas y a los servidores FTP, le
proporciona control remoto de las computadoras (mediante RDP y Radmin) e incluso puede
apagar las computadoras de manera remota. Es fcil de usar y se ejecuta como una edicin
porttil. Debe ser la primera opcin para cada administrador de red. Resulto til, puesto que
la direccin IP de la placa era dinmica, y para poder conocer la direccin IP que se le
asignaba, era necesario utilizar el comando ifconfig con la placa conectada a un monitor,
mouse y teclado, para evitar esto, con el escner de IP se logr conocer la direccin que la
red le asignaba a la placa, solo con tenerla conectada a internet.
Figura 27 Inspeccin de la IP que nuestro servidor de DHCP le asigno a nuestra Raspberry
29
Motion:
Previamente a la instalacin en la Raspberry del servidor de video, lo que se debe hacer es
actualizar el sistema operativo, para lo cual se ejecuta:
sudo apt-get update
sudo apt-get upgrade
Ahora s, se procede a instalar el paquete Motion mediante el comando:
sudo apt-get install motion
Una vez finalizada la instalacin es conveniente modificar algn que otro parmetro en los
ficheros de configuracin. Para ello se abre el fichero (motion.conf) con el editor nano
mediante el comando:
sudo nano /etc/motion/motion.conf
Para ms facilidad, y dado el tamao del fichero, se comenta la zona del mismo donde se
localizan los parmetros a modificar, adems de aadir un pequeo comentario sobre su
utilidad.
Se editan varios parmetros para adecuar el hardware/software a nuestra necesitad. Se ejecuta
lo siguiente:
> En zona ## Daemon ##
daemon ON
> En zona ## Capture device options ##
image width 320
image height 240
Nota: Se adecua el tipo de paleta de vdeo y resolucin.
> En zona ## Live Webcam Server ##
webcam_port 8001
webcam_localhost off
Nota: habilita puerto de visualizacin y la misma en otros equipos de la red.
Para asegurar que ninguna persona no autorizada tenga acceso al video en directo, se
configur el servidor con usuario y contrasea.
30
Figura 28 Agregado de usuario y contrasea
Sublime text 2:
Es un editor de cdigo multiplataforma ligero, una herramienta concebida para programar
sin distracciones. Su interfaz de color oscuro y la riqueza de coloreado de la sintaxis, centra
nuestra atencin completamente. Es un software muy sencillo y ligero que facilita la
correccin de nuestro cdigo.
Figura 29 Logo Sublime Text 2
31
5. Como funciona:
Cdigo JavaScript:
Para comenzar con la aplicacin web, se definieron las dependencias de software de nuestro
proyecto. Para hacerlo, se cre un archivo package.json con sudo npm init, que se ver
como el siguiente:
{"name": "J5", "dependencies": {"express": "^4.11.2", "johnny-five":

"^0.8.53", "socket.io": "^1.3.3", "compulsive": "0.3.1", "raspi-
io":"8.1.0", "express-session": "1.15.6" ", "temporal": "1.6",
"connectivity": "1.0.6"}
Se ejecut sudo npm install en la raz de la carpeta del proyecto despus de crear el archivo
para que se instalen todas las dependencias.
Cdigo del lado del servidor (index):
El cdigo del servidor se basa en Node.js y Express . Se cre un archivo llamado J5.js en la
raz de nuestro directorio de proyectos. Este archivo contendr toda nuestra lgica del lado
del servidor.
var express = require('express');
var app = express();
var io = require('socket.io')(app.listen(8081));
var five = require('johnny-five');
var temporal = require(temporal)
var connectivity =require(connectivity);
app.use(express.static(__dirname + '/app'));
app.get('/', function (res) {

res.sendfile('/index.html');
});
var board = new five.Board({

repl:false
});
La funcin express() es una funcin de nivel superior exportada por el mdulo Express.
express.static() es responsable de servir los activos estticos al lado del cliente. app.get da
la ruta de solicitud HTTP a la ruta especificada con una funcin de devolucin de llamada.
El objeto res representa la respuesta HTTP que enva una aplicacin express cuando recibe
una solicitud. El mtodo sendFile enva el archivo desde la ruta especfica al navegador.
Se est utilizando Socket.IO para mantener una conexin en tiempo real entre el cliente y el
servidor aprovechando el poder de WebSockets y johnny-five.
Para comenzar, se crea una nueva instancia de Board, una vez hecho esto, toda la lgica se
implementar una vez que la placa est lista (lo que significa que cuando este ready evento
ready). Dentro de la funcin de devolucin de llamada, se crea las instancias de LED.
Especficamente, [P1-33], [P1-32], [P1-7], [P1-11], [P1-13] y [P1-15] representan los pines
de la Raspberry pi 3 al que estarn unidos los respectivos motores al puente H.
32
var raspi = require('raspi-io');

var temporal = require('temporal');
var compusilve = require('compulsive');

res.sendFile('/index.html')
});

io : new raspi()
});
board.on('ready', function () {
var velocidad_izq = new five.Led('P1-33');

var velocidad_der = new five.Led('P1-32');
var A1 = new five.Led('P1-7');
var B1 = new five.Led('P1-13');
io.on('connection', function (socket) {

socket.on('stop', function () {
velocidad_izq.brightness(0);
velocidad_der.brightness(0);
A1.off();
A2.off();
B1.off();
B2.off();
});
socket.on('start', function () {
A2.on();
A1.off();
B2.on();
B1.off();
});
socket.on('reverse', function () {
A2.off();
A1.on();
B2.off();
B1.on();
});
socket.on('left', function () {
A2.on();
A1.off();
B2.off();
B1.on();
});
33
socket.on('right', function () {
A2.off();
A1.on();
B2.on();
B1.off();
});
});
this.on('exit', function() {
velocidad_izq.off();
velocidad_der.off();
A2.off();
A1.off();
B2.off();
B1.off();
});
CODIGO PARADA DE EMERGENCIA POR FALTA DE CONEXION ()
});
La velocidad de los motores se especifica con un nmero que va de 0 a 255. El mtodo .stop()
permite que el motor se detenga. Los .fwd() y .rev() son solo alias para .forward() y
.reverse() . Todos ellos aceptan un nmero como argumento, que va de 0 a 255, para
controlar la velocidad. Se estn utilizando diferentes combinaciones de velocidades hacia
adelante y hacia atrs para obtener diferentes movimientos de los motores.
Para completar nuestro proyecto, se debe detectar cundo el usuario ha seleccionado una
opcin particular en el lado del cliente en tiempo real, aqu es donde entra en juego Socket.IO.
El evento de connection se activa cuando se establece una nueva conexin con el cliente.
Cada vez que el cliente emite un evento, el mtodo .on() permite escuchar ese evento en el
servidor y realizar algunas acciones.
Parada de emergencia por falta de conexin:
cont=0;
temporal.loop( 500, function() {//loop de 0.5 segundos
connectivity(function (online) {
if (online) {
cont=0;//reinicio de contador
} else {
cont=cont+1;//Incrmenta contador
if (cont>2&cont<5) {//cont mayor para evitar glitches
velocidad_izq.brightness(255); //motores en reversa
velocidad_izq1.brightness(225);
velocidad_der1.brightness(255);
A2.on();
A1.off();
B2.on();
B1.off();
C2.on();
C1.off();
D2.on();
D1.off();
34
compulsive.wait(10000,function(){//10segundos despues detiene los motores

A1.off();
A2.off();
B1.off();
B2.off();
C1.off();
C2.off();
D1.off();
D2.off();
});//compulsive
}//if
}//else
});//connectivity
});//temporal
Este script realiza un ciclo cada medio segundo con la librera temporal39 y verifica con
connectivity40 en qu estado se encuentra la conexin a internet, en caso que la conexin falle
los motores giran en reversa durante 10 segundos, y luego con la librera compulsive se
detienen (se pretende recuperar la conexin por estar fuera del rango).
Servicio de autenticacin:
<script language="JavaScript">
function Login(){
var done=0;
var usuario=document.login.usuario.value;
var password=document.login.password.value;
if (usuario=="pi" && password=="raspberry") {
window.location="Rd13pfdXYZ.html";
console.log('acceso')
}
if (usuario=="pi2" && password=="raspberry") { // para otro usuario
window.location="otra.pagina.html";
}
if (usuario=="" && password=="") {
window.location="errorpopup.html";
}
}
</script>
</center>
<script language="Javascript">

</script>
Este script realiza una comparacin entre el usuario y la contrasea ingresada, si es

verdadero el usuario puede acceder a la pgina web RCd13pfdXYZ.html que es donde
puede controlar el robot. Es decir que si los datos ingresados son vlidos, dentro del
39
https://www.npmjs.com/package/temporal
40
https://www.npmjs.com/package/connectivity
35
condicional if se ejecuta el comando window.location() que busca el archivo

RCd13pfdXYZ.html, caso contrario la pgina persiste en que se ingrese correctamente el
usuario y contrasea.
Sesiones:
El script sesin.js inicializa una variable contador en cero, llama a la librera express-
session() verifica si alguien quiere ingresar a la pgina, y le asigna a cada cliente un
identificador, que con la funcion req.sessionID se puede leer, este se compara en un
condicional if (), de modo si es distinto de cero se incrementa el contador en uno y se lo
compara nuevamente con otro if() que verifica que contador sea distinto de cero, si es
verdadero es porque hay un cliente y la funcin req.send() enva el mensaje el servidor
ocupado, caso contrario, es decir contador igual a cero, se llama a la funcin req.redirect()
y se re direcciona a la pgina index.html donde el usuario puede autentificarse, al mismo
tiempo se ejecuta la librera compulsive que no es nada ms que un temporizador, el cual
pasado determinado tiempo ejecuta una instruccin (la destruccin de la sesin y el reinicio
del contador), permitiendo que otro usuario pueda loguearse.
const express = require('express');
cookieParser = require('cookie-parser');
var compulsive = require("compulsive"); //tiempo
const app = express();
app.use(cookieParser());
app.listen(8000);
const session = require('express-session');
app.use(session({
secret: 'keyboard cat',
resave: false,
saveUninitialized: true
}))
cont=0;
app.get('/',function(req,res, next){
console.log(req.sessionID);
if (req.sessionID!="1") {
cont=cont+1;
console.log(cont)
if (cont!=1) {
res.send('SERVIDOR OCUPADO')
}
else{
res.redirect('la_IP_de_la_Raspi:3000')
compulsive.wait(100000, function() {
req.sessionID="0";
cont=0;
});
}
}
});
36
Cdigo HTML:
La implementacin del lado del cliente implica la creacin de la interfaz donde el usuario
puede seleccionar los diferentes movimientos de los motores. Se comenz creando un archivo
RCd13pfdXYZ.html dentro de la carpeta de la app presente en la raz del directorio. En esta
pgina, se incluye la versin de cliente de Socket.IO.
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>PROYECTO</title>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/font-
awesome/4.4.0/css/font-awesome.min.css">
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="container">
<iframe frameborder="0" width="700" height="500" align="middle"
src="http://192.168.1.41:8081/"></iframe>
<i class="fa fa-angle-up" id="forward"></i>

<i class="fa fa-angle-left" id="left"></i>
<i class="fa fa-angle-down" id="reverse"></i>
<i class="fa fa-angle-right" id="right"></i>
<i class="fa stop" id="stop">STOP</i>
</div>
</body>
<script
src="//cdnjs.cloudflare.com/ajax/libs/socket.io/1.3.6/socket.io.min.js"></script>
<script src="app.js"></script>
comandos de HTML i class=fa fa angle-up son los botones, id=forward el
</html>
Los nombre
o identificador. En el script app.js, el comando document.getElementById('forward').
onclick=moveForward, quiere decir si forward es cliqueado se enva el evento
moveForward. Socket.IO expone un mtodo global, que se agrega en el objeto window, que
se llama io() socket.emit('right') este enviar un mensaje de regreso al servidor con el nombre
del evento right . Una vez que se invoca emit() en el cliente, se ejecuta la devolucin de
llamada asociada con socket.on('right') en el servidor. La funcin iframe() es la encargada de
generar la ventana que posibilita ver el video.
var socket = io();
function moveForward(){
socket.emit('start');
}
function turnRight(){
socket.emit('right');
}
function turnLeft(){
socket.emit('left');
}
function moveReverse(){
socket.emit('reverse');
}
function stop(){
socket.emit('stop');
}
document.getElementById('forward').onclick = moveForward;
document.getElementById('right').onclick = turnRight;
document.getElementById('left').onclick = turnLeft;
document.getElementById('reverse').onclick = moveReverse;
document.getElementById('stop').onclick = stop;
37
Cdigo autentificacin:
El siguiente cdigo se encarga de mostrar en la ventana de navegador, la pgina de logueo o
autentificacin. Con la funcin input se crean los campos para ingresar texto, uno para el
usuario y otro para la contrasea, seguidamente otro input pero del tipo button, donde el
cliente puede validar sus datos.
<html>
<head>
<title>sistema de login</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1,
user-scalable=no">

<link rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"
integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u"
crossorigin="anonymous">

href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css"
integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp"

<link rel="stylesheet" type="text/css" href="estilo.css">
</head>
<body>
<div id="Contenedor">
<div class="Icon">

<span class="glyphicon glyphicon-user"></span>
</div>
<div class="ContentForm">
<form name="FormEntrar">
<div class="input-group input-group-lg">
<span class="input-group-addon" id="sizing-addon1"><i class="glyphicon glyphicon-
envelope"></i></span>
<input type="email" class="form-control" name="correo" placeholder="Correo"
id="Correo" aria-describedby="sizing-addon1" required>
</div>
<br>
<span class="input-group-addon" id="sizing-addon1"><i class="glyphicon glyphicon-

lock"></i></span>
<input type="password" name="contra" class="form-control" placeholder="******" aria-
describedby="sizing-addon1" required>
</div>
<br>
<button class="btn btn-lg btn-primary btn-block btn-signin" id="IngresoLog"
target="_parent" onclick="Login()" type="button">Entrar </button>
</form>
</div>
</div>

<script
src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"
integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa"
crossorigin="anonymous"></script>
38
Cdigo CSS:
Es un lenguaje de hojas de estilos creado para controlar el aspecto o presentacin de los
documentos electrnicos definidos con HTML y XHTML. CSS es la mejor forma de separar
los contenidos y su presentacin y es imprescindible para crear pginas web complejas.
*{ Pagina principal:
margin: 0;
padding: 0;
box-sizing: border-box;
}
html,body{
width: 100%;
height: 100%;
background-color: #1CA26C;
overflow: hidden;
}
.container{
width: 295px;
margin: 160px auto;
}
.fa{
padding: 26px 35px;
border-radius: 3px;
border: 1px solid #eeeeee;
font-size: 35px;
font-weight: bolder;
cursor: pointer;
float: left;
box-shadow: 0 1px 1px 0 rgba(0,0,0,0.4);

margin: 0 5px;
color: #fff;
}
.fa:hover{
}
.fa:first-of-type{
margin: 18px 100px;
display: block;
}
.stop{
width: 96%;
margin-top: 15px;
text-align: center;
}
Con HTML, body se define el ancho y el largo de la ventana, se fij para que ocupe el 100%
por 100%, es decir para que la pgina se adapte a todos los tamaos de los monitores, y con
background se defini el fondo. Luego se encuentra el conteiner, esta es una ventana que
contiene los botones cliqueables, seguidamente los estilos, la posicin y el tamao de los
botones.
39
Pgina autentificacin:
*/
body{
font-size: 12px;
}
#Contenedor{
width: 400px;
margin: 50px auto;
background-color: #F3EDED;
border: 1px solid #ECE8E8;
height: 400px;
border-radius:8px;
padding: 0px 9px 0px 9px;
}
/**
* Aplicando al icono de usuario el color de fondo,
* rellenado de 20px y un redondeado de 120px en forma
* de un circulo
*/
.Icon span{
background: #A8A6A6;
padding: 20px;
border-radius: 120px;
}
/**
* Se aplica al contenedor madre un margen de tamao 10px hacia la cabecera y pie,
* color de fuente blanco,un tamao de fuente 50px y texto centrado.
*/
.Icon{
margin-top: 10px;
margin-bottom:10px;
color: #FFF;
font-size: 50px;
text-align: center;
}
/**
* Se aplica al contenedor donde muestra en el pie
* la opcin de olvidaste tu contrasea?
*/
.opcioncontra{
text-align: center;
margin-top: 20px;
font-size: 14px;
}
/******************************************/
/*** DISEO PARA MOVILES 320 ****/
/******************************************/
@media only screen and (max-width:320px){
#Contenedor{
width: 100%;
height: auto;
margin: 0px;
}
40
6. Puesta en funcionamiento:
En este apartado se enfoca a la puesta en marcha del vehculo.
CONEXIONES GPIO:
Physical Pin Peripherals | Peripherals Physical Pin
P1-1 3.3V | 5V P1-2
P1-3 SDA0 | 5V P1-4
P1-5 SCL0 | GND P1-6
P1-7 GPIO4 (GRIS) | GPIO14/TXD0 P1-8
P1-9 GND | GPIO15/RXD0 P1-10
P1-11 GPIO17(AZUL/BLANCO) | GPIO18/PWM0(BLANCO) P1-12
P1-13 GPIO27 (VIOLETA) | GND P1-14
P1-15 GPIO22(VERDE) | GPIO23 P1-16
P1-17 3.3V | GPIO24 P1-18
P1-19 GPIO10/MOSI0 | GND P1-20
P1-21 GPIO9/MISO0(AMARILLO) | GPIO25 P1-22
P1-23 GPIO11/SCLK0 | GPIO8/CE0 P1-24
P1-25 GND | GPIO7/CE1 P1-26
P1-27 Do Not Connect | Do Not Connect P1-28
P1-29 GPIO5 | GND P1-30
P1-31 GPIO6 | GPIO12/PWM0(MARRON) P1-32
P1-33 GPIO13/PWM1(ROJO) | GND P1-34
P1-35 GPIO19/MISO1/PWM1(NEGRO) | GPIO16(VERDE/BLANCO) P1-36
P1-37 GPIO26(NARANJA) | GPIO20/MOSI1(AZUL) P1-38
P1-39 GND | GPIO21/SCLK1 P1-40
Tabla 6 Conexiones GPIO
CONEXIONES PUENTE H:
GRIS A1
AZUL/BLANCO A2
VIOLETA B1
VERDE B2
NARANJA C1
AMARILLO C2
AZUL D1
VERDE/BLANCO D2
BLANCO ENC/A (PWM)
MARRON ENC/B (PWM)
ROJO ENC/C (PWM)
NEGRO ENC/D (PWM)
Tabla 7 Conexin puente H
41
INSTRUCCIONES:
1. Se necesitan dos bateras de 12V de 5mah o ms
2. Asegurarse que estn cargadas
3. Revisar que el convertidor buck este correctamente regulado a 5V
4. Conectar la Raspberry y el cliente a la misma red WIFI
5. Inspeccionar la direccin IP de la placa (Ipscan o desde la placa con ifconfig)
6. Tener que cuenta que si la IP es distinta a la configurada en el cdigo HTML el
servidor de video no ser posible visualizarse, en este caso es necesario posicionarnos
con cd Desktop/Proyecto/J5/app, y con sudo nano RcD13pfdXYZ.html cambiar la
direccin IP, si no saltar a 8.
7. Iniciar servidor MOTION desde el terminal(sudo motion service start)
8. Posicionarnos desde el terminal con cd Desktop/Proyecto/J5
9. Iniciar el servidor con sudo node J5.js
10. Abrir otra ventana de comando
11. Posicionarnos con SSH cd Desktop/Proyecto/J5
12. Iniciar servicio de sesiones con sudo node sesin.js
13. Ingresar a la web con IP que tome la Raspberry y el puerto 8000, a modo de ejemplo
192.168.1.42:8000
14. Usuario y clave pgina autentificacin: pi@martin:raspberry
15. Usuario y clave servidor de video: pi:martin
16. Para cancelar el servicio pulsar control+C dos veces.
17. Tener en cuenta que la Raspberry es una computa y como tal requiere de un apagado
adecuado, el mismo se realiza con sudo shutdown h now.
42
7. Conclusiones:
En principio debemos destacar que tanto, el objetivo general, como los objetivos especficos
planteados, se logran cumplir al disear el control del vehculo terrestre no tripulado
mediante un servidor web, capas de permitirnos controlar nuestra plataforma en tiempo real,
visualizar imgenes en directo, tener control de las sesiones de los clientes, protegerlo con
usuario/contrasea y contar la posibilidad de verificar el estado de la conexin a internet. El
Proyecto J5 logra incentivar en el departamento de Electrnica la continuidad del mismo,
investigando y desarrollando mejoras futuras. Por otro lado permite llevar a la prctica las
herramientas y conocimientos adquiridos en los cursos de la carrera, adems de incursionar
en el rea la informtica en un proyecto de fin de carrera. El informe realizado posee una
estructura tal, que permite el seguimiento del proyecto, ya que se brinda toda la
documentacin de manera detallada.
Propuestas para desarrollos futuros:

Evaluamos la estructura web, dentro de esta el agregado de grficos en tiempo real
(HigtChart41 una de las tantas plataformas que los proporciona), si se quiere monitorear:
Velocidad del robot
Tiempo restante de las bateras
Temperatura
Humedad relativa
Calidad del aire
Todo esto en funcin del tiempo y a su vez esbozar grficos estadsticos que permitan un
anlisis detallado del proyecto.
Cabe destacar que para poder realizar dichos grficos la placa debe contar con diversos
sensores, tales como giroscopios, acelermetros, sensores de temperatura, humedad entre
otros. Seria de utilidad contar con una ventana web en donde se tenga acceso a las lecturas
de todos los sensores a la vez.
Reemplazo de la placa Raspberry por un modelo posterior, ya que al ser componentes
electrnicos estos caducan con facilidad debido al gran avance que experimentan
diariamente, quizs en un futuro cuente con mejores prestaciones que sern de gran utilidad
para el agregado de nuevas caractersticas, en especial las inalmbricas y entradas analgicas.
El agregado de una aplicacin mvil, es indispensable por el hecho de que todos contamos
con los ya cotidianos Smartphones, esto sera ideal para interactuar de una forma eficaz y
eficiente con el robot.
No podemos descartar contar con una cmara 360, que a la fecha estn muy bien posicionadas
en el mercado y es una muy buena alternativa adquirir una, ya que no es tan elevado el costo,
41
https://www.highcharts.com/
43
tendramos la posibilidad de tomar todos los ngulos de nuestro robot y con esto tener una
mejor apreciacin del terreno.
Renovar la autonoma de las bateras por unas de ms capacidad (mAh) y de Li-po con esto
estaramos solventando 3 problemas, quitarle peso a la plataforma, liberar espacio y aumentar
su tiempo operativo.
La incorporacin de un GPS sera esencial, es una de la caractersticas que nos permitira
conocer la posicin, velocidad y direccin del vehculo, esto resultara til si se lo comandara
a largas distancias, el robot podra almacenar las coordenadas de partida lo comnmente
denominado home, de modo que el cliente podra llamarlo(regreso a casa) o de forma
autnoma por baja batera, este podra regresar al punto de partida, para ello sera
indispensable contar con sensores de proximidad para que pueda sortear los obstculos que
se le presenten, es importante mencionar que si vamos a trabajar a grandes distancias, no
podremos estar conectarnos a la misma red, por lo que necesitaremos de un servidor DNS
que nos permita acceder al robot desde cualquier lugar que cuente con internet.
Evaluar la posibilidad de utilizar una tecnologa inalmbrica de mayor alcance.
Contar con una base de datos entre ellas MySql42 para el almacenamiento de imgenes,
videos o muestras de los diversos sensores, como as con servicio de autentificacin Usuario
y contrasea ms sofisticado.
Actualmente existen diferentes alternativas de autentificacin una de ellas el framework
Passport.js43, lo encontramos en plataformas como Facebook, Instagram, twitter entre otras.
42
https://www.mysql.com/
43
https://www.npmjs.com/package/passport
44
8. Bibliografa:
1. https://nodejs.org/es/
2. https://socket.io/
3. http://expressjs.com/es/
4. http://johnny-five.io/
5. https://letsrobot.tv/
6. http://www.gitmedio.com/gitmedio/formulario-de-login-en-html5/
7. http://lavrsen.dk/foswiki/bin/view/Motion/MotionGuideGettingItRunning
8. http://www.tutorialesprogramacionya.com/javascriptya/index.php?inicio=0
9. https://github.com/nebrius/raspi-io/wiki/Pin-Information
10. https://codepen.io/
11. https://www.w3schools.com/
12. http://tesis.ipn.mx/bitstream/handle/123456789/15939/168%20-
%20Fosf..pdf?sequence=1
13. https://www.aprenderaprogramar.com/index.php?option=com_content&view=article&i
d=926:cabeceras-http-headers-que-son-y-para-que-sirven-status-authorization-user-
agent-referer-cu01208f&catid=83&Itemid=212
14. https://es.slideshare.net/rcostu/concurrencia-paralelismo
15. https://serprogramador.es/que-es-frontend-y-backend-en-la-programacion-web/
16.
17. John Resig y Bear Bibeault .(2008), Secrets of the javascript ninja
18. Douglas Crockford. (2008), Javascript the good parts
45
9. Anexos:
Cdigos JavaScript:
Autentificacin:
<script language="JavaScript">
function Login(){
var done=0;
var usuario=document.login.usuario.value;
var password=document.login.password.value;
if (usuario=="pi@martin.com" && password=="raspberry") {
window.location="Rd13pfdXYZ.html";
console.log('acceso')
}
if (usuario=="pi2" && password=="raspberry") { // para otro usuario
window.location="otra.pagina.html";
}
if (usuario=="" && password=="") {
window.location="errorpopup.html";
}
}
</script>
</center>
<script language="Javascript">

</script>
Parada de emergencia (forma parte de J5.js):

cont=0;
temporal.loop( 500, function() {
connectivity(function (online) {
if (online) {
cont=0;
} else {
cont=cont+1;
if (cont>2&cont<5) {
velocidad_izq.brightness(255); //motores en reversa
A2.on();
A1.off();
B2.on();
B1.off();
C2.on();
C1.off();
D2.on();
D1.off();
46
compulsive.wait(10000,function(){//10segundos despues detiene los motores

A1.off();
A2.off();
B1.off();
B2.off();
C1.off();
C2.off();
D1.off();
D2.off();
});//compulsive
}//if
}//else
});//connectivity
});//temporal
Sesion.js:
const express = require('express');
cookieParser = require('cookie-parser');
var compulsive = require("compulsive"); //tiempo
const app = express();
app.use(cookieParser());
app.listen(8000);
const session = require('express-session');
app.use(session({
secret: 'keyboard cat',
resave: false,
saveUninitialized: true
}))
cont=0;
app.get('/',function(req,res, next){
console.log(req.sessionID);
if (req.sessionID!="1") {
cont=cont+1;
console.log(cont)
if (cont!=1) {
res.send('SERVIDOR OCUPADO')
}
else{
res.redirect('la_IP_de_la_Raspi:3000')
compulsive.wait(100000, function() {
req.sessionID="0";
cont=0;
});
}
}
});
47
J5.JS
var raspi = require('raspi-io');
var temporal = require('temporal);
var compulsive = require('compulsive');

res.sendFile('/index.html')
});

io : new raspi()
});
board.on('ready', function () {
var velocidad_izq = new five.Led('P1-33');//asignacin pines GPIO

var velocidad_der = new five.Led('P1-32');
io.on('connection', function (socket) {

socket.on('stop', function () {//motores detenidos
A1.off();
A2.off();
B1.off();
B2.off();
});
socket.on('start', function () {//motores avance

A2.on();
A1.off();
B2.on();
B1.off();
});
socket.on('reverse', function () {//motores retroceso

A2.off();
A1.on();
B2.off();
B1.on();
});
socket.on('left', function () {//Izquierda

A2.on();
A1.off();
B2.off();
B1.on();
});
48
socket.on('right', function () {//derecha

A2.off();
A1.on();
B2.on();
B1.off();
});
});
this.on('exit', function() {//Para detener el servidor pone alto a
los motores
velocidad_izq.off();
velocidad_der.off();
A2.off();
A1.off();
B2.off();
B1.off();
});
Script parada de emergencia();
});
APP.JS:
var socket = io();
function moveForward(){
socket.emit('start');
}
function turnRight(){
socket.emit('right');
}
function turnLeft(){
socket.emit('left');
}
function moveReverse(){
socket.emit('reverse');
}
function stop(){
socket.emit('stop');
}
document.getElementById('forward').onclick = moveForward;
document.getElementById('right').onclick = turnRight;
document.getElementById('left').onclick = turnLeft;
document.getElementById('reverse').onclick = moveReverse;
document.getElementById('stop').onclick = stop;
49
Cdigo (HTML)
RcD13pfdXYZ.html:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>PROYECTO J5</title>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/font-
awesome/4.4.0/css/font-awesome.min.css">
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="container">
<iframe frameborder="0" width="700" height="500" align="middle"
src="http://192.168.1.41:8081/"></iframe>//ventana de video en stream
<i class="fa fa-angle-up" id="forward"></i>

<i class="fa fa-angle-left" id="left"></i>
<i class="fa fa-angle-down" id="reverse"></i>
<i class="fa fa-angle-right" id="right"></i>
<i class="fa stop" id="stop">STOP</i>
</div>
</body>
<script
src="//cdnjs.cloudflare.com/ajax/libs/socket.io/1.3.6/socket.io.min.js"></scrip
t>
<script src="app.js"></script>
</html>
50
Pgina Autenticacin (index.html):

<html>
<head>
<title>sistema de login</title>
<meta name="viewport" content="width=device-width, initial-scale=1,
maximum-scale=1, user-scalable=no">

href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.
css" integrity="sha384-
BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u"

href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-
theme.min.css" integrity="sha384-
rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp"

<link rel="stylesheet" type="text/css" href="estilo.css">
</head>
<body>
<div id="Contenedor">
<div class="Icon">

<span class="glyphicon glyphicon-user"></span>
</div>
<div class="ContentForm">
<form name="FormEntrar">
<span class="input-group-addon" id="sizing-addon1"><i class="glyphicon
glyphicon-envelope"></i></span>
<input type="email" class="form-control" name="correo"
placeholder="Correo" id="Correo" aria-describedby="sizing-addon1"
required>
</div>
<br>
51
Cdigo css:
Style.css(Rd13pfdXYZ):
*{
margin: 0;
padding: 0;
box-sizing: border-box;
}
html,body{
width: 100%;
height: 100%;
background-color: #1CA26C;
overflow: hidden;
}
.container{
width: 295px;
margin: 160px auto;
}
.fa{
padding: 26px 35px;
border-radius: 3px;
border: 1px solid #eeeeee;
font-size: 35px;
font-weight: bolder;
cursor: pointer;
float: left;

margin: 0 5px;
color: #fff;
}
.fa:hover{
}
.fa:first-of-type{
margin: 18px 100px;
display: block;
}
.stop{
width: 96%;
margin-top: 15px;
text-align: center;
}
52
Estilo.css(Autentificacin):
*/
body{
font-size: 12px;
}
#Contenedor{
width: 400px;
margin: 50px auto;
background-color: #F3EDED;
border: 1px solid #ECE8E8;
height: 400px;
border-radius:8px;
padding: 0px 9px 0px 9px;
}
/**
* Aplicando al icono de usuario el color de fondo,
* rellenado de 20px y un redondeado de 120px en forma
* de un circulo
*/
.Icon span{
background: #A8A6A6;
padding: 20px;
border-radius: 120px;
}
/**
* Se aplica al contenedor madre un margen de tamao 10px hacia la cabecera
y pie,
* color de fuente blanco,un tamao de fuente 50px y texto centrado.
*/
.Icon{
margin-top: 10px;
margin-bottom:10px;
color: #FFF;
font-size: 50px;
text-align: center;
}
/**
* Se aplica al contenedor donde muestra en el pie
* la opcin de olvidaste tu contrasea?
*/
.opcioncontra{
text-align: center;
margin-top: 20px;
font-size: 14px;
}
/******************************************/
/*** DISEO PARA MOVILES 320 ****/
/******************************************/
@media only screen and (max-width:320px){
#Contenedor{
width: 100%;
height: auto;
margin: 0px;
}
53

Robot Controlado Con Wifi Mediante Raspberry y Node - Js

Enviado por

Dados do documento

Título original

Direitos autorais

Formatos disponíveis

Compartilhar este documento

Compartilhar ou incorporar documento

Opções de compartilhamento

Você considera este documento útil?

Este conteúdo é inapropriado?

Direitos autorais:

Formatos disponíveis

Robot Controlado Con Wifi Mediante Raspberry y Node - Js

Enviado por

Direitos autorais:

Formatos disponíveis

FACULTAD DE INGENIERA

Control de un robot a travs de internet mediante Raspberry Pi y NODE.js

Trabajo de Fin de Grado

Grado en Ingeniera Electrnica

Apellido y Nombres del Alumno: Alaniz, Dario Martin

Apellido y Nombres del Alumno: Casas, Mario David

Fecha de entrega: 09 Noviembre 2017

Las especificaciones de la tarjeta son:

Como la Raspberry Pi es una computadora de bajo costo, se ajust perfectamente a las

Figura 2 Sistema operativo Raspbian

Figura 3 Servidor APACHE

Figura 4 Intrprete y entorno de programacin NODE.JS

Figura 5 Plataforma de desarrollo

Figura 6 A la izquierda batera de gel, derecha batera LIPO

Figura 7 Convertidor de potencia DC/DC Step Down

El dispositivo StepDown O BUCK, es un convertidor de potencia DC/DC sin aislamiento

Figura 8 Esquema bsico convertidor Step Down o Buck

Figura 9 GPIO, Raspberry Pi 3

Estructura de un puente H (marcado en rojo)

Los 2 estados bsicos del circuito

Figura 11 Cmara Web Logitech c170

que estn constantemente perfeccionando y agregando cosas nuevas. Es un recurso de

Costos del proyecto:

1 Microcomputador Raspberry Pi 3 43 752 752

2 Batera Bateras de gel --------- --------- ---------

1 Puente H Etapa potencia, 10.28 175 175

Modelo I/O (entrada/salida) orientado a eventos, asncrono y de no bloqueo, que lo

Figura 12 Infraestructura Node.js

Infraestructura (PHP vs Node.js)

Figura 13 Infraestructura PHP vs NODE.JS

Leer el archivo Leer el archivo

Imprimir contenido Cuando termines, imprimir contenido

Hacer algo ms Hacer algo ms

Tabla 4 Cuadro comparativo blocking vs non blocking

Comparacin entre JS y IO:

Limita objetivos a largo plazo Comunidad muy activa

Soporte completo en servidores y gestores de Rendimiento ligeramente superior

Marca ampliamente conocida y reconocida Soporte para las ltimas versiones de V8

Tabla 5 Comparacin entre Javascript vs IO

Figura 14 PHP vs Node.js

Figura 15 Diferentes conexiones

Figura 16 Funcionamiento websoekt (handshake)

Figura 17 Estructura del proyecto

Inicialmente se cuenta con un servicio de autentificacin:

Figura 18 Pagina inicial login

Figura 19 Mensaje ocupado - alguien inicio sesin

Figura 20 Pgina principa

Figura 21 Win 32 Disk Imager

Enable Boot to Desktop/Scratch: Permite cambiar el tipo de arranque del sistema

Es importante mencionar que se debe habilitar el SSH36, la cmara web y VNC.

Figura 22 Pantalla de configuracin Raspberry

La IP que le ha dado el servidor de DHCP37 ha sido la 192.168.1.38, de modo que se conectara

Figura 23 Logo de node.js

Figura 24 Inicio sesin mediante SSH, Putty

Figura 25 Transferencia de archivos mediante FTP

Figura 26 Logo de VNC (Virtual Network Computing)

Figura 27 Inspeccin de la IP que nuestro servidor de DHCP le asigno a nuestra Raspberry

Figura 28 Agregado de usuario y contrasea

Figura 29 Logo Sublime Text 2

{"name": "J5", "dependencies": {"express": "^4.11.2", "johnny-five":

app.get('/', function (res) {

var board = new five.Board({

var raspi = require('raspi-io');