implementacion de un servidor tcp en un navegador para la recepcion de comandos via red

51
  UNIVERSIDAD TECNOLÓGICA DE DURANGO MECATRÓNICA ÁREA SISTEMAS DE MANUFACTURA FLEXIBLE MEMORIA DE ESTADÍA "IMPLEMENTACIÓN DEL SERVICIO DE CONTROL REMOTO DE UN WEB BROWSER BASADO EN QTWEBKIT" POR: VÍCTOR CASAS IBARRA  ASESOR INTERNO: DR. NI COLÁS CRISTÓBAL UZÁRRAGA R.  ASESOR EXTERNO: DR. JORGE DAVID DE HOZ DIEGO GENERACIÓN 2012-2014 VICTORIA DE DURANGO, DGO., DICIEMBRE 2014

Upload: victor-casas

Post on 02-Mar-2016

15 views

Category:

Documents


0 download

DESCRIPTION

Memoria de estadia para el proyecto de implementacion de un servidor TCP basado en QTwebkit dentro de un navegador.

TRANSCRIPT

Page 1: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 1/50

 

UNIVERSIDAD TECNOLÓGICA DE DURANGO

MECATRÓNICA ÁREA SISTEMAS DE MANUFACTURA FLEXIBLE

MEMORIA

DE

ESTADÍA

“"IMPLEMENTACIÓN DEL SERVICIO DE CONTROL REMOTO DE UN

WEB BROWSER BASADO EN QTWEBKIT"POR:

VÍCTOR CASAS IBARRA

 ASESOR INTERNO: DR. NICOLÁS CRISTÓBAL UZÁRRAGA R.

 ASESOR EXTERNO: DR. JORGE DAVID DE HOZ DIEGO

GENERACIÓN 2012-2014

VICTORIA DE DURANGO, DGO., DICIEMBRE 2014

Page 2: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 2/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 2

Dictamen de Estadía

Page 3: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 3/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 3

Agradecimientos

Primordialmente agradezco a la institución puesto que nos brindó

conocimientos que nos ayudó para el desarrollo de nuestro proyecto y a elaboración

final de este. 

Quiero expresar mi agradecimiento a todas aquellas personas que me han

apoyado a lo largo de mi vida.

También extiendo mi agradecimiento a mis asesores de este proyecto con los

cuales, sin su guía no me hubiese sido posible ver terminado este proyecto. Gracias

por todo su apoyo incondicional y su guía.

 A los profesores que nos brindaron su sabiduría en varios campos del

conocimiento ayudándonos así en varios aspectos que requerimos para el desarrollo

de este proyecto.

También doy gracias a nuestros compañeros de clase que de varias maneras

siempre estuvieron acompañándonos y ayudándonos en los momentos que

requeríamos ayuda , por compartir conocimientos con nosotros, por vivir compartirvivencias con nosotros y darnos sentimientos de alegría, amor, cariño que nos

dejaran muchas enseñanzas y experiencias.

Page 4: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 4/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 4

Dedicatoria

Principalmente deseo dedicar esta memoria de estadía a mi pareja Adriana

Elizabeth ya que sin su amor y su apoyo brindado no me hubiese sido posible reunir

la fortaleza para el desarrollo de este proyecto. A lo largo de este proyecto ella se ha

encontrado a mi lado brindándome las fuerzas necesarias para llevar a cabo este

proyecto.

También deseo incluir a Dios puesto que nos brinda sabiduría, amor ypaciencia, nos ayuda en los momentos más difíciles brindándonos valores que nos

fortalezcan no solo como trabajo de grupo, sino como personas.

Page 5: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 5/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 5

Resumen

Esta memoria se realizó con la finalidad de presentar la investigación para el

proyecto de implementación del servicio de control remoto mediante conexiones

TCP. El proceso del control remoto se encuentra basado en el desarrollo de

aplicaciones web mediante programación orientada a objetos. Por lo tanto esta

memoria presenta la metodología realizada para crear un servicio de recepción de

comandos remotamente vía red. De igual manera también se aborda la problemática

encontrada para la implementación de ambos protocolos ensambladosconjuntamente y como fue el desarrollo en la programación del browser. Por ultimo

sé presenta el análisis final por medio de conclusiones para el estudio y proyecciones

para un mejoramiento a futuro.

Comentario [C1]: Acento

Page 6: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 6/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 6

Abstract

This document was made to present the investigation for the project remote

control protocol for a web browser based in QTwebkit over the network. The process

of the remote control is based in the development of web applications using object-

oriented programming.

Therefore this report aims to present the methodology employed to create a

reception command remotely via the network. Similarly, the problems encountered inthe implementation of both protocols assembled together also addresses as was the

development in programming the browser. Finally presents the last analysis through

the study conclusions and projections for future improvement.

Page 7: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 7/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 7

Tabla de Abreviaturas

RAM Random Access Memory

TCP Transmission Control protocol

STI Servicios de Tecnologías de la

información

WWW World Wide Web

XHTML eXtensible HyperText Markup Language

HTML HyperText Markup Language

POP Post Office Protocol

IMAP Internet Message Access Protocol

HTTP HyperText Transfer Protocol

RFID Radio Frequency IDentification

SMTP Simple Mail Transfer Protocol

 ACK Acknowledgement

SSL Secure Socket Layer

X X Windows System

Comentario [C2]: Mayúscula

Comentario [C3]: Mayúscula

Page 8: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 8/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 8

Contenido

Dictamen de Estadía ................................................................................................................................. 2

Agradecimientos ................................................................................................................................ 3

Dedicatoria ........................................................................................................................................... 4

Resumen ............................................................................................................................................... 5

Abstract ................................................................................................................................................ 6

Tabla de Abreviaturas .......................................................................................................................... 7

Contenido ............................................................................................................................................. 8

Introducción ....................................................................................................................................... 11

Índice de Tablas .................................................................................................................................. 12

Índice de Figuras ................................................................................................................................ 13

Capítulo 1. Generalidades de la Empresa .............................................................................................. 14

1.1 Descripción General de la Empresa.............................................................................................. 14

Nombre de la empresa: .................................................................................................................. 14

Dirección de la empresa: ................................................................................................................ 14

Teléfono: ........................................................................................................................................ 14

