UNIVERSIDAD TECNOLGICA DE DURANGO

MECATRNICA REA SISTEMAS DE MANUFACTURA FLEXIBLE

MEMORIA
DE
ESTADA

"IMPLEMENTACIN DEL SERVICIO DE CONTROL REMOTO DE UN

WEB BROWSER BASADO EN QTWEBKIT"
POR:

VCTOR CASAS IBARRA

ASESOR INTERNO: DR. NICOLS CRISTBAL UZRRAGA R.

ASESOR EXTERNO: DR. JORGE DAVID DE HOZ DIEGO

GENERACIN 2012-2014

VICTORIA DE DURANGO, DGO., DICIEMBRE 2014

MECATRONICA

UTD

MEMORIA ESTADIA

Dictamen de Estada

Vctor Casas Ibarra

MECATRONICA

UTD

MEMORIA ESTADIA

Agradecimientos
Primordialmente

agradezco

la

institucin

puesto

que

nos

brind

conocimientos que nos ayud para el desarrollo de nuestro proyecto y a elaboracin

final de este.
Quiero expresar mi agradecimiento a todas aquellas personas que me han
apoyado a lo largo de mi vida.
Tambin extiendo mi agradecimiento a mis asesores de este proyecto con los
cuales, sin su gua no me hubiese sido posible ver terminado este proyecto. Gracias
por todo su apoyo incondicional y su gua.
A los profesores que nos brindaron su sabidura en varios campos del
conocimiento ayudndonos as en varios aspectos que requerimos para el desarrollo
de

este

proyecto.

Tambin doy gracias a nuestros compaeros de clase que de varias maneras

siempre estuvieron acompandonos y ayudndonos en los momentos que
requeramos ayuda , por compartir conocimientos con nosotros, por vivir compartir
vivencias con nosotros y darnos sentimientos de alegra, amor, cario que nos
dejaran muchas enseanzas y experiencias.

Vctor Casas Ibarra

MECATRONICA

UTD

MEMORIA ESTADIA

Dedicatoria
Principalmente deseo dedicar esta memoria de estada 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 brindndome las fuerzas necesarias para llevar a cabo este
proyecto.

Tambin deseo incluir a Dios puesto que nos brinda sabidura, amor y
paciencia, nos ayuda en los momentos ms difciles brindndonos valores que nos
fortalezcan

no

Vctor Casas Ibarra

solo

como

trabajo

de

grupo,

sino

como

personas.

MECATRONICA

UTD

MEMORIA ESTADIA

Resumen
Esta memoria se realiz con la finalidad de presentar la investigacin para el
proyecto de implementacin del servicio de control remoto mediante conexiones
TCP. El proceso del control remoto se encuentra basado en el desarrollo de
aplicaciones web mediante programacin orientada a objetos. Por lo tanto esta
memoria presenta la metodologa realizada para crear un servicio de recepcin de
comandos remotamente va red. De igual manera tambin se aborda la problemtica
encontrada

para

la

implementacin

de

ambos

protocolos

ensamblados

conjuntamente y como fue el desarrollo en la programacin del browser. Por ultimo

s presenta el anlisis final por medio de conclusiones para el estudio y proyecciones
para un mejoramiento a futuro.

Vctor Casas Ibarra

Comentario [C1]: Acento

MECATRONICA

UTD

MEMORIA ESTADIA

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 objectoriented programming.
Therefore this report aims to present the methodology employed to create a
reception command remotely via the network. Similarly, the problems encountered in
the 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.

Vctor Casas Ibarra

MECATRONICA

UTD

MEMORIA ESTADIA

Tabla de Abreviaturas

RAM

Random Access Memory

TCP

Transmission Control protocol

STI

Servicios de Tecnologas de la

Comentario [C2]: Mayscula

Comentario [C3]: Mayscula

informacin

Vctor Casas Ibarra

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 Windows System

MECATRONICA

UTD

MEMORIA ESTADIA

Comentario [C4]: El contenido

comienza con la introduccin

Contenido

Dictamen de Estada ................................................................................................................................. 2

Agradecimientos ................................................................................................................................ 3
Dedicatoria ........................................................................................................................................... 4
Resumen ............................................................................................................................................... 5
Abstract ................................................................................................................................................ 6
Tabla de Abreviaturas .......................................................................................................................... 7
Contenido ............................................................................................................................................. 8
Introduccin ....................................................................................................................................... 11
ndice de Tablas .................................................................................................................................. 12
ndice de Figuras ................................................................................................................................ 13
Captulo 1. Generalidades de la Empresa .............................................................................................. 14
1.1 Descripcin General de la Empresa.............................................................................................. 14
Nombre de la empresa: .................................................................................................................. 14
Direccin de la empresa: ................................................................................................................ 14
Telfono: ........................................................................................................................................ 14
Correo electrnico y pgina web: .................................................................................................. 14
Sector econmico en el cual sus actividades: ................................................................................ 14
Servicios o productos que sirve: .................................................................................................... 14
rea de la empresa en que realiz la estada: ............................................................................... 15
Asesor empresarial ......................................................................................................................... 15
1.2 Antecedentes ............................................................................................................................... 15
1.3 Descripcin general del proceso .................................................................................................. 16
1.4 Descripcin del rea de trabajo ................................................................................................... 16

