|
Bueno continúo aquí con este tutorial sobre la creación de un aplicación web en PHP y MySQL, que como indiqué en la primera parte es la traducción de un artículo de un blogger en inglés ( Paul Stamatiou ). En la primera parte se cubrieron los elementos básicos para establecer una base de datos MySQL, conectando con ella desde PHP y luego se introdujeron algunas funciones para crear y gestionar los usuarios. Y al final, brevemente, se estableció el fichero de cabecera (header) que se usará en cada fichero que se cree a partir de ahora. El próximo paso es crear los ficheros principales que realmente hacen algo.
Como se ha mencionado en los comentarios de la primera parte, copiar y pegar el código no siempre funciona debido al formato del html. Así que mejor baja los ficheros al final de ésta serie.
Con el fichero header.php terminado, puedo seguir con el fichero index. Aquí puedes ver el aspecto de un fichero index.php típico: <?php include('header.php'); ?>
<div id=“header”>
<div class=“login”>
//ejemplo de como chequear que un usuario esta conectado
<?php
$user = get_user();
if($user !== NULL) { //si está conectado
echo “Bienvenido “ . $user . “. “;
} else {
echo ‘Bienvenido Visitante.’;
} ?>
</div>
</div>
<div class=“primary”>
//lo que quiera que haga tu aplicación
</div> //cierra primary
<?php include(‘footer.php’); ?> Esto es muy básico - inlcuyo el fichero header.php, hago algo e incluyo el fichero footer.php. La manera más fácil de obtener los datos del usuario y chequear si un usuario está conectado es con la función get_user(). El código en la capa (<div>) login muestra el nombre del usuario conectado para hacerles saber que están conectados. A continuación un fichero footer.php sencillo - basicamente cierra la etiqueta <body> y <html> a la vez que añade un nuevo <div> para mostrar lo que quieras. Generalmente se puede añadir enlaces a páginas con la politica de privacidad y los términos del servicio (TOS). <br clear=”all”/>
<div id=”footer”>
My First Web App
</div>
</body>
</html> Menús Dinámicos Ahora que tenemos un pequeño framework, es hora de mostrarte algunas sencillas maneras de conseguir que tu web haga algo e interactúe con la base de datos. En primer lugar, voy a mostrarte una forma fácil para modificar el menú de la página dependiendo de si el usuario está conectado o no. Por ejempleo, un usuario que no esté conectado sólo verá algunos enlaces en el menú mientras que un usuario conectado verá enlaces específicos a su cuenta de usuario o páginas de configuración- Me gusta tener un fichero separado para el menú y nombrarlo como nav.php, como forma abreviado de navegación. Éste fichero es más bien sencillo, ya que sólo contiene los enlaces a las páginas así como el código para chequear la sesión del usuario y determinar su estado de conexión. <?php
$user = get_user();
if($user !== NULL) { ?>
<!– a continuación los elementos del menu que se muestran
si el usuario está conectado.
–>
<div id=“nav”>
<ul class=“menu”>
<li class=“<?php echo $home; ?>”>
<a href=“index.php” title=“Home”>Inicio</a>
</li>
<li class=“<?php echo $account; ?>”>
<a href=“account.php” title=“Account”>Mi Cuenta</a>
</li>
<li class=“<?php echo $profile; ?>”>
<a href=“profile.php” title=“Profile”>Perfil</a>
</li>
<li class=“<?php echo $logout; ?>”>
<a href=“logout.php” title=“Logout”>Salir</a>
</li>
</ul>
</div>
<?php } else { ?>
<!–y ahora los elementos si no esta conectado–>
<div id=“nav”>
<ul class=“menu”>
<li class=“<?php echo $home; ?>”>
<a href=“index.php” title=“Home”>Inicio</a>
</li>
<li class=“<?php echo $login; ?>”>
<a href=“login.php” title=“Login”>Conectar</a>
</li>
<li class=“<?php echo $register; ?>”>
<a href=“register.php” title=“Register”>Registrarse</a>
</li>
</ul>
</div>
<?php } ?> Cada elemento de la lista tiene establecida una clase a una variable PHP. De esta forma, cuando incluys nav.php en cada fichero, podrás especifcar algo como $home = elto_pagina_actual. Si ya tenías tu fichero de estilos CSS de manera que la pestaña (tab) con "li.elto_pagina_actual" tenga un estilo diferente al resto, tendrías un menú dinámico. Como alternativa, podrías considerar integrar el código para los menús inteligentes de Matt. Para terminar mi menú, simplemente añade este trozo de código tras el <div> header en cada fichero o dondequiera que necesites que aparezca el menú. Asegúrate de cambiar "$home" para que se adecue a la página a la que estás añadiendo el código. Por ejemplo, si tu nav.php tenía un elemente con la clase $settings y tu estabas colocando este código en la página settings, cambia $home en ese código por $settings. Esto asegura que los enlaces de la página settings - configuración - tienen un estilo distinto. <?php
$home = “current_page_item”;
include(‘nav.php’);
?> Registrando Usuarios Añadir usuarios a la base de datos requerirá de un formulario para pasar los datos de entrada del usuario a la base de datos tras algunas validaciones de entrada (confirmación de la clave, etc). Los formularios son una manera sencilla de aceptar datos de entrada del usuario y de manejo de la base de datos con solo algunas sentencias MySQL. Como se vió en la primera parte, la tabla de usuarios en la base de datos toma cuenta del nombre de usuario, clave y email. A continuación puedes ver un formulario para capturar estos valores, y puede ser incluido en cualquier página que esté estructurada como la plantilla index.php que he creado anteriormente. <form action=“register_form.php” method=“post”>
<label for=“user”><b>Nombre de Usuario:</b></label>
<input name=“user” type=“text” id=“user” size=“20″/><br />
<label for=“password”><b>Clave:</b></label>
<input name=“password” type=“password” id=“password”
size=“20″/>
<br />
<label for=“password”><b>Confirme la Clave:</b></label>
<input name=“confirm_password” id=“password”
type=“password” size=“20″/>
<br />
<label for=“email”><b>Email:</b></label>
<input name=“email” type=“text” id=“email” size=“20″/><br />
<input type=“hidden” name=“action” value=“create”/>
<input type=“submit” id=“submit” value=“Register”/>
</form>
La primera linea establece la acción del formulario que es otro fichero "form.php", ahí es donde se reciben los datos de entrada y se procesan. Las etiquetas (label) son útiles para darle estilo al formulario con una hoja de estilos CSS a través de los ids de los elementos "input". El tipo "password" para la clave muestra el texto como puntos. Luego el tipo de "input" "submit" hace que el botón envíe los valores entrados al formulario para su procesado. Permiteme que me pare con el código del formulario...
$user = make_safe($_POST[‘user’]);
$pwd = make_safe($_POST[‘password’]);
$confirmpwd = make_safe($_POST[‘confirm_password’]);
$email = make_safe($_POST[‘email’]);
if($_POST[‘action’] == ‘create’) {
// creación de una nueva cuenta.
// ¿Ya existe la cuenta?
// Mira que la clave coincida con la de confirmacion
if(!user_exists($user) && ($pwd == $confirmpwd)) {
//Crea el usuario
create_user($user, $pwd, $email);
do_login($user, $pwd); //conecta
header(‘Location: index.php’);
//redirecciona a la pagina de Inicio
} else { //oh noes!
$error_message = “Error al crear la cuenta!”;
//Esto se mostrará luego en el formulario
}
}
En PHP, se puede obtener un valor pasado desde un formulario mediante $_POST['NOMBRE_DE_INPUT']. Recuerda que cuando creé los inputs le dí a cada uno su nombre; user, password, email, etc. Tan sólo usé ese nombre de input dentro de $_POST para obtener su valor. Para protegernos contra abusos XSS y seguir con algo de seguridad básica para PHP, pasé cada valor de $_POST a través de mi función make_safe() de functions.phop y la asigné a una variable. No tuve que asignarla, pero esto las hace más fácil de digerir. Para más detalles sobre seguridad básica en scripts PHP, puedes mirar aquí. El meollo del código viene con la sección “if(!user_exists($user) && ($pwd == $confirmpwd)) {”. El bucle asegura que el usuario no exista ya y que la clave del usuario se corresponda con la clave de confirmación. Dentro del bucle ejecuto create_user(), pasándole los parámetros que se necesitan y entonces se conecta al usuario con do_login() tras la creación del usuario. El último paso es redireccionar al usuario a algún lugar útil con header("Location: index.php"). Sin embargo, podrías considerar enviar al nuevo usuario a la página con su cuenta para que entre más información. La parte final del bucle crea un mensaje de error que podemos mostrar si no se pudo crear el usuario. Es probablemente una buena ide ampliar el código e implementar mensjaes de error por separado si la clave no coincide o si el usuario ya existe en la base de datos. Más adelnate en form.php, muestro el mensaje de error si este no es "null", ya que inicie $error_message a "null" al principio del fichero. Conectando (Logging In) Se puede añadir nuevo código a form.php para implementear un bucle para conectar al usuario. else if($_POST[‘action’] == ‘login’) {
if(do_login($user, $pwd)) {
// el usuario esta conectado
// se le redirecciona a algun lugar util
header(‘Location: index.php’);
} else {
$error_message = “Usuario o Clave Incorrectos!”;
} Ahora puedes usar los siguiente campos y que usen form.php para validar el usuario, como demostré anteriormente con el registro de usuario. <form action=“form.php” method=“post”>
<label for=“user”><b>Nombre de Usuario:</b></label>
<input name=“user” type=“text” id=“user” size=“20″/>
<br />
<label for=“password”><b>Clave:</b></label>
<input name=“password” type=“password” id=“password” size=“20″/>
<br />
<input type=“hidden” name=“action” value=“login”/>
<input type=“submit” id=“submit” value=“Login”/>
</form> Borrando Usuarios Lo adivinaste. Voy a usar un formulario para esto también. <form action=“delete_account.php” method=“post”>
<input type=“submit” id=“submit” value=“Borrar Cuenta”/>
</form> //delete_account.php
$user = get_user();
$deleteaccount = “delete from users where user=’$user’”;
if (!mysql_query($deleteaccount))
{
die(‘Error: ‘ . mysql_error());
}
header(‘Location: index.php’); Fué fácil, ¿ Eh ? Lo podría haber hecho incluso más fácil si hubiese hecho una función delete_user() pero así captas la idea. En el código anterior, $deleteaccount es una sentencia MySQL que borra de la tabla de usuarios (users) aquel usuario que es igual al actualmente conectado. Puedes observar también donde tengo mi linea de depuración die() para que muestre cualquier error que pudiera surgir. No se ha mostrado la inclusión de cosas estandar como util.php, functions.pho, la definición de IN_PHP, xmysql_connect() y session_start(). Al contrario que en las páginas principales, no se puede incluir el fichero header.php en los ficheros con formularios para reemplazar el hacer todo esto. Eso es debido a que mi header.php tiene algo de HTML dentro y cuando se hacen forms en PHP, este da errores "cabeceras ya enviadas". Y no querrás mostrar código HTML con el formulario. Además, sin llamar a session_start(), la llamada a get_user() dará error ya que no tendremos un id de sesión para usar con el comando MySQL de get_user(). Desconectando (Logging Out) Desconectando a un usuario es una de las tareas más fáciles de llevar a cabo. Todo lo que tengo que hacer es mandar al usuario a la siguiente página.La página destruye la sesión PHP del usuario, requiriendo que vuelvan teclear su usario y clave para validarse como usuario de nuevo. <?php
//logout.php
define(‘IN_PHP’, true);
require(‘util.php’);
require(‘functions.php’);
session_start();
xmysql_connect();
$user = get_user();
do_logout($user);
session_destroy(); //destruye la sesion!
//de vuelta a la pagina de inicio.
header(‘Location: index.php’);
?> La función do_logout() en functions.php reemplaza el id de sesión del usuario en la tabla de usuarios (users) con un valor en blanco mientras que session_destroy() asegura que PHP se olvide del id de la sesión también. Aún habrá más en la tercera parte.
 |
RSS feed Comments
Saludos!!