Correo electrónico y página web: .................................................................................................. 14

Sector económico en el cual sus actividades: ................................................................................ 14

Servicios o productos que sirve: .................................................................................................... 14

Área de la empresa en que realizó la estadía: ............................................................................... 15

Asesor empresarial ......................................................................................................................... 15

1.2 Antecedentes ............................................................................................................................... 15

1.3 Descripción general del proceso .................................................................................................. 16

1.4 Descripción del área de trabajo ................................................................................................... 16

Comentario [C4]: El contenidocomienza con la introducción

Page 9: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 9/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 9

CAPÍTULO II PLANTEAMIENTO DEL PROBLEMA ..................................................................................... 17

2.1 Descripción del Proyecto .............................................................................................................. 17

2.2 Objetivos del proyecto ................................................................................................................. 17

2.2.1 Objetivo general .................................................................................................................... 17

2.2.2 Objetivos específicos ...................................................................................................... 18

2.3 Justificación .............................................................................................................................. 18

2.4 Alcances .................................................................................................................................... 18

2.4.1 Limites ................................................................................................................................... 19

CAPÍTULO III MARCO TEÓRICO ............................................................................................................... 20

3.1 Que es un sistema Raspberry ................................................................................................... 20

3.2 Que es un web browser?.......................................................................................................... 21

3.3 Funcionamiento de los navegadores ....................................................................................... 22

3.4 Licencia de código libre ............................................................................................................ 23

3.5 Sistema de ventanas X.............................................................................................................. 24

3.6 Que es SSH? .............................................................................................................................. 25

3.7 Protocolo de Control de Transmisión ................................................................................. 26

3.8 Aplicaciones WEB ..................................................................................................................... 27

3.9 Desarrollo en cascada .............................................................................................................. 27

3.10 QT Framework ........................................................................................................................ 29

CAPÍTULO IV DESARROLLO DE PROYECTO ............................................................................................. 31

4.1 Análisis de requisitos .................................................................................................................... 31

4.2 Diseño del sistema ....................................................................................................................... 32

4.2.1 Selección de código fuente ................................................................................................... 32

4.3 Codificación .................................................................................................................................. 33

4.4 Implementación ........................................................................................................................... 34

4.5 Verificación ................................................................................................................................... 36

Page 10: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 10/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 10

Capítulo V ............................................................................................................................................... 37

5.1 Resultados .................................................................................................................................... 37

Conclusiones .......................................................................................................................................... 40

Conclusión 1 ................................................................................................................................... 40

Conclusión 2 ...................................................................................... ¡Error! Marcador no definido. 

Conclucion 3 ...................................................................................... ¡Error! Marcador no definido. 

Conclusiones sobre el proyecto ......................................................................................................... 40

Trabajo futuro ................................................................................................................................ 42

Referencias ............................................................................................................................................. 43

Anexos .................................................................................................................................................... 45

Anexo 1 Código Fuente SIMPLE BROWSER .................................................................................... 45

Anexo 2 Código Fuente Servidor TCP. ............................................................................................ 48

Page 11: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 11/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 11

Introducción

Esta memoria presenta la metodología empleada para obtener el

requerimiento de conectividad inalámbrica con el fin de generar un desarrollo

empresarial capaz de cubrir las demandas más exigentes para la gestión de

publicidad de sus clientes.

 A continuación se describe la estructura de la memoria de estadía:

En el primer capítulo se presenta la descripción general de la compañía, se

describen las actividades generales y procesos que la empresa realiza, así como la

descripción de las actividades específicas realizadas en el área en la cual se realizó

la estadía.

En el segundo capítulo se presenta el planteamiento del problema, se

describen los objetivos tanto generales como específicos. También se presenta la

problemática a solucionar, de donde nace la misma, aborda los problemas derivados

para su conclusión y como se fueron solucionando cada uno así como las razones

necesarias por lo cual este proyecto fue realizado.

En el tercer capítulo se presenta la información detallada de los elementos y

dispositivos electrónicos y de programación utilizada, así como la metodología de

programación utilizada y sus diversos elementos y herramientas.

Dentro del capítulo cuatro se presenta el desarrollo completo de la gestión del

control remoto, donde se describe paso a paso sobre la evolución del desarrollo del

programa incluyendo todos los métodos y pruebas realizadas al proyecto.

En el capítulo cinco se presenta la discusión de los resultados obtenidos.

Por último, se presentan las principales conclusiones del proyecto y

recomendaciones para optimizar los resultados.

Page 12: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 12/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 12

Índice de Tablas

Tabla 1 Comparativa entre navegadores WEB ......................................................... 32

Page 13: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 13/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 13

Índice de Figuras

Figura 1 Vista Superior Del Sistema Raspberry ....................................................................... 21

Figura 2 Distintos Navegadores Del Mercado ........................................................................ 23

Figura 3 Comparativa Entre Los Diversos Tipos De Código Libre (Diazepam, 2012) ................ 24

Figura 4. X Window System En GNOME 2.20. ........................................................................ 25

Figura 5. Conexión Mediante SSH .......................................................................................... 26

Figura 6 Desarrollo En Cascada ............................................................................................. 29

Figura 7 QT Framework Ejemplo De Las Plataformas De Desarrollo....................................... 30

Figura 8 Diagrama De La Planeación Del Proyecto ...... ...... ....... ...... ......... ....... ...... ....... ...... .... 31

Figura 9 Diagrama De Flujo Servidor TCP. .............................................................................. 33

Figura 10 Diagrama De Flujo De La Aplicación Final ............................................................... 35

Figura 11 Esquema De Conexión De Prueba Para El Servidor TCP .......................................... 36

Figura 12 Envio De Comandos Desde Dispositivo Remoto ...................................................... 38

Figura 13 Muestra Del Sistema En Funcionamiento ............................................................... 39

Figura 14 Despliegue De Página Web De Prueba  ................................................................... 39

Page 14: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 14/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 14

Capítulo 1 Generalidades de la Empresa

1 1 Descripción General de la Empresa

Servicios de Tecnologías de Informática de Durango, es una empresa

especializada en el despliegue de carteleria multimedia digital, la cual presenta una

solución eficiente para ofrecer información directa a sus clientes, empleados y

visitantes. Nace como una filial de Ateire España en México y cuenta con más de 5

