我想在页面用ajax向服务器post数据,如果用户名密码正确,就登录成功,进行跳转。如果不正确,就返回一个json回页面,然后登陆界面给出提示
(就像.com这样的)
我的做法是,服务器验证正确了,也返回json给页面,由js进行跳转,但是不成功,页面没有登录!
用js写cookie,然后跳转。如果是session就不懂了
首先
我观察到的是SF这样的并不算是ajax登录吧,你可以用chrome看看,SF登录的时候并没有使用Ajax
<form action="/api/user/login" method="POST" role="form" class="mt30">
只不过,SF在每个页面都加了一个modal
<div class="modal-dialog modal-lg">
要实现SF这种很简单,
提交表单(post) --> 处理(/api/user/login) --> 跳转 (redirect->back())
思路大概就是这样。
其次
我的做法是,服务器验证正确了,也返回json给页面,由js进行跳转,但是不成功,页面没有登录
你已经解决问题了。
Target code can write as follows:
front end:
$.post('http://www.demo.com/sign_in',{username:username,password:password},function(callback){
if(callback.status){
location.href='http://www.demo.com'
}else{
alert(callback.msg);
}
},'json')//maybe you haven't append "json" parameter that lead to the ajax error
back end:
<?php
$callback=array(
'status'=>false,
'msg'=>'username can not match the password,please retype your password and username'
);
$check_login;//boolean,check whether username matches the password or not
if($check_login){
$callback=array(
'status'=>true
}
echo json_encode($callback);
?>
用户名和密码的验证都是后端验证的,这毋庸置疑。
而且,用户登录状态也是要后端设置的,查询数据库后,用户名和密码正确,则在session中存储一个uuid
,每个页面需要根据登录状态判断展示相应的内容时,则判断是否有uuid这个session,且uuid不为空。比如头部的登录按钮,在未登录状态是显示登录按钮,在登录后显示用户名和头像,这些都是判断是否有uuid这个值(具体实现里,相对来说更复杂一些)。
我们再来理下这个步骤:
1. 向后端ajax发送用户名和密码
2. 后端接收到用户名和密码后,查询数据库
2.1 若查询失败,则返回一个json数据,如:{"status":"-1", msg:"用户名或密码不正确"}
2.2 若查询成功,则在session中存储一个值,比如uuid,然后向前端返回一个json,比如:{"status":"0", msg:"success"}
3.前端js接收到返回的数据后,判断status
的值,若status==0,则使用window.location.href
进行跳转;其他的状态码都是登录失败,清空密码框,让用户重新输入。
4.比如登录成功跳转到首页,首页里的php或java,需要判断session里是否有uuid:
html
<nav> <?php if(isset($_SESSION['uuid']) && !empty($_SESSION['uuid'])):; ?> <!-- 若存在uuid,则不为空,则表示已经登录 --> <a href="#">蚊子</a> <?php else ?> <!-- 没有登录 --> <input type="button" value="登录" /> <?php endif; ?> </nav>