Vctor Casas Ibarra

MECATRONICA

UTD

MEMORIA ESTADIA

CAPTULO II PLANTEAMIENTO DEL PROBLEMA ..................................................................................... 17

2.1 Descripcin del Proyecto.............................................................................................................. 17
2.2 Objetivos del proyecto ................................................................................................................. 17
2.2.1 Objetivo general .................................................................................................................... 17
2.2.2

Objetivos especficos ...................................................................................................... 18

2.3 Justificacin .............................................................................................................................. 18

2.4 Alcances .................................................................................................................................... 18
2.4.1 Limites ................................................................................................................................... 19
CAPTULO III MARCO TERICO............................................................................................................... 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 cdigo libre ............................................................................................................ 23
3.5 Sistema de ventanas X.............................................................................................................. 24
3.6 Que es SSH? .............................................................................................................................. 25
3.7 Protocolo de Control de Transmisin ................................................................................. 26
3.8 Aplicaciones WEB ..................................................................................................................... 27
3.9 Desarrollo en cascada .............................................................................................................. 27
3.10 QT Framework ........................................................................................................................ 29
CAPTULO IV DESARROLLO DE PROYECTO ............................................................................................. 31
4.1 Anlisis de requisitos .................................................................................................................... 31
4.2 Diseo del sistema ....................................................................................................................... 32
4.2.1 Seleccin de cdigo fuente ................................................................................................... 32
4.3 Codificacin .................................................................................................................................. 33
4.4 Implementacin ........................................................................................................................... 34
4.5 Verificacin ................................................................................................................................... 36

Vctor Casas Ibarra

MECATRONICA

UTD

MEMORIA ESTADIA

Captulo V ............................................................................................................................................... 37
5.1 Resultados .................................................................................................................................... 37
Conclusiones .......................................................................................................................................... 40
Conclusin 1 ................................................................................................................................... 40
Conclusin 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 Cdigo Fuente SIMPLE BROWSER .................................................................................... 45
Anexo 2 Cdigo Fuente Servidor TCP. ............................................................................................ 48

Vctor Casas Ibarra

10

MECATRONICA

UTD

MEMORIA ESTADIA

Introduccin
Esta

memoria

presenta

la

metodologa

empleada

para

obtener

el

requerimiento de conectividad inalmbrica con el fin de generar un desarrollo

empresarial capaz de cubrir las demandas ms exigentes para la gestin de
publicidad de sus clientes.
A continuacin se describe la estructura de la memoria de estada:
En el primer captulo se presenta la descripcin general de la compaa, se
describen las actividades generales y procesos que la empresa realiza, as como la
descripcin de las actividades especficas realizadas en el rea en la cual se realiz
la estada.
En el segundo captulo se presenta el planteamiento del problema, se
describen los objetivos tanto generales como especficos. Tambin se presenta la
problemtica a solucionar, de donde nace la misma, aborda los problemas derivados
para su conclusin y como se fueron solucionando cada uno as como las razones
necesarias por lo cual este proyecto fue realizado.
En el tercer captulo se presenta la informacin detallada de los elementos y
dispositivos electrnicos y de programacin utilizada, as como la metodologa de
programacin utilizada y sus diversos elementos y herramientas.
Dentro del captulo cuatro se presenta el desarrollo completo de la gestin del
control remoto, donde se describe paso a paso sobre la evolucin del desarrollo del
programa incluyendo todos los mtodos y pruebas realizadas al proyecto.
En el captulo cinco se presenta la discusin de los resultados obtenidos.
Por ltimo, se presentan las principales conclusiones del proyecto y
recomendaciones para optimizar los resultados.

Vctor Casas Ibarra

11

MECATRONICA

UTD

MEMORIA ESTADIA

ndice de Tablas
Tabla 1 Comparativa entre navegadores WEB ......................................................... 32

Vctor Casas Ibarra

12

MECATRONICA

UTD

MEMORIA ESTADIA

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 Cdigo Libre (Diazepam, 2012) ................ 24
Figura 4. X Window System En GNOME 2.20. ........................................................................ 25
Figura 5. Conexin 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 Planeacin Del Proyecto ................................................................ 31
Figura 9 Diagrama De Flujo Servidor TCP. .............................................................................. 33
Figura 10 Diagrama De Flujo De La Aplicacin Final ............................................................... 35
Figura 11 Esquema De Conexin 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 Pgina Web De Prueba ................................................................... 39

Vctor Casas Ibarra

13

MECATRONICA

UTD

MEMORIA ESTADIA

Captulo 1. Generalidades de la Empresa

1.1 Descripcin General de la Empresa
Servicios de Tecnologas de Informtica de Durango, es una empresa
especializada en el despliegue de carteleria multimedia digital, la cual presenta una
solucin eficiente para ofrecer informacin directa a sus clientes, empleados y
visitantes. Nace como una filial de Ateire Espaa en Mxico y cuenta con ms de 5
aos de experiencia en instalacin de Ttems Digitales.

Nombre de la empresa:
Servicios de Tecnologas de Informtica de Durango.