años de experiencia en instalación de Tótems Digitales.

Nombre de la empresa:

Servicios de Tecnologías de Informática de Durango.

Dirección de la empresa:

Sócrates no. 214, Fraccionamiento Fátima, CP. 34060

Teléfono: 

(618)-4-55-18-34 

Correo electrónico y página web:

http//:www.stidurango.com/, contacto [email protected]

Sector económico en el cual sus actividades: 

Servicios y desarrollo tecnológico en el campo de las TIC’s 

Servicios o productos que sirve: 

Servicios y dispositivos del campo de digital Signage Players tótems audio-

visuales, aplicaciones interactivas e interconexión con fuentes de datos. También se

desarrollan tecnologías al INTERNET de las cosas: redes de sensores y sistemas de

radiofrecuencia RFID.

Page 15: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 15/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 15

Área de la empresa en que realizó la estadía:

 Área Creativa.

Departamento de I+D+I. 

Instalaciones y proyectos

Asesor empresarial

Jorge David de Hoz Diego

Desarrollo e innovación de sistemas

1 2 Antecedentes 

Servicios de TI de Durango nace como una filial de Ateire en México, que

cuenta con más de 4 años de experiencia en el campo de la tecnología audiovisual.

 Ateire Tecnología y Comunicación es una empresa con años de experiencia en el

campo de la comunicación audiovisual mediante dispositivos Digital Signage que

está participando en proyectos de importantes empresas y entidades de España,

México y Perú; proporcionando soluciones integrales que generan beneficios

tangibles. La plantilla de trabajo está compuesta por profesionales calificados con

experiencia en diversos sectores:

El principal objetivo de Servicios de Tecnología Informática de Durango es dar

cobertura a las necesidades y estrategias planteadas por las empresas de hoy en día

utilizando herramientas que involucran el desarrollo de contenidos multimedia y su

producción orientadas a funcionar con tecnologías de vanguardia como dispositivos

en Digital Signage, Sistemas de Información, Kioscos interactivos y Control RFID.

En Servicios de Tecnologías de la Informática de Durango se promueve la

innovación en las áreas de trabajo como base para la competitividad. Desarrollar la

parte esencial de la tecnología que se comercializa permite ofrecer mejor servicio al

cliente y reducir los tiempos de respuesta ante cualquier incidencia. También se

Page 16: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 16/50

Page 17: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 17/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 17

CAPÍTULO II PLANTEAMIENTO DEL PROBLEMA

2 1 Descripción del Proyecto

 Actualmente las herramientas informáticas y de programación son elementos

fundamentales para la superación y desarrollo empresarial. Por eso, empresas

reconocidas mundialmente basan su crecimiento y desarrollo en la aplicación y la

programación estratégica de las herramientas computacionales y han definido

políticas que los inducirán a su permanencia en el dinamismo mundial de lospróximos años.

El objetivo de este proyecto es brindar, de la mano de las herramientas

digitales, un servicio de control para la gestión de contenido web digital utilizando

herramientas electrónicas de vanguardia como lo es Raspberry. Esta plataforma

permite la creación de herramientas (navegadores web) preprogramados de código

abierto con los cuales puede llevarse a cabo la gestión de los contenidos.

En el proyecto se modificó un browser existente diseñado en WebKit para

entornos gráficos desarrollados con librerías gráficas QT. La programación deaplicaciones basadas en las librerías Qt simplifica el desarrollo de aplicaciones

pudiendo fácilmente migrar de plataforma. Webkit.

 Al usar aplicaciones basadas en web se mejora la experiencia de usuario y se

facilita su implementación e interacción con otros sistemas digitales

2 2 Objetivos del proyecto

2 2 1 Objetivo general

Implementar un servicio para control remoto que permita tener acceso desdecualquier lugar físico, hacia el explorador el cual funcionara como player para los

contenidos digitales empleando un dispositivo Raspberry

Page 18: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 18/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 18

2 2 2  Objetivos específicos

  Desensamblar el código fuente mediante la plataforma QT, para conocer

sus instancias y entender su funcionamiento para planificar el desarrollo de

la aplicación a programar.

  Programar el código fuente mediante QT y C++ para incrustar un servicio

de escucha TCP (Protocolo de Control de Transmisión) en la aplicación del

navegador.

  Realizar pruebas de funcionamiento, de conexión y despliegue delcontenido multimedia desde la red de trabajo, para la verificación del

correcto funcionamiento

2 3 Justificación

Debido a la necesidad de brindar un servicio de cartelería digital de mayor

calidad para los clientes se plantea la realización e implementación de un control

remoto de contenidos más inteligente y que responda al instante brindando así un

mayor soporte al cliente que le permita una gestión oportuna para sus necesidadesde información. Facilitando el uso de las herramientas para el usuario final mejorando

su experiencia en el uso de dispositivos inteligentes, basado en la implementación de

aplicaciones web.

2 4 Alcances

Este proyecto se enfoca a la generación y modificación de la plataforma digital

de control para su gestión remota desde cualquier punto de manera inalámbrica por

medio de la red, todo esto aunado a una implementación basada en código fuente

del sistema funcional. El presente proyecto tendrá una duración aproximada de 4

meses durante los cuales se realizara el desarrollo completo del proyecto. El proceso

del proyecto se llevara a cabo dentro de la empresa en la cual se tendrá la

Page 19: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 19/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 19

instalación de un tótem digital donde se presentara el contenido multimedia de

prueba con el cual se verá reflejado el progreso del proyecto. Se prevé que el

proyecto llegue a su conclusión satisfactoria total presentando un modelo funcional

del PLAYER digital.

2 4 1 Limites

Las limitaciones para este proyecto están establecidas por las aplicaciones

multimedia para las que fueron destinados los tótems digitales, además que el

navegador solo se puede utilizar por la plataforma Raspberry Pi. Se prevé que lo

usos de este proyecto sean solo para la finalidad para la cual se construyó.

Page 20: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 20/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 20

CAPÍTULO III MARCO TEÓRICO

3 1 Que es un sistema Raspberry

El Raspberry PI es una minicomputadora del tamaño de una tarjeta de crédito

la cual es capaz de conectarse a un monitor junto con un teclado y funcionar como

una computadora de tamaño normal. La misma es capaz de utilizarse para proyectos

