ayuda con login php

Iniciado por xavidenia, 26 Octubre 2016, 18:43 PM

0 Miembros y 1 Visitante están viendo este tema.

xavidenia

Hola buenas tardes mi duda es que estoy tratando de insertar un formulario de login en en header php que he creado.......
concretamente el header es un include ........

ahora estoy tratando de agreguarle un inicio de sesion para el partado del blog principalmente....

asi que he empezado a buscar por la web posibles plantillas php de login y he intentado adaptar varias a mi proyecto sin mucho exito.....

el problema reside en que todas las plantillas que he encontrado  estan  basadas en un sistema  de varias redirecciones a varias paginas y varios archivos php y ahi es donde me pierdo un poco.......

https://www.tutorialspoint.com/php/php_mysql_login.htm
http://blog.hostdime.com.co/guia-para-crear-un-sistema-de-inicio-de-sesion-y-registro-usando-php-y-mysql/

en estas dos paginas el ejemplo pasa por cuando te conectas te redirecciona a una pagina llamada welcome o login y eso es lo que yo estoy tratando de evitar......
lo que yo quiero es que cuando se loguee alguien  no me redirecione a ningun sitio , en cambio si que quiero que cuando se loguee alguien aparezca en el header su nombre de usuario y su avatar tanto si tiene uno elegido por si mismo , como si tiene uno por defecto.......

y que cuando le de a regictrarse abra el formulario que tengo en una ventana modal en otra pagina que se llama comentarios.php.....

alguien puede orientarme sobre como puedo optimizar el codigo de alguna de estas dos paginas de forma  que todo ese codigo, o almenos todo el codigo posible vaya dentro del archivo header.inc.php?????

gracias

SetzerFF

Hola.

Es muy sencillo lo que queres hacer.

En vez de redirigir a una página u otra (podés redirigir al mismo index si queres), podés mostrar la página normalmente.
Primero tenes que hacer el chequeo del login, y si el login es válido (antes de mostrar HTML), seguir ejecutando la página.
Ahora cuando mostras la página normalmente, podes elegir ejecutar una plantilla para usuarios loggeados. Pero no sé si es lo que queres hacer. Pero lo que queres hacer, creo, es en la misma plantilla podes poner IFs.
Un IF en el header. Si está loggeado mostrar datos del usuario. Si no está loggeado mostrar form de login.

Y si, podes poner todo el código en el mismo header.inc.php


Saludos.

Fold'em, Let'em Hit Me, Raise It, Stay with Me

xavidenia

Gracias por tu respuesta....
ya tengo en formulario de inicio de sesion integrdado en header , por medio de un
include_once  y el formulario funciona bien, ahora lo que no consigo hacer es que cuando se loguee alguien , no me redireccione a ningun sitio , si no que se quede  en el mismo sitio y me muestre el avatar del usuario y su nick , me oculte la palabra login y en su stio me aparezca Desconectar......

eso e insertarle un link al formulario de registro modal que tengo creado en otra pagina...

agradeceria sugerencia o algun ejemplo sobre el que guiarme pues ando un poco corto en php..... pues estoy iniciando en php y javascript.....

saludos

SetzerFF

#3
Lo podés hacer con AJAX usando jQuery o AngularJS entre otros.

En caso de jQuery te pongo un ejemplo:
Primero tendrias que asignar un div para el lugar donde estará los datos del usuario, avatar, etc. Y en ese mismo div, el login box.
Una vez dado al botón Login con jQuery deshabilitas la acción por defecto con preventDefault(), y luego haces una petición en AJAX, tipo POST, y ese PHP que hace post, valida si el usuario es valido o no (y crea la sesión o cookie) y luego si el usuario loggeado es valido modificas el DOM, el div especificamente con los datos del usuario para reemplazar el contenido del div con el login box.
Igual, tendrais que fijarte tambien la seguridad de la página y del javascript.
Con AngularJS deberia ser masomenos similar.

Saludos.

Fold'em, Let'em Hit Me, Raise It, Stay with Me

xavidenia

#4
Gracias por tu respuesta , estoy usando jquery pero solo uso lo basico pues como he dicho anteriormente , estoy empezando en php y javascript  en tiendo lo que me dices pero se me hace un mundo y lo veo complicado..... yo esperaba poder hacer mas en php que estoy un poco mas puesto.....

por otro lado en el formulario de inicio php debo de meter  un link para que me abra un formulario  modal que tengo creado en una pagina y dicho formulario no lo consigo insertar con todas sus funcionalidades al formulario de login , pq el formulario de login es 100%php y el formulario modal , necesita de javascript(jquery , bootstrap + codigo para un select de imagenes.....)
y como que no consigo que me funcione el javascript al 100%

pues no consigo integrar el javascript en un archivo 100%php

asi que no se si seria viable  hacer lo que dices de un div en query
en un archivo que es 100% php....

por cierto no veo ningun ejemplo, mas bien veo una explicacion....
de todas formas  si pudiese ver un ejemplo te lo agardeceria .....

SetzerFF

Hola. Te hice un ejemplo básico.
Si lo que queres es que no redireccione o se recargue la página, tenes que hacer aprox. la mitad en javascript/jQuery usando AJAX para la actualización del DOM y la otra mitad en PHP para validar el usuario con la base de datos.

