Problemas na tela de login
Olá, gostaria de saber porque a requisição ajax, está dando erro(e as possíveis soluções). É assim, basicamente o usuário entra no site e loga(duh) e então começam os problemas.
Na teoria ao logar, a página de checagem recebe os dados faz a filtragem e então ele, teoricamente deveria voltar os dados e aparecer uma de sucesso ou falha, mas acontecem alguns problemas,
Primeiro que se o user/password estiver errado não aparece a mensagem de erro (User/Senha Inválidos!) e nem fazer nada(clica no botão login e não faz nada);
Segundo que a velocidade de redirecionamento é muito rápida(nem da pra ler User/Senha Corretos. Redirecionando ...), gostaria de tar um tempinho e aí redirecionar;
Terceiro eu não sei muito de ajax por isso, poderão ter erros muito óbvios que eu não percebi, e se tiverem sugestões por favor digam também se quiserem
Código da página de login:
<?php
session_start();
if(isset($_SESSION['logado']) && $_SESSION['logado'] == 'TRUE'):
header("Location: index.php");
endif;
?><html lang="en">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta charset="utf-8">
<title>Metta Contabilidade</title>
<meta name="description" content="User login page">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<!-- bootstrap & fontawesome -->
<link rel="stylesheet" href="../assets/css/bootstrap.css">
<link rel="stylesheet" href="../assets/css/font-awesome.css">
<link rel="shortcut icon" href="../dist/img/favicon.ico" type="image/x-icon">
<link rel="shortcut icon" href="../dist/img/favicon.ico" type="image/x-icon">
<!-- text fonts -->
<link rel="stylesheet" href="../assets/css/ace-fonts.css">
<!-- ace styles -->
<link rel="stylesheet" href="../assets/css/ace-login.css">
<!--[if lte IE 9]>
<link rel="stylesheet" href="../assets/css/ace-part2.css" />
<![endif]-->
<link rel="stylesheet" href="../assets/css/ace-rtl.css">
<!--[if lte IE 9]>
<link rel="stylesheet" href="../assets/css/ace-ie.css" />
<![endif]-->
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="../assets/js/html5shiv.js"></script>
<script src="../assets/js/respond.js"></script>
<![endif]-->
<style type="text/css">
.wrapper{
padding-top: 20px;
padding-top: 50px;
}
input.parsley-error,
select.parsley-error,
textarea.parsley-error {
border-color:#843534;
box-shadow: none;
}
input.parsley-error:focus,
select.parsley-error:focus,
textarea.parsley-error:focus {
border-color:#843534;
box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 6px #ce8483
}
.parsley-errors-list {
list-style-type: none;
opacity: 0;
transition: all .3s ease-in;
color: #d16e6c;
margin-top: 5px;
margin-bottom: 0;
padding-left: 0;
}
.parsley-errors-list.filled {
opacity: 1;
color: #a94442;
}
.modal.fade.in .lab-modal-body {
bottom: 0;
opacity: 1;
}
.lab-modal-body h1 {
font-size: 4rem;
}
.lab-modal-body p {
margin: 0 0 1.62rem 0;
line-height: 1.62;
font-weight: 300;
font-size: 1.62rem;
color: #666;
}
.lab-modal-body {
position: relative;
bottom: -250px;
margin: 150px auto 0;
padding: 40px;
max-width: 60%;
height: auto;
background-color: rgb(248, 250, 247);
border: 1px solid #BEBEBE;
opacity: 0;
-webkit-transition: opacity 0.3s ease-out, bottom 0.3s ease-out;
-moz-transition: opacity 0.3s ease-out, bottom 0.3s ease-out;
-o-transition: opacity 0.3s ease-out, bottom 0.3s ease-out;
transition: opacity 0.3s ease-out, bottom 0.3s ease-out;
}
.close {
margin-top: -20px;
margin-right: -20px;
text-shadow: 0 1px 0 #ffffff;
}
.popup-button {
margin-top: 70px;
}
#falhaLogin {
text-align:center;
font-weight:bolder;
display:none;
}
#sucessoLogin {
text-align:center;
font-weight:bolder;
display:none;
}
</style>
</head>
<body class="login-layout light-login">
<div class="main-container">
<div class="main-content">
<div class="row">
<div class="col-sm-10 col-sm-offset-1">
<div class="login-container">
<br><br><br><br><div class="center">
<div id="sucessoLogin" class="row">
<div class="alert alert-success">Login efetuado com sucesso. Redirecionando...</div>
</div>
<!-- Aqui é a mensagem de erro de login escondida, onde vamos exibir no momento de validação -->
<div id="falhaLogin" class="row">
<div class="alert alert-danger">Usuário ou senha inválido.</div>
</div>
<h1>
<i class=""><img src="../dist/images/logo.png"></i>
<span class="red">Metta</span>
<span class="white" id="id-text2">Contabilidade</span>
</h1>
</div>
<div class="space-6"></div>
<div class="position-relative">
<div id="login-box" class="login-box visible widget-box no-border">
<div class="widget-body">
<div class="widget-main">
<h4 class="header blue lighter bigger">
<i class="ace-icon fa fa-lock"></i>
Digite seus Dados
</h4>
<div class="space-6"></div>
<form name="login_form" action="check_login.php" method="post" id="login_form">
<fieldset>
<label class="block clearfix">
<span class="block input-icon input-icon-right">
<input type="email" name="email_form" id="login" class="form-control" required data-parsley-type="email" data-parsley-trigger="keyup" placeholder="Email" />
<i class="ace-icon fa fa-user"></i>
</span>
</label>
<label class="block clearfix">
<span class="block input-icon input-icon-right">
<input type="password" name="senha_form" id="senha" class="form-control" required data-parsley-required placeholder="Senha" />
<i class="ace-icon fa fa-lock"></i>
</span>
</label>
<div class="space"></div>
<div class="clearfix">
<label class="inline">
<input type="checkbox" class="ace">
<span class="lbl"> Continuar Conectado</span>
</label>
<button type="submit" id="btn_login" class="width-35 pull-right btn btn-sm btn-primary">
<i class="ace-icon fa fa-key"></i>
<span class="bigger-110">Logar</span>
</button>
</div>
<div class="space-4"></div>
</fieldset>
</form>
<div class="space-6"></div>
</div><!-- /.widget-main -->
<div class="toolbar clearfix">
<div>
<a href="#" data-target="#forgot-box" class="forgot-password-link">
<i class="ace-icon fa fa-arrow-left"></i>
Esqueci minha senha
</a>
</div>
<div>
<a href="#" data-target="#signup-box" class="user-signup-link">
Criar conta
<i class="ace-icon fa fa-arrow-right"></i>
</a>
</div>
</div>
</div><!-- /.widget-body -->
</div><!-- /.login-box -->
<div id="forgot-box" class="forgot-box widget-box no-border">
<div class="widget-body">
<div class="widget-main">
<h4 class="header red lighter bigger">
<i class="ace-icon fa fa-key"></i>
Recuperar Senha
</h4>
<div class="space-6"></div>
<p>
Digite seu email para receber instruções:
</p>
<form name="recover_form" action="send_mail.php" method="post" id="recover_form">
<fieldset>
<label class="block clearfix">
<span class="block input-icon input-icon-right">
<input type="email" name="email_recover" class="form-control" required data-parsley-type="email" data-parsley-trigger="keyup" placeholder="Email" />
<i class="ace-icon fa fa-envelope"></i>
</span>
</label>
<div class="clearfix">
<button type="submit" class="width-35 pull-right btn btn-sm btn-danger">
<i class="ace-icon fa fa-lightbulb-o"></i>
<span class="bigger-110">Enviar!</span>
</button>
</div>
</fieldset>
</form>
</div><!-- /.widget-main -->
<div class="toolbar center">
<a href="#" data-target="#login-box" class="back-to-login-link">
Voltar para Login
<i class="ace-icon fa fa-arrow-right"></i>
</a>
</div>
</div><!-- /.widget-body -->
</div><!-- /.forgot-box -->
<div id="signup-box" class="signup-box widget-box no-border">
<div class="widget-body">
<div class="widget-main">
<h4 class="header green lighter bigger">
<i class="ace-icon fa fa-users green"></i>
Cadastro de Novo Usuário
</h4>
<div class="space-6"></div>
<p> Digite : </p>
<form name="register_form" action="register_confirm.php" method="post" id="register_form" data-toggle="validator">
<fieldset>
<label class="block clearfix">
<span class="block input-icon input-icon-right">
<input type="email" name="email_register" class="form-control" required data-parsley-type="email" data-parsley-trigger="keyup" placeholder="Email" />
<i class="ace-icon fa fa-envelope"></i>
</span>
</label>
<label class="block clearfix">
<span class="block input-icon input-icon-right">
<input type="text" name="username" class="form-control" required data-parsley-pattern="^[a-zA-Z ]+$" placeholder="Nome do Usuário" />
<i class="ace-icon fa fa-user"></i>
</span>
</label>
<label class="block clearfix">
<span class="block input-icon input-icon-right">
<input type="password" name="senha_register" id="pass2" class="form-control" required data-parsley-length="[6,72]" data-parsley-trigger="keyup" placeholder="Senha" />
<i class="ace-icon fa fa-lock"></i>
</span>
</label>
<label class="block clearfix">
<span class="block input-icon input-icon-right">
<input type="password" class="form-control" required data-parsley-equalto="#pass2" data-parsley-trigger="keyup" placeholder="Repetir Senha" />
<i class="ace-icon fa fa-retweet"></i>
</span>
</label>
<label class="block">
<input type="checkbox" class="ace" id="agree" required/>
<span class="lbl">
Li e aceito os
<a data-toggle="modal" data-target="#lab-slide-bottom-popup">Termos e Condições e a Política de Privacidade</a>
</span>
</label>
<div class="space-14"></div>
<div class="clearfix">
<button type="reset" class="width-30 pull-left btn btn-sm">
<i class="ace-icon fa fa-refresh"></i>
<span class="bigger-110">Apagar</span>
</button>
<button type="submit" class="width-65 pull-right btn btn-sm btn-success">
<span class="bigger-110">Cadastrar</span>
<i class="ace-icon fa fa-arrow-right icon-on-right"></i>
</button>
</div>
</fieldset>
</form>
</div>
<div class="toolbar center">
<a href="#" data-target="#login-box" class="back-to-login-link">
<i class="ace-icon fa fa-arrow-left"></i>
Voltar para Login
</a>
</div>
</div><!-- /.widget-body -->
</div><!-- /.signup-box -->
</div><!-- /.position-relative -->
</div>
</div><!-- /.col -->
</div><!-- /.row -->
</div><!-- /.main-content -->
</div><!-- /.main-container -->
<div class="modal fade" id="lab-slide-bottom-popup" data-keyboard="false" data-backdrop="false">
<div class="lab-modal-body">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
<h1>Terms and Conditions</h1>
<p>LICENSING</p>
<p>Licenses are valid for one year from the date of purchase. When asking for support with any purchased plugin, you may be asked to provide a valid license key as proof of purchase.</p>
<p>SOFTWARE UPDATES</p>
<p>Updates are included for free for one year. If you have a valid and active license key, and your purchased plugin(s) supports it, updates will be delivered automatically from the WordPress dashboard. If your plugin(s) does not support automatic upgrades,
then updates can be downloaded from your <a href="https://1wd.tv/my-account/" target="_blank">account</a> page.</p>
<p>SUPPORT SERVICES</p>
<p>Support for purchased plugins is given up to one year after the purchase date. If you wish to get support after one year, you must purchase a new license key for the plugin you are seeking support for.</p>
<p>REFUNDS</p>
<p>I firmly believe in and stand behind my products 100%, but I are understand that no all plugins can work perfectly for everyone all of the time. If you are unhappy with your purchase, or you have an issue that we are unable
to resolve that makes the system unusable, I am more than happy to provide a complete refund within 30 days of your original purchase.</p>
<p>A few conditions:</p>
<ol>
<li>I cannot provide refunds due to technical issues unless you allow us to adequately try and assist you. If we are unable to resolve the issue for you, I will provide a refund. Please open a support ticket before requesting a refund for
a technical issue.</li>
<li>Refunds may only be issued within 30 days of the purchase date. After 30 days no refunds can be processed.</li>
</ol>
<div class="text-center">
<a href="https://www.mettacontabilidade.com.br" target="_blank" class="btn-primary btn-plain btn btn-lg popup-button">Visite Metta Contabilidade</a>
</div>
</div>
</div>
<!-- basic scripts -->
<!--[if !IE]> -->
<script type="text/javascript">
window.jQuery || document.write("<script src='../assets/js/jquery.js'>"+"<"+"/script>");
</script><script src="../assets/js/jquery.js"></script>
<!-- <![endif]-->
<!--[if IE]>
<script type="text/javascript">
window.jQuery || document.write("<script src='../assets/js/jquery1x.js'>"+"<"+"/script>");
</script> <script type="text/javascript">
if('ontouchstart' in document.documentElement) document.write("<script src='../assets/js/jquery.mobile.custom.js'>"+"<"+"/script>");
</script>
<script src="../assets/parsley/jquery-1.12.4-jquery.min.js"></script>
<script type="text/javascript" src="../assets/js/jquery-3.1.1.js"></script>
<script src="../assets/parsley/bootstrap/js/bootstrap.min.js"></script>
<script src="../assets/parsley/parsleyjs/dist/parsley.min.js"></script>
<script>
$(document).ready(function(){
$('form').parsley();
});
</script>
<!-- inline scripts related to this page -->
<script type="text/javascript">
jQuery(function($) {
$(document).on('click', '.toolbar a[data-target]', function(e) {
e.preventDefault();
var target = $(this).data('target');
$('.widget-box.visible').removeClass('visible');//hide others
$(target).addClass('visible');//show target
});
});
//you don't need this, just used for changing background
jQuery(function($) {
$('#btn-login-dark').on('click', function(e) {
$('body').attr('class', 'login-layout');
$('#id-text2').attr('class', 'white');
$('#id-company-text').attr('class', 'blue');
e.preventDefault();
});
$('#btn-login-light').on('click', function(e) {
$('body').attr('class', 'login-layout light-login');
$('#id-text2').attr('class', 'grey');
$('#id-company-text').attr('class', 'blue');
e.preventDefault();
});
$('#btn-login-blur').on('click', function(e) {
$('body').attr('class', 'login-layout blur-login');
$('#id-text2').attr('class', 'white');
$('#id-company-text').attr('class', 'light-blue');
e.preventDefault();
});
});
jQuery(document).ready(function($) {
$(document).ready(function() {
$('.lab-slide-up').find('a').attr('data-toggle', 'modal');
$('.lab-slide-up').find('a').attr('data-target', '#lab-slide-bottom-popup');
});
$(document).ready(function(){
$('#login_form').submit(function(){
$.ajax({ //requisição para buscar os dados
url : 'check_login.php', //nome do script que fará a consulta
dataType: 'json', //tipo de requsição Ajax
async : false,
data : $('#login_form').serialize(),
type : 'POST',
success : function(data){ //função executada ao finalizar o processamento da requisição
$('#retorno').html(data.mensagem);
if(data.status == true){
$('#sucessoLogin').show(),
window.location.href='index.php';
}else{
$('#falhaLogin').show();
}
}
});
return false;
});
});
});
</script>
</body>
</html>
Código da página check_login.php :
<?php
session_start();
define('TENTATIVA_LOGIN', 5);
define('TEMPO_BLOQUEIO', 30);
require ("conexao.php");
$pdo = conectar();
if (isset($_SERVER['HTTP_REFERER']) && $_SERVER['HTTP_REFERER'] != "http://localhost:8080/Metta/html/login.php"):
echo "<script>alert('A requisição não foi através pelo formulário de login');</script>";
echo "<script>window.history.back();</script>";
exit();
endif;
$email = $_POST['email_form'];
$email = filter_var($email, FILTER_SANITIZE_EMAIL);
$senha = trim(strip_tags($_POST['senha_form'])); 'cost' => 10,
'salt' => mcrypt_create_iv(22, MCRYPT_DEV_URANDOM),
];
$buscaSQL = $pdo->prepare('SELECT email FROM tbl_usuario WHERE email = ?');
$buscaSQL->execute(array($email));if($buscaSQL->rowCount() <= 0):
$retorno['status'] = false;
exit;
endif;
$searchSQL = $pdo->prepare('SELECT email,senha FROM tbl_usuario WHERE email = ?');
$searchSQL->execute(array($email));
$linha = $searchSQL->fetch(PDO::FETCH_ASSOC);
$hashDB = $linha['senha'];if (!(password_verify($senha , $hashDB))):
$retorno['status'] = false;
exit;else:
$retorno['status'] = true;
$resultSQL = $pdo->prepare("SELECT * FROM tbl_usuario WHERE email = ? && senha = ?");
$resultSQL->execute(array($email , $hashDB));
$row = $resultSQL->fetch(PDO::FETCH_ASSOC);
$_SESSION['login'] = $email;
$_SESSION['cod_usuario'] = $row['cod_usuario'];
$_SESSION['nome'] = $row['nome'];
$_SESSION['tipo'] = $row['tipo'];
$_SESSION['permissoes'] = $row['permissoes'];
$_SESSION['img'] = $row['img'];
$_SESSION['link_box'] = $row['link_box'];
$_SESSION['fk_empresa'] = $row['fk_empresa'];
$_SESSION["logado"] = TRUE;
endif;
echo json_encode($retorno);
?>Discussão (0)
Carregando comentários...