de electrónica con la facilidad de realizar varias tareas simultáneas que una

computadora de escritorio hace normalmente como hojas de cálculo, procesar y

edición de texto, juegos y también reproducir videos en alta definición. Tiene como

objetivo que el usuario se envuelva en el mundo de la programación. (Cellan Jones,

2014).

El Raspberry PI utiliza la tecnología SoC (System on a Chip) de arquitectura

 ARM. El chip BCM2835 posee un núcleo RISC de 32 bits ARMv6. El consumo del

dispositivo es aproximadamente de 3.5 W (Lawler , 2014). En la Figura 1 se muestra

como se encuentra conformada la Raspberry PI con sus principales puertos de

conexión y salidas de audio y video.

Page 21: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 21/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 21

Figura 1 Vista superior del Sistema Raspberry  

3 2 Que es un web browser?

Son los programas que permiten interpretar el contenido de las páginas de la

World Wide Web, la cual se conoce como browser en el idioma inglés. El verbo to

browse  viene de una antigua palabra francesa que significa "brote de una planta", ysu sentido inicial era "mordisquear, ramonear", que es lo que hacen los herbívoros.

De ahí pasó a significar "echar una ojeada" (por ejemplo, a las cosas de una tienda)

u "hojear" las páginas de un libro.

Como la malla mundial está compuesta de "páginas" parecía sensato que un

programa permitiera "hojearlas", que fue lo que pasó en el inglés. En castellano se

usan distintos nombres: por una parte, nunca falta quien utiliza directamente browser

(pronunciado más o menos "brauser"). En ocasiones se usa "hojeador", traducción

directa del inglés; también se utiliza los términos de "visualizador" o "visor", que son

acertados, porque recogen la esencia del programa la cual es permitir ver las

páginas tal y como fueron creadas. Un término menos utilizo es "lector" que por otra

parte también es el dispositivo de acceso al CD-ROM, aunque rara vez hay

Comentario [C6]: Revisar tamañoacuerdo al manual de estadía.

Page 22: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 22/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 22

posibilidad de equivocación porque aparecen en contextos muy distintos. (Millán,

2014). 

Pero los que están extendiéndose más son "navegador" y "explorador", porque

los usan los programas dominantes en el mercado, pero que tienen el problema de

estar ligados a sus nombres comerciales (Navigator y Explorer). Usan dos metáforas

distintas: que la malla mundial es un océano (que por lo tanto se puede surfear o

navegar), y que es un territorio desconocido (que hay que explorar).

3 3 Funcionamiento de los navegadores

La comunicación entre el servidor web y el navegador se realiza mediante el

protocolo HTTP (Lane , 2008), aunque la mayoría de los browsers  soportan otros

protocolos como FTP, Gopher  y HTTPS que es una versión cifrada de HTTP basada

en Secure Socket Layer o Capa de Conexión Segura (SSL). 

La función principal del navegador es descargar documentos HTML y

mostrarlos en pantalla. En la actualidad, no solamente descargan este tipo de

documentos sino que muestran con el documento sus imágenes, sonidos e incluso

vídeos  streaming en diferentes formatos y protocolos. Además, permiten almacenar

la información en el disco o crear marcadores (bookmarks) de las páginas más

visitadas.

 Algunos de los navegadores web más populares se incluyen en lo que se

denomina una Suite. Estas Suite disponen de varios programas integrados para leer

noticias de Usenet y correo electrónico mediante los protocolos NNTP, IMAP y POP. 

Los primeros navegadores web sólo soportaban una versión muy simple de

HTML.  El rápido desarrollo de los navegadores web condujo al desarrollo de

lenguajes no estándares de HTML y a problemas de interoperabilidad en la web. Los

más modernos (como Google Chrome,  Amaya, Mozilla, Netscape, Opera e Internet

Explorer 9.0) (ilustración 2) soportan los estándares HTML y XHTML (comenzando

con HTML 4.01, los cuales deberían visualizarse de la misma manera en todos ellos).

Page 23: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 23/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 23

Los estándares web son un conjunto de recomendaciones dadas por el World

Wide Web consortium W3C (Berners, 2013) y otras organizaciones internacionales

acerca de cómo crear e interpretar documentos basados en la web. Su objetivo es

crear una web que trabaje mejor para todos, con sitios accesibles a más personas y

que funcionen en cualquier dispositivo de acceso a Internet.

Figura 2 Distintos navegadores del mercado

3 4 Licencia de código libre

Una licencia de código libre es una licencia de software que permite que tanto

el código fuente como los archivos binarios sean modificados y redistribuidos

libremente y sin tener que pagar al autor original. Sin embargo, ciertas licencias de

código abierto pueden incorporar algunas restricciones, como el requisito de

mantener el nombre de los autores y la declaración de derechos de autor en el

código, o permitir la modificación del código sólo para usos personales o la

redistribución del software para usos no comerciales. Un grupo popular (y a veces

considerado normativo) de licencias de software de código abierto son aquellas

aprobadas por la Open Source Initiative basándose en su Open Source Definition. 

(Wikipedia la Enciclopedia libre, 2014) En la Figura 3 se muestra una comparativa

entre los diferentes códigos libres.

Page 24: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 24/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 24

Figura 3 Comparativa entre los diversos tipos de código libre (Diazepam, 2012) 

3 5 Sistema de ventanas X

El Sistema de Ventanas X (en inglés,  X Window System) es un software que

fue desarrollado a mediados de los años 1980 en el MIT para dotar de una interfaz

gráfica a los sistemas Unix. Este protocolo permite la interacción gráfica en red entre

un usuario y una o más computadoras haciendo transparente la red para éste.

Generalmente se refiere a la versión 11 de este protocolo, X11, el que está en uso

actualmente. X es el encargado de mostrar la información gráfica de forma

totalmente independiente del sistema operativo. 

El sistema de ventanas X (Figura 4) distribuye el procesamiento de

aplicaciones especificando enlaces cliente-servidor. El servidor provee servicios para

acceder a la pantalla, teclado y ratón, mientras que los clientes son las aplicaciones

que utilizan estos recursos para interacción con el usuario. De este modo mientras el

servidor se ejecuta de manera local, las aplicaciones pueden ejecutarse