Direccin de la empresa:
Scrates no. 214, Fraccionamiento Ftima, CP. 34060

Telfono:
(618)-4-55-18-34

Correo electrnico y pgina web:

http//:www.stidurango.com/, contacto david@stidurango.com

Sector econmico en el cual sus actividades:

Servicios y desarrollo tecnolgico en el campo de las TICs

Servicios o productos que sirve:

Servicios y dispositivos del campo de digital Signage Players ttems audiovisuales, aplicaciones interactivas e interconexin con fuentes de datos. Tambin se
desarrollan tecnologas al INTERNET de las cosas: redes de sensores y sistemas de
radiofrecuencia RFID.

Vctor Casas Ibarra

14

MECATRONICA

UTD

MEMORIA ESTADIA

rea de la empresa en que realiz la estada:

rea Creativa.
Departamento de I+D+I.
Instalaciones y proyectos

Asesor empresarial
Jorge David de Hoz Diego
Desarrollo e innovacin de sistemas

1.2 Antecedentes
Servicios de TI de Durango nace como una filial de Ateire en Mxico, que
cuenta con ms de 4 aos de experiencia en el campo de la tecnologa audiovisual.
Ateire Tecnologa y Comunicacin es una empresa con aos de experiencia en el
campo de la comunicacin audiovisual mediante dispositivos Digital Signage que
est participando en proyectos de importantes empresas y entidades de Espaa,
Mxico 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 Tecnologa Informtica de Durango es dar

cobertura a las necesidades y estrategias planteadas por las empresas de hoy en da
utilizando herramientas que involucran el desarrollo de contenidos multimedia y su
produccin orientadas a funcionar con tecnologas de vanguardia como dispositivos
en Digital Signage, Sistemas de Informacin, Kioscos interactivos y Control RFID.

En Servicios de Tecnologas de la Informtica de Durango se promueve la

innovacin en las reas de trabajo como base para la competitividad. Desarrollar la
parte esencial de la tecnologa que se comercializa permite ofrecer mejor servicio al
cliente y reducir los tiempos de respuesta ante cualquier incidencia. Tambin se

Vctor Casas Ibarra

15

MECATRONICA

UTD

MEMORIA ESTADIA

ofrece capacitacin para desarrollar soluciones a medida en base a las necesidades

concretas de cada caso.

1.3 Descripcin general del proceso

Servicios de Tecnologas Informticas de Durango ofrece un servicio integral
para la instalacin de cartelera digital dinmica que sirve, prcticamente, para crear
un canal propio para un establecimiento que quiera ofrecer informacin directa o
general a sus clientes, empleados o visitantes y mantenerlos actualizados de sus
ltimas novedades o noticias.
Tambin desarrolla herramientas para implementarlas en un circuito de
cartelera digital haciendo que las pantallas se conviertan en puntos interactivos de
informacin y publicidad, lo que permite realizar trabajo de control de trnsito de
vehculos y personas, estudios de mercado, puntos de difusin de promociones y
eventos.

1.4 Descripcin del rea de trabajo

El rea de trabajo designada para el proyecto ser el rea de Desarrollo de
Proyectos actualmente labora un equipo de 5 personas los cuales se encargan del
desarrollo de proyectos para la empresa. El equipo est liderado por el Dr. Jorge
David de Hoz Diego. Tambin se encuentra en el equipo Yummi Saucedo la cual se
encarga de la contabilidad y papelera de los proyectos. Tambin pertenece al equipo
Sofa Ontiveros la cual se encarga del diseo grfico y publicidad. En esta rea de
Comentario [C5]: ha

desarrollo se a realizado la mayor parte de los proyectos de la empresa.

Vctor Casas Ibarra

16

MECATRONICA

UTD

MEMORIA ESTADIA

CAPTULO II PLANTEAMIENTO DEL PROBLEMA

2.1 Descripcin del Proyecto
Actualmente las herramientas informticas y de programacin son elementos
fundamentales para la superacin y desarrollo empresarial. Por eso, empresas
reconocidas mundialmente basan su crecimiento y desarrollo en la aplicacin y la
programacin estratgica de las herramientas computacionales y han definido
polticas que los inducirn a su permanencia en el dinamismo mundial de los
prximos aos.
El objetivo de este proyecto es brindar, de la mano de las herramientas
digitales, un servicio de control para la gestin de contenido web digital utilizando
herramientas electrnicas de vanguardia como lo es Raspberry. Esta plataforma
permite la creacin de herramientas (navegadores web) preprogramados de cdigo
abierto con los cuales puede llevarse a cabo la gestin de los contenidos.
En el proyecto se modific un browser existente diseado en WebKit para
entornos grficos desarrollados con libreras grficas QT. La programacin de
aplicaciones basadas en las libreras Qt simplifica el desarrollo de aplicaciones
pudiendo fcilmente migrar de plataforma. Webkit.
Al usar aplicaciones basadas en web se mejora la experiencia de usuario y se
facilita su implementacin e interaccin con otros sistemas digitales

2.2 Objetivos del proyecto

2.2.1 Objetivo general
Implementar un servicio para control remoto que permita tener acceso desde
cualquier lugar fsico, hacia el explorador el cual funcionara como player para los
contenidos digitales empleando un dispositivo Raspberry