Te hice un ejemplo sencillo de como lo podrias hacer con Modal básico para el link de registro.

Código (html4strict) [Seleccionar]
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

<script type="text/javascript" src="https://code.jquery.com/jquery-3.1.1.min.js"></script>

<div id="loginBox">
Bienvenido Invitad@. Ingresa tus datos o <a href="" data-toggle="modal" data-target="#myModal">Registrate</a>
<form id="loginForm" name="loginForm" method="POST" action="">
<input type="text" name="username" plcaeholder="Usuario" required />
<input type="password" name="password" plcaeholder="Password" required />
<input type="submit" name="loginButton" value="Login" />
</form>
</div>
<hr/>


<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">Formulario de Registro</h4>
      </div>
      <div class="modal-body">
        Form...
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Cerrar</button>
      </div>
    </div>
  </div>
</div>



<div id="content">
<h1>Contenido de la pagina</h1>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse nec aliquam metus. Ut ac porttitor mauris. Curabitur congue eros et pulvinar consequat. Nullam malesuada consequat leo, sit amet efficitur sapien ultrices ac. Suspendisse vulputate vel quam vel elementum. Sed laoreet lorem id condimentum congue. Morbi hendrerit ligula nec lacinia dignissim. Nunc tincidunt libero justo, viverra sagittis odio semper ac. Donec sem risus, facilisis at rutrum nec, finibus vel nunc. Morbi mollis id nunc eu tincidunt. Nullam blandit ligula quis pharetra vulputate. Maecenas pretium odio a purus faucibus, sed accumsan metus faucibus. Nullam nec ullamcorper urna. Praesent diam metus, vulputate ac fringilla nec, sodales in leo.

Sed vel enim mattis, interdum magna eu, maximus felis. Proin lorem felis, dignissim at commodo ac, auctor eu nisl. Maecenas sit amet commodo nulla, nec imperdiet justo. Vivamus ac neque sit amet nisl dapibus consequat vitae ut justo. Maecenas et nisi a arcu pretium lacinia. Pellentesque interdum tellus vitae dui tristique blandit. Sed sollicitudin mauris a sodales mattis. Suspendisse nibh ipsum, interdum quis arcu sit amet, feugiat congue orci. Maecenas tincidunt eros a eleifend hendrerit. Nullam non faucibus justo, nec bibendum est. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed mollis, nibh tincidunt scelerisque egestas, mi turpis dignissim quam, a condimentum nisl lacus vel libero. Nulla iaculis, erat a molestie euismod, purus dui pellentesque nulla, nec mollis nibh lacus at leo. Sed commodo placerat libero ac congue. Ut lectus lorem, pulvinar eget libero sit amet, bibendum posuere nibh.
</div>

<script>
$(document).ready(function() {
$("#loginForm").submit(function(e) {
e.preventDefault();
var serialization = $("#loginForm").serialize();
$.ajax({
url: "login.php",
type: 'POST',
data: serialization,
success: function(message) {
$("#loginBox").html(message);
},
error: function(error) {
alert(message);
}
});
});
});
</script>

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>


Como verás lo que hace es mostrar la pagina, un formulario de login, un link de registro que abre el modal myModal al darle click, y un contenido generado de lorem ipsum.

Lo interesante es el javascript jQuery, casi al final.
Lo que hace es abrir una petición AJAX a login.php (te lo adjunto más abajo), enviando los datos del formulario como el usuario y la contraseña.

Ahora el login.php, hice uno simple, solo para el ejemplo. En tu caso, tendrias que programar el PHP, para que haga las validaciones con los datos de la base de datos, y luego crear la sesión o cookie, según el que necesites. En este ejemplo, es simplemente si pones de usuario: SetzerFF y contraseña: jQueryTest, te mostraria en la pagina html de ejemplo (recuerda subirlo a un servidor, para que funcione el AJAX) una bienvenida y datos, y si se ingresa un usuario no valido, te muestra error y de nuevo el formulario para reintentar. Con tu programación PHP, tenes que crear la conexión con la base de datos, la validación, las sesiones, etc.

Y por ultimo, en este ejemplo como lo hice muy rápido, te escribe un echo, y este echo, es el que se devuelve en el AJAX de la pagina principal. Lo ideal es devolver un valor JSON para el Ajax, y luego que el javascript manipule como se va a mostrar.

Código (php) [Seleccionar]
<?php
if($_POST['username']=="SetzerFF" && $_POST['password']=="jQueryTest") {
echo 'Bienvenido SetzerFF. <a href="#">Logout</a>';
}
else {
echo 'Ha ocurrido un error. Por favor reingresa tus datos... o <a href="" data-toggle="modal" data-target="#myModal">Registrate</a> <form id="loginForm" name="loginForm" method="POST" action="">
<input type="text" name="username" plcaeholder="Usuario" required />
<input type="password" name="password" plcaeholder="Password" required />
<input type="submit" name="loginButton" value="Login" />
</form>'
;
}


Salu2

Fold'em, Let'em Hit Me, Raise It, Stay with Me

xavidenia

Gracias por tu esplicacion .......

voy ha probar....

saludos