remotamente desde otras máquinas, proporcionando así el concepto de

transparencia de red.

Page 25: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 25/50

Page 26: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 26/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 26

Figura 5. Conexión mediante SSH  

3 7 Protocolo de Control de Transmisión 

El Protocolo de Control de Transmisión o TCP, es uno de los protocolos

fundamentales en Internet. Fue creado entre los años 1973 y 1974 por Vint Cerf y

Robert Kahn. (Kanh, 1974)

Muchos programas dentro de una red de datos compuesta por computadoras, 

pueden usar TCP para crear conexiones entre sí a través de las cuales puede

enviarse un flujo de datos. El protocolo garantiza que los datos serán entregados en

su destino sin errores y en el mismo orden en que se transmitieron. También

proporciona un mecanismo para distinguir distintas aplicaciones dentro de una

misma máquina, a través del concepto de puerto. 

El protocolo TCP da soporte a muchas de las aplicaciones más populares de

Internet (navegadores, intercambio de ficheros, clientes FTP, etc.) y protocolos de

aplicación HTTP, SMTP, SSH y FTP. 

Con el uso del protocolo TCP, las aplicaciones pueden comunicarse en forma

segura (gracias al acuse de recibo -ACK- del protocolo TCP) sin preocuparse con el

Page 27: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 27/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 27

monitoreo de datos porque esta función se cumple implícitamente por el protocolo

TCP.

3 8 Aplicaciones WEB

En la ingeniería de software se denomina aplicación web a aquellas

herramientas que los usuarios pueden utilizar accediendo a un servidor web a través

de Internet o de una intranet mediante un navegador.  En otras palabras, es una

aplicación software que se codifica en un lenguaje soportado por los navegadores

web en la que se confía la ejecución al navegador.

Las aplicaciones web son populares debido a lo práctico del navegador web

como cliente ligero, a la independencia del sistema operativo, así como a la facilidad

para actualizar y mantener aplicaciones web sin distribuir e instalar software a miles

de usuarios potenciales. Existen aplicaciones como los webmails,  wikis,  weblogs, 

tiendas en línea y la propia Wikipedia que son ejemplos bien conocidos de

aplicaciones web. (alegsa media commons, 2010)

Es importante mencionar que una página Web puede contener elementos que

permiten una comunicación activa entre el usuario y la información. Esto permite que

el usuario acceda a los datos de modo interactivo, gracias a que la páginaresponderá a cada una de sus acciones, como por ejemplo rellenar y enviar

formularios, participar en juegos diversos y acceder a gestores de base de datos de

todo tipo. (Lujan Mora, 2002)

3 9 Desarrollo en cascada

En ingeniería de software el desarrollo en cascada, también llamado modelo

en cascada (denominado así por la posición de las fases en el desarrollo de esta,

que parecen caer en cascada “por gravedad”  hacia las siguientes fases), es el

enfoque metodológico que ordena rigurosamente las etapas del proceso para el

desarrollo de software, de tal forma que el inicio de cada etapa debe esperar a la

finalización de la etapa anterior (Pressman, 1989). Al final de cada etapa, el modelo

Page 28: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 28/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 28

está diseñado para llevar a cabo una revisión final, que se encarga de determinar si

el proyecto está listo para avanzar a la siguiente fase. Este modelo fue el primero en

originarse y es la base de todos los demás modelos de ciclo de vida.

La versión original fue propuesta por Winston W. Royce en 1970 y

posteriormente revisada por Barry Boehm en 1980 e Ian Sommerville en 1985.

(Cataldi, 1999)

Un ejemplo de una metodología de desarrollo en cascada es:

1. Análisis de requisitos.2. Diseño del sistema.

3. Diseño del programa.

4. Codificación.

5. Pruebas.

6. Verificación.

7. Mantenimiento.

De esta forma, cualquier error de diseño detectado en la etapa de prueba

conduce necesariamente al rediseño y nueva programación del código afectado,

aumentando los costos del desarrollo. La palabra cascada sugiere, mediante la

metáfora de la fuerza de la gravedad, el esfuerzo necesario para introducir un cambio

en las fases más avanzadas de un proyecto. En la Figura 6 se muestra un esquema

del desarrollo en cascada.

Page 29: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 29/50

Page 30: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 30/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 30

Qt es utilizada en KDE, entorno de escritorio para sistemas como GNU/Linux o

FreeBSD, entre otros. Qt utiliza el lenguaje de programación C++ de forma nativa,

adicionalmente puede ser utilizado en varios otros lenguajes de programación a

través de bindings.  También es usada en sistemas informáticos empotrados para

automoción, aeronavegación y aparatos domésticos como frigoríficos.

Funciona en todas las principales plataformas, y tiene un amplio apoyo. El API

de la biblioteca cuenta con métodos para acceder a bases de datos mediante SQL, 

así como uso de XML,  gestión de hilos,  soporte de red, una API multiplataforma

unificada para la manipulación de archivos y una multitud de otros para el manejo deficheros, además de estructuras de datos tradicionales.

Qt es utilizada principalmente en Autodesk Maya, The Foundry's Nuke, Adobe

Photoshop Album,  Google Earth,  Skype,  VLC media player,  VirtualBox,  Dassault

DraftSight,  y Mathematica,  y por la  Agencia Espacial Europea,  DreamWorks,  HP, 

KDE,  Lucasfilm,  Panasonic,  Philips,  Samsung,  Siemens,  Volvo,  Walt Disney

 Animation Studios y Research In Motion en la (ilustración 7) se puede apreciar las

principales plataformas en las cuales se desarrollan aplicaciones basadas en QT.

Figura 7 QT Framework ejemplo de las plataformas de desarrollo

Page 31: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 31/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 31

CAPÍTULO IV DESARROLLO DE PROYECTO

Con el desarrollo del software final (web browser) se busca preestablecer un

desarrollo que busque cumplir el proyecto con el menor equipo de personal posible.

Por ello se propone generar un desarrollo en cascada de manera que se divida el

trabajo en elementos fáciles de terminar y al final buscar unir los elementos para la

concluir satisfactoriamente el proyecto en la figura 8 se muestran las distintas etapas

del proyecto y como las mismas serán divididas en tareas con objetivos a cumplir.

Figura 8 Diagrama de la planeación del proyecto 