Vctor Casas Ibarra

17

MECATRONICA

UTD

MEMORIA ESTADIA

2.2.2 Objetivos especficos

Desensamblar el cdigo fuente mediante la plataforma QT, para conocer

sus instancias y entender su funcionamiento para planificar el desarrollo de
la aplicacin a programar.

Programar el cdigo fuente mediante QT y C++ para incrustar un servicio

de escucha TCP (Protocolo de Control de Transmisin) en la aplicacin del
navegador.

Realizar pruebas de funcionamiento, de conexin y despliegue del

contenido multimedia desde la red de trabajo, para la verificacin del
correcto funcionamiento

2.3 Justificacin
Debido a la necesidad de brindar un servicio de cartelera digital de mayor
calidad para los clientes se plantea la realizacin e implementacin de un control
remoto de contenidos ms inteligente y que responda al instante brindando as un
mayor soporte al cliente que le permita una gestin oportuna para sus necesidades
de informacin. Facilitando el uso de las herramientas para el usuario final mejorando
su experiencia en el uso de dispositivos inteligentes, basado en la implementacin de
aplicaciones web.

2.4 Alcances
Este proyecto se enfoca a la generacin y modificacin de la plataforma digital
de control para su gestin remota desde cualquier punto de manera inalmbrica por
medio de la red, todo esto aunado a una implementacin basada en cdigo fuente
del sistema funcional. El presente proyecto tendr una duracin 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

Vctor Casas Ibarra

18

MECATRONICA

UTD

MEMORIA ESTADIA

instalacin de un ttem 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 conclusin satisfactoria total presentando un modelo funcional
del PLAYER digital.

2.4.1 Limites
Las limitaciones para este proyecto estn establecidas por las aplicaciones
multimedia para las que fueron destinados los ttems digitales, adems 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.

Vctor Casas Ibarra

19

MECATRONICA

UTD

MEMORIA ESTADIA

CAPTULO III MARCO TERICO

3.1 Que es un sistema Raspberry
El Raspberry PI es una minicomputadora del tamao de una tarjeta de crdito
la cual es capaz de conectarse a un monitor junto con un teclado y funcionar como
una computadora de tamao normal. La misma es capaz de utilizarse para proyectos
de electrnica con la facilidad de realizar varias tareas simultneas que una
computadora de escritorio hace normalmente como hojas de clculo, procesar y
edicin de texto, juegos y tambin reproducir videos en alta definicin. Tiene como
objetivo que el usuario se envuelva en el mundo de la programacin. (Cellan Jones,
2014).
El Raspberry PI utiliza la tecnologa SoC (System on a Chip) de arquitectura
ARM. El chip BCM2835 posee un ncleo 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
conexin y salidas de audio y video.

Vctor Casas Ibarra

20

MECATRONICA

UTD

MEMORIA ESTADIA

Comentario [C6]: Revisar tamao de

acuerdo al manual de estada.

Figura 1 Vista superior del Sistema Raspberry

3.2 Que es un web browser?

Son los programas que permiten interpretar el contenido de las pginas de la
World Wide Web, la cual se conoce como browser en el idioma ingls. El verbo to
browse viene de una antigua palabra francesa que significa "brote de una planta", y
su sentido inicial era "mordisquear, ramonear", que es lo que hacen los herbvoros.
De ah pas a significar "echar una ojeada" (por ejemplo, a las cosas de una tienda)
u "hojear" las pginas de un libro.
Como la malla mundial est compuesta de "pginas" pareca sensato que un
programa permitiera "hojearlas", que fue lo que pas en el ingls. En castellano se
usan distintos nombres: por una parte, nunca falta quien utiliza directamente browser
(pronunciado ms o menos "brauser"). En ocasiones se usa "hojeador", traduccin
directa del ingls; tambin se utiliza los trminos de "visualizador" o "visor", que son
acertados, porque recogen la esencia del programa la cual es permitir ver las
pginas tal y como fueron creadas. Un trmino menos utilizo es "lector" que por otra
parte tambin es el dispositivo de acceso al CD-ROM, aunque rara vez hay

Vctor Casas Ibarra

21

MECATRONICA

UTD

MEMORIA ESTADIA

