SISTEMAS DE INFORMACION

Practica 3

Adrián Milla Español 557022

Álvaro Gómez Muñoz 602581
Lorenzo Cativiela Martín 579901
Índice

Contenido
Resumen......................................................................................................................................2
Instalación....................................................................................................................................3
Descripción de la web..................................................................................................................3
Página principal........................................................................................................................3
Página de contenido.................................................................................................................3
Lista de series...........................................................................................................................4
Lista de películas......................................................................................................................4
Comparación de contenido......................................................................................................4
Lista de acciones (solo usuarios registrados)............................................................................4
Favoritos (solo usuarios registrados)........................................................................................4
Perfil (solo usuarios registrados)..............................................................................................4
SQL...............................................................................................................................................4
Seguridad y cookies......................................................................................................................5
Medidas de seguridad..............................................................................................................5
-Inyección de datos..................................................................................................................5
-Encriptación mediante “sal” [3]...............................................................................................5
-Encriptación de contraseña cliente-servidor...........................................................................6
-Mejoras de seguridad.............................................................................................................6
-Recapcha.................................................................................................................................6
-Error 404.................................................................................................................................6
Cookies.....................................................................................................................................6
Diseño..........................................................................................................................................7
Diseño general.........................................................................................................................7
Colores.....................................................................................................................................7
Listado......................................................................................................................................7
Información..............................................................................................................................7
Comparación............................................................................................................................7
Reparto de horas..........................................................................................................................7

2
Resumen
Se ha diseñado e implementado una web de comparación entre diferentes
series o películas; la aplicación permite a los usuarios seleccionar dos
elementos de una base de datos, y compararlos, teniendo además información
de los dos contenidos, para ayudar a la decisión.

Otras funcionalidades que permite esta web es guardar un registro del

contenido favorito del usuario, aparte de otras herramientas de gestión de la
cuenta.

En esta memoria se van a detallar las funcionalidades de la aplicación, una

guía de instalación, y otros apartados como seguridad, diseño, etc.

Instalación
Para instalar esta página web se necesita Apache, PHP, MySQL y
PHPMyAdmin. Habrá que instalar dichas plataformas y configurarlas para su
funcionamiento; más información sobre cómo instalar en [1].

En nuestro caso, el mismo servidor Apache compartía diferentes sesiones PHP

con diferentes aplicaciones, hubo que realizar una configuración para poder
separarlas; como realizarlo, en el apartado [2].

Después de realizar los pasos previos, hay que mover a la dirección indicada
en el segundo punto de la instalación todos los archivos de la página; una vez
configurado el servidor, es tan simple como arrastrar al directorio los archivos
de la página.

Para más información leer el manual de instalación

3
Descripción de la web
La web consta de diferentes páginas, en la que cada una tiene un propósito.

Página principal
La página principal muestra al usuario una lista de las 10 mejores series del
momento, y otra con las mejores películas. Como en la lista de series y de
películas, al seleccionar un contenido de la lista iremos a una página donde se
nos mostrará su información.

Página de contenido
Cuando el usuario seleccione un contenido de las diferentes listas, se le
mostrará una página dedicada al contenido; se mostrará el título, una imagen,
su género, duración, sinopsis, rating, director y actores.

También, aquí, el usuario podrá añadir el contenido a su lista de favoritos.

Lista de series
Lista completa de series, con una tabla dinámica que permite al usuario buscar
y mostrar más o menos información por la pantalla.

Permite al usuario seleccionar dos series de la lista y compararlas entre ellas;

la página le mostrará al usuario sus selecciones hasta que este decida
compararlas.

Lista de películas
Similar a la página de series, permite al usuario acceder a la lista completa y a
las facilidades de búsqueda de películas, además de la opción de compararlas
entre sí.

Comparación de contenido
Después de que el usuario elija comparar dos contenidos, se le mostrará por la
pantalla los dos contenidos puestos juntos, para que pueda comparar (con los
datos a la misma altura) su selección, y así elegir que contenido desea ver.

Lista de acciones (solo usuarios registrados)

Permite al usuario ver una lista de las últimas acciones que ha realizado, como
logins, comparaciones, etc.

Favoritos (solo usuarios registrados)

Muestra al usuario la lista de contenido que ha marcado como favorito, con
rating y episodios/duración.

Perfil (solo usuarios registrados)

Muestra al usuario su perfil, con los datos de su cuenta, y opciones para
cambiar su nombre, email, y contraseña.
4
SQL
Nuestra aplicación utiliza una base de datos MySQL para obtener información
sobre contenidos, usuarios, comentarios, etc.

Dentro de las diferentes páginas de la web, generaremos contenido dinámico

(por medio de consultas SQL desde PHP) y lo insertaremos en HTML, para que
el usuario pueda visualizarlo.

Utilizamos DataTables para dar facilidades a los usuarios de la tabla, utiliza

javascript para mejorar las tablas html de la web.

Seguridad y cookies
La seguridad en una página web, es una de las cosas más importantes, ya que
hay que dar la máxima seguridad a los clientes de que el sistema es robusto y
no va a haber fallas de seguridad como robo de datos o suplantación de
identidad

Medidas de seguridad
Existen muchos métodos de seguridad en la web, pero en este documento se
van a resumir aquellas que se han implementado en esta web y posibles
mejoras.