4 1 Análisis de requisitos

El proyecto requirió que el uso de la aplicación final (web browser) funcione en

el Raspberry PI. También se solicitó que el sistema fuese accesible remotamente con

lo cual fue necesario implementar al navegador un servicio TCP, que sea capaz de

interpretar comandos y subsecuentemente realice el despliegue de páginas de

Internet. 

Page 32: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 32/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 32

La realización del proyecto requirió que fuesen desensamblados 2

aplicaciones o navegadores de código libre para modificar la estructura e

implementar un servicio de recepción de comandos y el navegador web  en una sola

aplicación. Para esto se seleccionaron entre dos códigos de estructura básica

buscando características como la rapidez y la compatibilidad con las aplicaciones

WEB y HTML5 y que fuesen capaces de ejecutarse en la plataforma Raspberry.

4 2 Diseño del sistema

 Al comenzar el diseño del sistema se desensamblo el código fuente de la

aplicación browser para analizar los elementos que se pudiesen ir elaborando por

separado así como también se verifico la compatibilidad de ambos códigos utilizados.

El programa contendrá dos clases principales que son el navegador y el servidor

TCP. Se desarrolló del programa final se llevó a cabo de manera de que ambas

clases sean capaces de interactuar entre ellas para que al recibir una cadena de

caracteres sea interpretada como una dirección web, la cual produce un evento de

conexión remota para la lectura de comandos. 

4 2 1 Selección de código fuente

Mediante la selección del código fuente se determinó cual fue el código fuente

a utilizar. Se requería que fuese compatible con la plataforma Raspberry y con

Raspbian. El código debe ser libre para su modificación sin incurrir en alguna falta a

los derechos de autor. A continuación se muestra una tabla con las necesidades

para el sistema.

Tabla 1 Comparativa entre navegadores WEB

MlBrowser Simple Browser

Compatibilidad Raspberry Compatible Compatible

HTML Compatible Compatible Aplicaciones WEB Funcionales Posibles

Servicio TCP No No

Menú Contextual No Si

Page 33: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 33/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 33

Poco Código Si Si

Compatible QT Si

Es necesario reescribir

parte del código

Dado que el MLbrowser es completamente compatible con las aplicaciones

web y con el QT Framework se seleccionó para ser desensamblado y se implementó

el servicio de servidor TCP para la recepción de comandos. El otro código no se

modificara para tener otra opción de web browser.

4 3 Codificación

El código fuente se trabajó en la plataforma Qt Framework, la cual una vez

instalada se procedió a crear la primera instancia del programa del servidor TCP el

cual es mostrado en la figura 9 con un diagrama del flujo con la función del

programa.

Figura 9 Diagrama de flujo Servidor TCP. 

Para esto se creó una QTaplication dentro del QTframework que se encargue

del servicio de recibir conexiones a través del socket de conexión esperando

Page 34: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 34/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 34

cadenas de texto, la esencia del sistema es básica simplemente escuchar una

cadena e interpretarla como cadena Qstring.

Para evitar tener que programar un cliente con un socket lo que se ha usado

son dos herramientas, telnet y NETCAT a través de la red con lo cual se creó un

servicio básico que reciba comandos los cuales serán cadenas ASCII para que sean

interpretadas por el navegador web.

4 4 Implementación

La realización de la aplicación final fue necesario crear instancias dentro del

código que llamen a las clases creadas, las cuales interactúan, para ello se creó los

SLOTS con sus respectivas SIGNALS en la parte inferior se muestra la (figura 10) la

cual es un diagrama de flujo con los aspectos fundamentales para la realización del

código.

 Al realizar la programación del sistema, el inicia como lo hacía anteriormente

esperando que sea introducida una cadena de caracteres de manera manual, pero

ya con las nuevas instancias creadas inicio paralelamente (figura 10) el sistema de

conexión TCP. el cual fue visible desde la consola del usuario, de esta manera no se

inició desde el mismo equipo de la aplicación ya que fue activada remotamente

gracias a las conexiones SSH del sistema Raspberry y del servidor TCP.

Page 35: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 35/50

Page 36: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 36/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 36

4 5 Verificación

La verificación y el correcto funcionamiento del sistema se realizó mediante la

conexión y la puesta en marcha del sistema completo. Primero se elaboraron la

compilación de ambos códigos dentro de la plataforma de trabajo QT Framework y

posteriormente se transferido a la plataforma Raspberry. Para la inicializar del web

Browser para crear una conexión SSH la cual es provista por PUTTY para acceder a

la plataforma Raspberry. Para la realización de verificación de funcionamiento se

necesitó enviarle cadenas de caracteres al servidor TCP. En la (Figura 11) se

muestra como se realiza la conexión entre Servidor TCP. la red de trabajo estárepresentada por el GATEWAY y el cliente es la computadora del cual se hizo el

requerimiento todo esto desde la aplicación PUTTY y NETCAT.

Figura 11 Esquema de conexión de prueba para el servidor TCP.

Page 37: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 37/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 37

Capítulo V

5 1 Resultados 

 Al desensamblar el código fuente sé pudo determinar cuáles eran las

instancias que realizan funciones a la hora de ejecutar el programa, estas instancias

son reconocidas por el programa como CLASES las cuales van directamente ligadas

dentro de la estructura del código por medio de SIGNALS y SLOTS. Los SIGNALS

son señales que son emitidas durante la ejecución del código y estas actúan como

una alarma o una llamada la cual es recibida por el SLOT este a su vez se comporta

como un recipiente dentro del código a la espera de una señal que lo active

nuevamente. Para que estas características puedan actuar en conjunto es necesario

ligarlas entre sí por medio de programación de esta manera ningún SIGNAL ira a

ningún SLOT que no le corresponda.

Para lograr el cometido de que el navegador web reciba comandos

provenientes de la red, fue necesario primero crear una instancia que actuara de

servidor TCP. Para lo cual fue necesario programar una pequeña aplicación en línea

de comandos la cual dirija las instrucciones hacia el servidor TCP., Al crear esainstancia fue necesario ensamblar ambos código en una sola aplicación. Para esto

fue necesario trasplantar el programa básico del servidor TCP. y por medio de

programación orientada a objetos fue necesario crear dos clases totalmente iguales