posibilidad de equivocacin porque aparecen en contextos muy distintos. (Milln,

2014).
Pero los que estn extendindose ms 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 metforas
distintas: que la malla mundial es un ocano (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 comunicacin entre el servidor web y el navegador se realiza mediante el
protocolo HTTP (Lane , 2008), aunque la mayora de los browsers soportan otros
protocolos como FTP, Gopher y HTTPS que es una versin cifrada de HTTP basada
en Secure Socket Layer o Capa de Conexin Segura (SSL).
La funcin 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 imgenes, sonidos e incluso
vdeos streaming en diferentes formatos y protocolos. Adems, permiten almacenar
la informacin en el disco o crear marcadores (bookmarks) de las pginas ms
visitadas.
Algunos de los navegadores web ms populares se incluyen en lo que se
denomina una Suite. Estas Suite disponen de varios programas integrados para leer
noticias de Usenet y correo electrnico mediante los protocolos NNTP, IMAP y POP.
Los primeros navegadores web slo soportaban una versin muy simple de
HTML. El rpido desarrollo de los navegadores web condujo al desarrollo de
lenguajes no estndares de HTML y a problemas de interoperabilidad en la web. Los
ms modernos (como Google Chrome, Amaya, Mozilla, Netscape, Opera e Internet
Explorer 9.0) (ilustracin 2) soportan los estndares HTML y XHTML (comenzando
con HTML 4.01, los cuales deberan visualizarse de la misma manera en todos ellos).

Vctor Casas Ibarra

22

MECATRONICA

UTD

MEMORIA ESTADIA

Los estndares web son un conjunto de recomendaciones dadas por el World

Wide Web consortium W3C (Berners, 2013) y otras organizaciones internacionales
acerca de cmo crear e interpretar documentos basados en la web. Su objetivo es
crear una web que trabaje mejor para todos, con sitios accesibles a ms personas y
que funcionen en cualquier dispositivo de acceso a Internet.

Figura 2 Distintos navegadores del mercado

3.4 Licencia de cdigo libre

Una licencia de cdigo libre es una licencia de software que permite que tanto
el cdigo fuente como los archivos binarios sean modificados y redistribuidos
libremente y sin tener que pagar al autor original. Sin embargo, ciertas licencias de
cdigo abierto pueden incorporar algunas restricciones, como el requisito de
mantener el nombre de los autores y la declaracin de derechos de autor en el
cdigo, o permitir la modificacin del cdigo slo para usos personales o la
redistribucin del software para usos no comerciales. Un grupo popular (y a veces
considerado normativo) de licencias de software de cdigo abierto son aquellas
aprobadas por la Open Source Initiative basndose en su Open Source Definition.
(Wikipedia la Enciclopedia libre, 2014) En la Figura 3 se muestra una comparativa
entre los diferentes cdigos libres.

Vctor Casas Ibarra

23

MECATRONICA

UTD

MEMORIA ESTADIA

Figura 3 Comparativa entre los diversos tipos de cdigo libre (Diazepam, 2012)

3.5 Sistema de ventanas X

El Sistema de Ventanas X (en ingls, X Window System) es un software que
fue desarrollado a mediados de los aos 1980 en el MIT para dotar de una interfaz
grfica a los sistemas Unix. Este protocolo permite la interaccin grfica en red entre
un usuario y una o ms computadoras haciendo transparente la red para ste.
Generalmente se refiere a la versin 11 de este protocolo, X11, el que est en uso
actualmente. X es el encargado de mostrar la informacin grfica 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 ratn, mientras que los clientes son las aplicaciones
que utilizan estos recursos para interaccin con el usuario. De este modo mientras el
servidor se ejecuta de manera local, las aplicaciones pueden ejecutarse
remotamente

desde

otras

mquinas,

proporcionando

as

el

concepto

de

transparencia de red.

Vctor Casas Ibarra

24

MECATRONICA

UTD

MEMORIA ESTADIA

Figura 4. X Window System en GNOME 2.20.

3.6 Que es SSH?

SSH (Secure SHell, en espaol: intrprete de rdenes segura) es el nombre
de un protocolo y del programa que lo implementa, y sirve para acceder a mquinas
remotas a travs de una red. Permite manejar por completo la computadora
mediante un intrprete de comandos, y tambin puede redirigir el trfico de X para
poder ejecutar programas grficos se tiene ejecutando un Servidor X [0] (en sistemas
Unix y Windows).
Adems de la conexin a otros dispositivos, SSH permite copiar datos de
forma segura tanto archivos sueltos como simular sesiones FTP cifradas como se
muestra en el esquema presentado en la (Figura 5.) Tambin permite gestionar
claves RSA para no escribir claves al conectar a los dispositivos y pasar los datos de
cualquier otra aplicacin por un canal seguro tunelizado mediante SSH. (Wikipedia la
Enciclopedia libre, 2014)

Vctor Casas Ibarra

25

MECATRONICA

UTD

MEMORIA ESTADIA

Figura 5. Conexin mediante SSH

3.7 Protocolo de Control de Transmisin

El Protocolo de Control de Transmisin o TCP, es uno de los protocolos
fundamentales en Internet. Fue creado entre los aos 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 travs de las cuales puede
enviarse un flujo de datos. El protocolo garantiza que los datos sern entregados en
su destino sin errores y en el mismo orden en que se transmitieron. Tambin
proporciona un mecanismo para distinguir distintas aplicaciones dentro de una
misma mquina, a travs del concepto de puerto.
El protocolo TCP da soporte a muchas de las aplicaciones ms populares de
Internet (navegadores, intercambio de ficheros, clientes FTP, etc.) y protocolos de
aplicacin 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

Vctor Casas Ibarra

26

MECATRONICA

UTD

MEMORIA ESTADIA

monitoreo de datos porque esta funcin se cumple implcitamente por el protocolo

TCP.

3.8 Aplicaciones WEB

En la ingeniera de software se denomina aplicacin web a aquellas
herramientas que los usuarios pueden utilizar accediendo a un servidor web a travs
de Internet o de una intranet mediante un navegador. En otras palabras, es una
aplicacin software que se codifica en un lenguaje soportado por los navegadores
web en la que se confa la ejecucin al navegador.
Las aplicaciones web son populares debido a lo prctico 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 lnea y la propia Wikipedia que son ejemplos bien conocidos de
aplicaciones web. (alegsa media commons, 2010)
Es importante mencionar que una pgina Web puede contener elementos que
permiten una comunicacin activa entre el usuario y la informacin. Esto permite que
el usuario acceda a los datos de modo interactivo, gracias a que la pgina
responder 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 ingeniera de software el desarrollo en cascada, tambin llamado modelo
en cascada (denominado as por la posicin de las fases en el desarrollo de esta,
que parecen caer en cascada por gravedad hacia las siguientes fases), es el
enfoque metodolgico 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
finalizacin de la etapa anterior (Pressman, 1989). Al final de cada etapa, el modelo

Vctor Casas Ibarra

27

MECATRONICA

UTD

MEMORIA ESTADIA

est diseado para llevar a cabo una revisin 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 dems modelos de ciclo de vida.
La versin 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 metodologa de desarrollo en cascada es:
1. Anlisis de requisitos.
2. Diseo del sistema.
3. Diseo del programa.
4. Codificacin.
5. Pruebas.
6. Verificacin.
7. Mantenimiento.
De esta forma, cualquier error de diseo detectado en la etapa de prueba
conduce necesariamente al rediseo y nueva programacin del cdigo afectado,
aumentando los costos del desarrollo. La palabra cascada sugiere, mediante la
metfora de la fuerza de la gravedad, el esfuerzo necesario para introducir un cambio
en las fases ms avanzadas de un proyecto. En la Figura 6 se muestra un esquema
del desarrollo en cascada.

Vctor Casas Ibarra

28

MECATRONICA

UTD

MEMORIA ESTADIA

Figura 6 Desarrollo en cascada

3.10 QT Framework
El trmino Qt hace referencia a una biblioteca multiplataforma ampliamente
usada para desarrollar aplicaciones con interfaz grfica de usuario, (qt-project.org,
2014) as como tambin para el desarrollo de programas sin interfaz grfica, como
herramientas para la lnea de comandos y consolas para servidores.
La biblioteca Qt es desarrollada como un software libre y de cdigo abierto a
travs de Qt Project, donde participa tanto la comunidad, como desarrolladores de
Nokia, Digia y otras empresas. Anteriormente, era desarrollado por la divisin de
software de Qt de Nokia, que entr en vigor despus de la adquisicin por parte de
Nokia de la empresa noruega Trolltech, el productor original de Qt, el 17 de junio de
2008. Qt es distribuida bajo los trminos de GNU Lesser General Public License (y
otras). Por otro lado, Digia est a cargo de las licencias comerciales de Qt desde
marzo de 2011.
Vctor Casas Ibarra

29

MECATRONICA

UTD

MEMORIA ESTADIA

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

FreeBSD, entre otros. Qt utiliza el lenguaje de programacin C++ de forma nativa,
adicionalmente puede ser utilizado en varios otros lenguajes de programacin a
travs de bindings. Tambin es usada en sistemas informticos empotrados para
automocin, aeronavegacin y aparatos domsticos como frigorficos.
Funciona en todas las principales plataformas, y tiene un amplio apoyo. El API
de la biblioteca cuenta con mtodos para acceder a bases de datos mediante SQL,
as como uso de XML, gestin de hilos, soporte de red, una API multiplataforma
unificada para la manipulacin de archivos y una multitud de otros para el manejo de
ficheros, adems 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 (ilustracin 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

Vctor Casas Ibarra

30

MECATRONICA

UTD

MEMORIA ESTADIA

CAPTULO 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 fciles 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 sern divididas en tareas con objetivos a cumplir.

Figura 8 Diagrama de la planeacin del proyecto

4.1 Anlisis de requisitos

El proyecto requiri que el uso de la aplicacin final (web browser) funcione en
el Raspberry PI. Tambin 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 pginas de
Internet.

Vctor Casas Ibarra

31

MECATRONICA

UTD

MEMORIA ESTADIA

La realizacin del proyecto requiri que fuesen desensamblados 2

aplicaciones o navegadores de cdigo libre para modificar la estructura e
implementar un servicio de recepcin de comandos y el navegador web en una sola
aplicacin. Para esto se seleccionaron entre dos cdigos de estructura bsica
buscando caractersticas como la rapidez y la compatibilidad con las aplicaciones
WEB y HTML5 y que fuesen capaces de ejecutarse en la plataforma Raspberry.

4.2 Diseo del sistema

Al comenzar el diseo del sistema se desensamblo el cdigo fuente de la
aplicacin browser para analizar los elementos que se pudiesen ir elaborando por
separado as como tambin se verifico la compatibilidad de ambos cdigos 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 direccin web, la cual produce un evento de
conexin remota para la lectura de comandos.

4.2.1 Seleccin de cdigo fuente

Mediante la seleccin del cdigo fuente se determin cual fue el cdigo fuente
a utilizar. Se requera que fuese compatible con la plataforma Raspberry y con
Raspbian. El cdigo debe ser libre para su modificacin sin incurrir en alguna falta a
los derechos de autor. A continuacin 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

Vctor Casas Ibarra

32

MECATRONICA

Poco Cdigo

UTD

Si

MEMORIA ESTADIA

Si
Es necesario reescribir

Compatible QT

Si

parte del cdigo

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 recepcin de comandos. El otro cdigo no se
modificara para tener otra opcin de web browser.

4.3 Codificacin
El cdigo 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 funcin 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 travs del socket de conexin esperando
Vctor Casas Ibarra

33

MECATRONICA

UTD

MEMORIA ESTADIA

cadenas de texto, la esencia del sistema es bsica 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 travs de la red con lo cual se cre un
servicio bsico que reciba comandos los cuales sern cadenas ASCII para que sean
interpretadas por el navegador web.

4.4 Implementacin
La realizacin de la aplicacin final fue necesario crear instancias dentro del
cdigo que llamen a las clases creadas, las cuales interactan, 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 realizacin del
cdigo.
Al realizar la programacin del sistema, el inicia como lo haca 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
conexin TCP. el cual fue visible desde la consola del usuario, de esta manera no se
inici desde el mismo equipo de la aplicacin ya que fue activada remotamente
gracias a las conexiones SSH del sistema Raspberry y del servidor TCP.

Vctor Casas Ibarra

34

MECATRONICA

UTD

MEMORIA ESTADIA

Figura 10 Diagrama de flujo de la aplicacin final funcionando ambos servicios paralelamente.

Vctor Casas Ibarra

35

MECATRONICA

UTD

MEMORIA ESTADIA

4.5 Verificacin
La verificacin y el correcto funcionamiento del sistema se realiz mediante la
conexin y la puesta en marcha del sistema completo. Primero se elaboraron la
compilacin de ambos cdigos 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 conexin SSH la cual es provista por PUTTY para acceder a
la plataforma Raspberry. Para la realizacin de verificacin de funcionamiento se
necesit enviarle cadenas de caracteres al servidor TCP. En la (Figura 11) se
muestra como se realiza la conexin 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 aplicacin PUTTY y NETCAT.

Figura 11 Esquema de conexin de prueba para el servidor TCP.

Vctor Casas Ibarra

36

MECATRONICA

UTD

MEMORIA ESTADIA

Captulo V
5.1 Resultados
Al desensamblar el cdigo fuente s pudo determinar cules 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 cdigo por medio de SIGNALS y SLOTS. Los SIGNALS
son seales que son emitidas durante la ejecucin del cdigo y estas actan como
una alarma o una llamada la cual es recibida por el SLOT este a su vez se comporta
como un recipiente dentro del cdigo a la espera de una seal que lo active
nuevamente. Para que estas caractersticas puedan actuar en conjunto es necesario
ligarlas entre s por medio de programacin de esta manera ningn SIGNAL ira a
ningn 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 pequea aplicacin en lnea
de comandos la cual dirija las instrucciones hacia el servidor TCP., Al crear esa
instancia fue necesario ensamblar ambos cdigo en una sola aplicacin. Para esto
fue necesario trasplantar el programa bsico del servidor TCP. y por medio de
programacin orientada a objetos fue necesario crear dos clases totalmente iguales
dentro del cdigo principal del navegador para que estuviesen enlazados desde el
principio de la creacin del cdigo. 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 direccin web y desplegada el contenido multimedia, de esta manera pudo
confirmarse que las aplicaciones se haban logrado fusionar entre s.

Vctor Casas Ibarra

37

MECATRONICA

UTD

MEMORIA ESTADIA

Figura 12 Envio de comandos desde dispositivo Remoto

El resultado de las pruebas realizadas fue todo un xito ya que el programa
responda con gran fluidez y era capaz de interpretar la mayora de sitios web (figura
13) los cuales se le enviaban como comandos y desplegar las pginas sin errores
(Figura 14). No fue necesaria una exhaustiva realizacin de pruebas ya que el
programa actuaba conforme a lo esperado.

Vctor Casas Ibarra

38

MECATRONICA

UTD

MEMORIA ESTADIA

Figura 13 muestra del sistema en funcionamiento

Figura 14 Despliegue de pgina web de prueba

Vctor Casas Ibarra

39

MECATRONICA

UTD

MEMORIA ESTADIA

Conclusiones
Conclusin
Al desensamblar el cdigo 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 codificacin de los nuevos servicios implementados.
Fue necesario crear una aplicacin pequea por lo cual fue necesario
programarla en la plataforma QT. Al realizar las modificaciones de los cdigos se
pudo ir verificando poco a poco como se entrelazan las clases dentro de una
aplicacin. Al entender las necesidades de recepcin de comandos fue preciso crear
las instancias que se encargaran de escuchar los comandos. Con esto fue
necesario escribir desde cero una aplicacin que hiciera de servidor TCP. La cual se
encargara de hacer echo recibiendo cadenas de caracteres e imprimindolas en
pantalla.
Durante las pruebas de conexin hubo ciertos obstculos que impedan las
conexiones dentro de la red las cuales se deban 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 e
interpretarlos, esto presenta una herramienta con gran potencial ya que el cdigo
puede ser implementado de diversas maneras con lo cual se puede encontrar
aplicacin en diversos aspectos que requieran envi de comandos para el control

Vctor Casas Ibarra

40

MECATRONICA

UTD

MEMORIA ESTADIA

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

telfonos celulares ampliando las posibilidades de su uso.
Este desarrollo fue creado en base a las necesidades de la empresa Servicios
de Tecnologas e Informacin 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 cdigo libre se destina a que pueda mejorarse o implantarse mejoras por otros
usuarios interesados en el control remoto de contenidos multimedia.

Vctor Casas Ibarra

41

MECATRONICA

UTD

MEMORIA ESTADIA

Trabajo futuro
En base a los resultados obtenidos del proyecto actual la empresa propone un
proyecto paralelo al uso de la aplicacin generada basado en el uso de PLUGINS
incorporados a la aplicacin final del Browser generado con lo cual sera posible
extraer la informacin multimedia remotamente esto sera de gran utilidad debido a
que se generara una interfaz multimedia mucho ms eficiente e inteligente al
desplegar los contenidos. Con esto se podra generar otra estada dentro de la
empresa cubriendo los intereses mutuos para el estudiante, la universidad y el
corporativo.

Vctor Casas Ibarra

42

MECATRONICA

UTD

MEMORIA ESTADIA

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-icie99ingenieriasoftwareeducativo.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-losperjuicios-al-codigo-abierto/. Recuperado el 16 de noviembre de 2014, de
http://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 (pgs. 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-areon-sale-now-25-mo/
Lujan Mora, S. (2002). Programacin de aplicaciones web: historia, principios bsicos y
clientes web. En S. Lujan Mora, Programacin de aplicaciones web.

Vctor Casas Ibarra

43

MECATRONICA

UTD

MEMORIA ESTADIA

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

http://jamillan.com/v_brows.htm
Pressman, R. (1989). Ingeniera del Software. En R. Pressman, Ingeniera del Software: Un
enfoque prctico (pgs. 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

Vctor Casas Ibarra

44

MECATRONICA

UTD

MEMORIA ESTADIA

Anexos
Anexo 1 Cdigo Fuente SIMPLE BROWSER
Broeser.CPP
1

#include "browser.h"

Browser::Browser(QWidget *parent) :

3
4
5
6
7
8
9
10

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),
"");

11
QPushButton *reload = new QPushButton(this->style()12 >standardIcon(QStyle::SP_BrowserReload), "");
13
14
15

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

"");
this->url = new QLineEdit;

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

