Blog de wleagues

Retoques finales

Escrito por wleagues 26-05-2018 en esports. Comentarios (0)

Finalmente quito el "novalidate" del formulario para avisar si hay algún campo obligatorio vacío al ir a enviar el formulario.

También pongo como "disabled" los enlaces de la barra de menús que no están activos ("Cómo jugar" y "Ligas").

Para comprobar el funcionamiento de listar, se puede introducir aquí la referencia "647fa70a34f9c82dec6526b41e3f5845" (sin las comillas), que es un correo que envié yo de prueba y guardé en la base de datos.

Con esto estaría terminado el proyecto.

Base de datos: Listar

Escrito por wleagues 25-05-2018 en esports. Comentarios (0)

La idea de listar es que los usuarios, después de ponerse en contacto con nosotros, puedan comprobar si el correo nos llegó correctamente.

Para ello los pasos a seguir son los siguientes:

  1. Generamos una variable referencia (32 caracteres) de forma aleatoria (altamente improbable que haya dos iguales).
  2. Les enviamos un correo de vuelta que contiene la referencia y una copia de su mensaje.
  3. Les damos la opción de acceder a la página de búsqueda de correos nada más enviarnos el correo.
  4. Al introducir su referencia se comprobará en la BBDD si existe: si es así se les enseña solo el asunto y el nombre. En caso de que no exista dicha referencia, se les informará del error.

Para generar la variable referencia utilizamos uniqid, que crea números aleatorios en función de la hora en microsegundos. Dicha función se puede modificar para añadir prefijos y caracteres. La información acerca de esta función y la forma de declarar la variable la saqué de esta web: https://programadorphp.es/docs/php_manual_espanol/function.uniqid.html

De esta forma definimos una variable referencia que debemos enviar en el email de copia, junto con el mensaje que avisa de que es una copia (definido anteriormente) y quedando finalmente el código de enviar emails en formresult.php de la siguiente forma (líneas 57, 68,71):


Como vimos unas entradas antes, si se introducen los datos correctamente en el formulario, éste redirige a una página de agradecimiento en la que hay un link para comprobar si se envió el correo correctamente. Este link va una página llamada lista.php en la hay un formulario muy simple: un campo para introducir la referencia y el botón de enviar.

Al pulsar "enviar", accedemos a find.php que es donde se realiza todo el trabajo con SQL y PHP. 

El HTML de find.php es exactamente igual al de lista.php, pudiendo así efectuar más búsquedas desde la misma pantalla.

find.php se encarga de:

  1. Realizar una consulta SQL
  2. Devolver un 0 (la consulta es errónea) o un 1 (la consulta funciona)
  3. Imprimir solamente el Nombre, apellidos y Asunto de la consulta en caso de que exista.
  4. Avisar del error en caso de que la referencia no exista.

Realizar la consulta y que exista es bastante simple, pero a la hora de meter un resultado incorrecto, la página no iba al error. Para ello tuve que buscar en la documentación de php una forma de saber si la consulta era correcta o no. Dado que muchos métodos booleanos anteriores estaban obsoletos, encontré la forma de contar filas/columnas (algo más especial al hacer un select que al hacer un delete o insert) que cumplían los requisitos en la siguiente página: http://php.net/manual/es/pdostatement.rowcount.php

El código, por tanto, quedó de la siguiente manera (volvemos a utilizar una variable $success para indicar si se cumple la condición o no):



En el body añadimos lo siguiente:

captura-de-pantalla-2018-05-25-a-las-14.00.50.png

De esta forma quedaría terminado todo lo requerido.

Base de datos: Añadir

Escrito por wleagues 25-05-2018 en esports. Comentarios (0)

Para crear la base de datos, tuve que cambiar el hosting de neocities a webhost. Una vez en webhost, cree la base de datos y modifiqué el archivo "conecta.php" proporcionado, añadiendo mis datos para que funcionara correctamente.

Una vez creada la base de datos, cree la siguiente tabla con sublime partiendo de la que se nos proporcionó:



La idea es guardar en la base de datos todos los correos que se nos mandan. Para ello creamos las siguientes variables:

  • Nombre, email, asunto, mensaje => Las pedimos y no pueden ser null, son obligatorias.
  • Apellido => La pedimos y puede ser null.
  • Id => parte desde 1 y se autoincrementa según vayan llegando correos (para que empiece en uno ponemos AUTO_INCREMENT=1)
  • Referencia => Esta variable servirá para listar. La crearemos nosotros y tampoco puede ser nula.

Una vez importada esta tabla llamada 'correos', modificamos el código php para añadir.

Como la idea es añadir todos los correos que recibimos, añadimos el siguiente código antes de enviar el correo, es decir, una vez realizadas todas las validaciones. 



La variable $referencia se explicará más adelante.

Para que dicho código funcione, es necesario añadir la siguiente línea al principio del todo para conectar con la base de datos:

<?

php require_once 'conectar.php';

?> 

PHP, validación del formulario

Escrito por wleagues 25-05-2018 en esports. Comentarios (0)

La continuación de la página web consistió en pasarla a php, permitiendo validar el formulario creado anteriormente y que envíe un correo si los datos son correctos.

Para comprobar que los valores son correctos y evitar ataques por inyección, se hace uso de la funcion "FILTER_SANITIZE_X" (donde la X es el tipo de dato que se comprueba: email, string, int...). Para comprobar que no está vacío y que los campos se rellenaron, se utiliza la función "isset()".  Si los caracteres son correctos y los campos no están vacíos, la variable $success se vuelve true y se envía un correo a una dirección definida anteriormente. 

El código añadido a la página web "formresult", que recoge los datos de contacto, queda de la siguiente forma: 

La variable referencia que se envía en el email de copia se explicará posteriormente, al igual que el email de copia.

La siguiente modificación en el mismo archivo es el body, que muestra un mensaje de agradecimiento si los datos son correctos y un mensaje de error si los datos contienen caracteres erróneos. También se muestra la pantalla de error si el campo está vacío y en el formulario pusimos como atributo "novalidate". Dicho atributo lo que hace es que no se comprueben los campos marcados como "required", dependiendo toda la validación del php desarrollado posteriormente.




A continuación, adjunto capturas de las dos pantallas que salen según haya error o no:




Colores, imágenes

Escrito por wleagues 13-04-2018 en fondo. Comentarios (0)

Los colores elegidos son tonos oscuros (negro, gris) ya que pega con los logos de la LCS y la LVP. Por tanto, tras hacer el menú en tonos oscuros, con un degradado, a la hora de escoger el color del footer me decanto por un lightgrey.

Las imágenes están todas cogidas del flickr de lolsports y están editadas con Adobe Photoshop para dejarlas más transparentes, permitiendo que se lean las letras de la página web y para reducir el peso. A continuación dejo el antes y después de una de las fotos. Esta foto está escogida para la pantalla de "agradecimiento por contactar" pensando en que representa a una persona en el ordenador, centrada en responder lo antes posible el mensaje que el usuario acaba de enviarnos.