dentro del código principal del navegador para que estuviesen enlazados desde el

principio de la creación del código. El resultado fue satisfactorio permitiendo un

control remoto desde cualquier dispositivo (Figura 12) que fuese compatible con

PUTTY o NETCAT enviando una cadena de caracteres la cual era interpretada como

una dirección web y desplegada el contenido multimedia, de esta manera pudo

confirmarse que las aplicaciones se habían logrado fusionar entre sí.

Page 38: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 38/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 38

Figura 12 Envio de comandos desde dispositivo Remoto 

El resultado de las pruebas realizadas fue todo un éxito ya que el programa

respondía con gran fluidez y era capaz de interpretar la mayoría de sitios web (figura

13) los cuales se le enviaban como comandos y desplegar las páginas sin errores

(Figura 14). No fue necesaria una exhaustiva realización de pruebas ya que elprograma actuaba conforme a lo esperado.

Page 39: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 39/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 39

Figura 13 muestra del sistema en funcionamiento

Figura 14 Despliegue de página web de prueba

Page 40: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 40/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 40

Conclusiones

Conclusión

 Al desensamblar el código del navegador se pudo conocer y entender la

manera en que el programa se comunica internamente permitiendo entender las

instancias y clases con las cuales se componen. Con esto facilitando bastante el

trabajo de codificación de los nuevos servicios implementados.

Fue necesario crear una aplicación pequeña por lo cual fue necesarioprogramarla en la plataforma QT. Al realizar las modificaciones de los códigos se

pudo ir verificando poco a poco como se entrelazan las clases dentro de una

aplicación. Al entender las necesidades de recepción de comandos fue preciso crear

las instancias que se encargaran de “escuchar” los comandos. Con esto f ue

necesario escribir desde cero una aplicación que hiciera de servidor TCP. La cual se

encargara de hacer echo recibiendo cadenas de caracteres e imprimiéndolas en

pantalla.

Durante las pruebas de conexión hubo ciertos obstáculos que impedían las

conexiones dentro de la red las cuales se debían a configuraciones erronas en las

FIREWALL, una vez solucionado esto se realizaron satisfactoriamente el despliegue

de los contenidos digitales. Gracias a la velocidad de las conexiones fueron

satisfactorios los resultados de las pruebas, creando un sistema eficiente.

Conclusiones sobre el proyecto

 Al haber logrado crear una instancia capaz de recibir comandos einterpretarlos, esto presenta una herramienta con gran potencial ya que el código

puede ser implementado de diversas maneras con lo cual se puede encontrar

aplicación en diversos aspectos que requieran envió de comandos para el control

Page 41: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 41/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 41

remoto a aplicaciones ya existentes, todo esto desde diversas plataformas como

teléfonos celulares ampliando las posibilidades de su uso.

Este desarrollo fue creado en base a las necesidades de la empresa Servicios

de Tecnologías e Información de Durango con lo cual este proyecto sienta un

precedente para el estudiante para la escuela y para la empresa. Al ser un proyecto

de código libre se destina a que pueda mejorarse o implantarse mejoras por otros

usuarios interesados en el control remoto de contenidos multimedia.

Page 42: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 42/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 42

Trabajo futuro

En base a los resultados obtenidos del proyecto actual la empresa propone un

proyecto paralelo al uso de la aplicación generada basado en el uso de PLUGINS

incorporados a la aplicación final del Browser generado con lo cual sería posible

extraer la información multimedia remotamente esto sería de gran utilidad debido a

que se generaría una interfaz multimedia mucho más eficiente e inteligente al

desplegar los contenidos. Con esto se podría generar otra estadía dentro de la

empresa cubriendo los intereses mutuos para el estudiante, la universidad y el

corporativo.

Page 43: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 43/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 43

Referencias

Alegsa media commons. (10 de agosto de 2010). http://www.alegsa.com.ar. Recuperado el

28 de Noviembre de 2014, de http://www.alegsa.com.ar/Dic/aplicacion%20web.php

Berners, L. T. (15 de julio de 2013). http://www.w3c.es/Consorcio/ . Recuperado el 16 de

Noviembre de 2014, de http://www.w3c.es/

Cataldi, Z. L. (12 de julio de 1999). Ingenieria De Software Educativo. Recuperado el 18 de

Noviembre de 2014, de http://www.iidia.com.ar:

http://www.iidia.com.ar/rgm/comunicaciones/c-icie99-

ingenieriasoftwareeducativo.pdf

Cellan Jones, R. (5 de 12 de 2014). http://www.bbc.co.uk . Obtenido de

http://www.bbc.co.uk/blogs/legacy/thereporters/rorycellanjones/2011/05/a_15_co

mputer_to_inspire_young.html

Diazepam. (08 de diciembre de 2012). http://blog.desdelinux.net/sobre-las-licencias-y-los-

 perjuicios-al-codigo-abierto/ . Recuperado el 16 de noviembre de 2014, dehttp://blog.desdelinux.net/sobre-las-licencias-y-los-perjuicios-al-codigo-abierto/

Kanh, R. (1974). A Protocol for Packet Network Intercommunication. En R. Kanh, IEEE

Transactions on Communications (págs. pp. 637-648.).

Lane , J. (08 de Junio de 2008). http://mosaic.uoc.edu. Recuperado el 15 de noviembre de

2014, de http://mosaic.uoc.edu/ac/le/es/m1/ud2/index.html

Lawler , R. (5 de 12 de 2014). http://www.engadget.com. Obtenido de

http://www.engadget.com/2012/02/29/raspberry-pi-credit-card-sized-linux-pcs-are-

on-sale-now-25-mo/

Lujan Mora, S. (2002). Programación de aplicaciones web: historia, principios básicos y

clientes web. En S. Lujan Mora, Programación de aplicaciones web. 

Page 44: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 44/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 44

Millán, J. A. (5 de 12 de 2014). http://jamillan.com. Obtenido de

http://jamillan.com/v_brows.htm

Pressman, R. (1989). Ingeniería del Software. En R. Pressman, Ingeniería del Software: Un

enfoque práctico (págs. 26-30). McGraw-Hill.

qt-project.org. (18 de julio de 2014). http://qt-project.org. Recuperado el 31 de octubre de

2014, de http://qt-project.org/wiki/Category:Tools::QtCreator