17

okUrl->setFlat(true);

18

h_box->addWidget(previous);

19

h_box->addWidget(next);

20

h_box->addWidget(reload);

21

h_box->addWidget(stop);

22

h_box->addWidget(url);

Vctor Casas Ibarra

45

MECATRONICA

UTD

23

h_box->addWidget(okUrl);

24

this->web = new QWebView(this);

25

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

26

MEMORIA ESTADIA

this->status = new QStatusBar;

27

this->progressBar = new QProgressBar;

28

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

29

this->status->addWidget(lbl);

30

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

31

v_box->addLayout(h_box);

32

v_box->addWidget(this->web);

33

v_box->addWidget(this->status);

34

this->setLayout(v_box);

35
QShortcut *shortcut = new QShortcut(QKeySequence(Qt::ALT + Qt::Key_D), this->url);
36
this->connect(previous, SIGNAL(clicked()), this->web, SLOT(back()));

37

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

38

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

39

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

40

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

41

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

42

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

43

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

44

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

45

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

46
47
48

}
void Browser::openUrl(QString text)

Vctor Casas Ibarra

46

MECATRONICA

UTD

MEMORIA ESTADIA

49 {
50

this->web->setFocus();

51

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

52 }
53 void Browser::progress(int val)
54 {
55

this->progressBar->setValue(val);

56 }
57
58