-Inyección de datos
La inyección de datos es un ataque por el cual el atacante intenta introducir
caracteres extraños en los campos de texto que acceden a las bases de datos
(o introducirlos en la dirección web, si se utiliza el método GET); para que a la
hora de hacer una inserción o consulta a la base de datos, esta devuelva todos
los datos de la tabla, o inserte algo que pueda causar que la tabla se
desestabilice.

Para impedir este problema, al finalizar la recogida de datos, se utiliza un

sistema que formatee la cadena de tal manera que se eliminen los caracteres
extraños que puedan ser perjudiciales para la base de datos.

-Encriptación mediante “sal” [3]

En criptografía, la sal comprende bits aleatorios que se usan como una de las
entradas en una función derivadora de claves. La otra entrada es
habitualmente una contraseña. La salida de la función se almacena como la
versión cifrada de la contraseña. La sal también puede usarse como parte de
una clave en un cifrado u otro algoritmo criptográfico. La función de derivación
de claves generalmente usa una función hash. A veces se usa como sal el
vector de inicialización, un valor generado previamente.

Para la encriptación de contraseñas, se debe usar la función “sal” definida

anteriormente, la cual genera una clave aleatoria para la contraseña a cifrar
5
(siendo distinta para cada contraseña) y la encripta con esta. Este método
resulta muy seguro, ya que los posibles atacantes, si llegaran a acceder a la
base de datos, tendrían que desencriptar las contraseñas de una en una sin
posibilidad de encontrar un patrón igual para todas.

-Encriptación de contraseña cliente-servidor

Los datos a la hora de ser enviados desde el cliente al servidor, si no se cifra la
conexión por el método SSL, puede llegar a dar fallas de seguridad. Para ello
existen dos soluciones: activar el certificado SSL en el servidor [4]. La segunda,
se trata de encriptar los formularios antes de su envío al servidor usando la
función de javascript CryptoJS [5]. También se pueden utilizar las dos opciones
a la vez.

Las posibles fallas de seguridad en este tipo de métodos pueden ser

provocadas por el uso de funciones de encriptación no seguras (como MD5) o
el uso de una “sal” por defecto, no generada aleatoriamente.

-Mejoras de seguridad
Para mejorar la seguridad de una página se pueden implementar muchas
restricciones. En la página propuesta, no se han implementado estas
seguridades pero se podrían hacer en un futuro.

La primera constaría de obligar al usuario a la introducción de contraseñas con

un mínimo de caracteres, y con caracteres especiales.

La segunda sería el bloqueo de usuarios que intenten loguearse mas de X

veces en el servidor sin éxito, lo que impediría los ataques por fuerza bruta.

-Recapcha
Se requiere que el usuario demuestre no ser un robot al entrar en su cuenta por
medio de un recapcha.

-Error 404
Si ocurre algún error en la página web relacionado con no encontrar lo que el
usuario busca, se le muestra un error 404 para informarle de la falta de tal
información [7].

Cookies
Una cookie es una pequeña información enviada por un sitio web y
almacenada en el navegador del usuario, de manera que el sitio web puede
consultar la actividad previa del usuario [6].

Uno de los principales usos de las cookies es la de mantener al usuario

logueado en su sesión, sin tener que volver a pedirle su información de login.

6
Diseño
Se han tomado varias decisiones sobre el diseño de la página, que tratan
diferentes aspectos

Diseño general
Se le ha dado a la web un diseño simple e intuitivo, que consigue que el
usuario pueda realizar su selección de contenidos y su comparación de manera
simple, sin tener que aprender a hacerlo.

Colores
Se han seleccionado unos colores que no resulten molestos hacia la vista, y
ayuden a la lectura. En la actualidad hay muchos usuarios de la tecnología
web, y muchas de estas aplicaciones tienen colores muy brillantes que acaban
cansando la vista; pensando en esto, se han seleccionado colores más
apagados que favorezcan al usuario siempre manteniendo una coherencia de
color que no tenga cambios bruscos.

Listado
Para listar la información al usuario se ha elegido una forma algo reducida, en
la que el usuario pueda ver toda la información relevante de lo que quiera de un
solo vistazo, pudiendo ampliar la información de lo que le interesa.

Información
En esta página se encuentra toda la información de la película en la que un
usuario está interesado, la imagen estará ampliada de forma que pueda verse
sin problema. Además, el usuario podrá leer las opiniones de otros usuarios; y,
si está registrado, podrá postear el los suyos propios.

Comparación
En esta sección se ha puesto la información del mismo tipo a la misma altura,
para que el usuario pueda comparar los diferentes datos de manera intuitiva

Reparto de horas

Adrián: 34

Álvaro: 37

Lorenzo: 33

7
Bibliografía (diciembre 2015)
1: Guia instalación apache, php, mysql

http://blog.reaccionestudio.com/instalar-apache-php-mysql-y-
phpmyadmin-en-linux/

2: Soporte multiaplicación en PHP

http://www.dev-metal.com/prevent-php-sessions-shared-different-
apache-vhosts-different-applications/

3: Criptografia “salt”

https://es.wikipedia.org/wiki/Sal_%28criptograf%C3%ADa%29

4: Configuración Apache SSL

http://www.alcancelibre.org/staticpages/index.php/como-apache-ssl

5: Función crypto-js

https://code.google.com/p/crypto-js/

6: Cookies

https://es.wikipedia.org/wiki/Cookie_%28inform%C3%A1tica%29

7: Cookies sesion

http://www.downwithdesign.com/web-development-tutorials/adding-
remember-feature-php-login-script/

8: Error 404

http://www.desarrolloweb.com/articulos/configurar-pagina-error-404-
apache.html