Wikipedia la Enciclopedia libre. (5 de febrero de 2014). www.wikipedia.org. Recuperado el 28

de octubre de 2014, de

http://es.wikipedia.org/wiki/Licencia_de_c%C3%B3digo_abierto

Page 45: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 45/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 45

Anexos

Anexo 1 Código Fuente SIMPLE BROWSER

Broeser CPP

1  

2

3

4

5

6

7

8

9

10 

11 

12 

13 

14 

15 

16 

17 

18 

19 

20 

21 

22 

#include "browser.h" 

Browser::Browser(QWidget *parent) :

QWidget(parent)

{

this->setWindowTitle("Simple Browser");

QVBoxLayout *v_box = new QVBoxLayout();

QHBoxLayout *h_box = new QHBoxLayout();

QPushButton *previous = new QPushButton(this->style()->standardIcon(QStyle::SP_ArrowLeft), "");

QPushButton *next = new QPushButton(this->style()->standardIcon(QStyle::SP_ArrowRight),"");

QPushButton *reload = new QPushButton(this->style()-

>standardIcon(QStyle::SP_BrowserReload), "");

QPushButton *stop = new QPushButton(this->style()->standardIcon(QStyle::SP_BrowserStop),"");

this->url = new QLineEdit;

QPushButton *okUrl = new QPushButton(this->style()->standardIcon(QStyle::SP_DialogOkButton), "");

okUrl->setFlat(true);

h_box->addWidget(previous);

h_box->addWidget(next);

h_box->addWidget(reload);

h_box->addWidget(stop);

h_box->addWidget(url);

Page 46: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 46/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 46

23 

24 

25 

26 

27 

28 

29 

30 

31 

32 

33 

34 

35 

36 

37 

38 

39 

40 

41 

42 

43 

44 

45 

46 

47 

48 

h_box->addWidget(okUrl);

this->web = new QWebView(this);

this->web->load(QUrl("http://google.com"));

this->status = new QStatusBar;

this->progressBar = new QProgressBar;

QLabel *lbl = new QLabel("Loading...");

this->status->addWidget(lbl);

this->status->addWidget(this->progressBar);

v_box->addLayout(h_box);

v_box->addWidget(this->web);

v_box->addWidget(this->status);

this->setLayout(v_box);

QShortcut *shortcut = new QShortcut(QKeySequence(Qt::ALT + Qt::Key_D), this->url);

this->connect(previous, SIGNAL(clicked()), this->web, SLOT(back()));

this->connect(next, SIGNAL(clicked()), this->web, SLOT(forward()));

this->connect(reload, SIGNAL(clicked()), this->web, SLOT(reload()));

this->connect(stop, SIGNAL(clicked()), this->web, SLOT(stop()));

this->connect(this->url, SIGNAL(returnPressed()), this, SLOT(doSearch()));

this->connect(okUrl, SIGNAL(clicked()), this, SLOT(doSearch()));

this->connect(this->web, SIGNAL(loadProgress(int)), this, SLOT(progress(int)));

this->connect(this->web, SIGNAL(loadFinished(bool)), this, SLOT(loadComplete(bool)));

this->connect(this->web, SIGNAL(loadStarted()), this->status, SLOT(show()));

this->connect(shortcut, SIGNAL(activated()), this->url, SLOT(setFocus()));

}

void Browser::openUrl(QString text)

Page 47: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 47/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 47

49 

50 

51 

52 

53 

54 

55 

56 

57 

58 

59 

60 

61 

62 

63 

64 

65 

66 

67 

68 

69 

70 

71 

72 

73 

{

this->web->setFocus();

this->web->load(QUrl(text));

}

void Browser::progress(int val)

{

this->progressBar->setValue(val);

}

void Browser::doSearch()

{

QString link = this->url->text();

QRegExp reg("(.+)\\.(.+)");

QRegExp regHttp("^http://");

if(reg.exactMatch(link) && !regHttp.exactMatch(link)){

link = "http://" + this->url->text();

}else if(!reg.exactMatch(link)){

link = "http://google.com/search?q=" + link.replace(" ", "+");

}

this->openUrl(link);

}

void Browser::loadComplete(bool val)

{

this->url->setText(this->web->url().toString());

this->status->hide();

}

Page 48: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 48/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 48

Browser pro

1  

2

3

4

 

QT += webkit network  

SOURCES += main.cpp \

browser.cpp

HEADERS += browser.h

Main cpp

1  

2

3

4

5

6

7

8

9

10 

11 

12 

#include <QtGui> 

#include "browser.h"

int main(int argc, char *argv[])

{

QApplication app(argc, argv);

Browser browser;

browser.show();

app.exec();

}

Anexo 2 Código Fuente Servidor TCP

Myserver cpp

#include "myserver.h" 

Page 49: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 49/50

MECATRONICA UTD MEMORIA ESTADIA 

Víctor Casas Ibarra 49

myserver::myserver(QObject *parent) :QObject(parent)

{server = new QTcpServer(this);connect (server,SIGNAL(newConnection()),this,SLOT(newConnection()));

if (!server->listen(QHostAddress::Any,9999)){

qDebug() << "El servidor no es capaz de iniciar";

}

else {

qDebug() << "El servidor esta online";}

}

void myserver::newConnection(){

char buffer[500]="";QTcpSocket *socket = server->nextPendingConnection();socket->write("hola que pagina deseas ir\r\n");socket->flush();socket->waitForBytesWritten(3000);socket->waitForReadyRead();socket->read(buffer, 500);qDebug() << buffer;socket->flush();//socket-> QString msg = tcpsocket->readAll(); socket->write("el sistema esta desplegando la pagina solicitada\r\n");

socket->flush();socket->write("deseas ir a otra pagina??\r\n");socket->waitForBytesWritten(3000);

}

Main cpp

#include <QCoreApplication> #include "myserver.h" 

int main(int argc, char *argv[]){

QCoreApplication a(argc, argv);myserver mServer;

return a.exec();}

Page 50: Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

7/18/2019 Implementacion de Un Servidor TCP en Un Navegador Para la recepcion de comandos via red

http://slidepdf.com/reader/full/implementacion-de-un-servidor-tcp-en-un-navegador-para-la-recepcion-de-comandos 50/50