void Browser::doSearch()
{

59

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

60

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

61

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

62

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

63

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

64

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

65

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

66

67
68
69
70

this->openUrl(link);
}
void Browser::loadComplete(bool val)
{

71

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

72
73

this->status->hide();
}

Vctor Casas Ibarra

47

MECATRONICA

UTD

MEMORIA ESTADIA

Browser.pro
1 QT += webkit network
2 SOURCES += main.cpp \
3 browser.cpp
4 HEADERS += browser.h

Main.cpp
1
2

#include <QtGui>

3
#include "browser.h"
4
5
6

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

{

7
8
9
10

QApplication app(argc, argv);

Browser browser;
browser.show();
app.exec();

11 }
12

Anexo 2 Cdigo Fuente Servidor TCP.

Myserver.cpp
#include "myserver.h"

Vctor Casas Ibarra

48

MECATRONICA

UTD

MEMORIA ESTADIA

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();
}

Vctor Casas Ibarra

49

MECATRONICA

UTD

MEMORIA ESTADIA

Myserver.h
#ifndef MYSERVER_H
#define MYSERVER_H
#include <QDebug>
#include <QObject>
#include <QTcpServer>
#include <QTcpSocket>
class myserver : public QObject
{
Q_OBJECT
public:
explicit myserver(QObject *parent = 0);
signals:
public slots:
void newConnection();
private:
QTcpServer *server;
};
#endif // MYSERVER_H

Vctor Casas Ibarra

50