基于ThinkPHP3.23的简单ajax登陆案例
本文将给小伙伴们做一个基于ThinkPHP3.2.的简单ajax登陆demo。闲话不多说。直接进入正文吧。
可能有些小伙伴认为TP自带的跳转页面挺好，但是站在网站安全的角度来说，我们不应该让会员看到任何错误信息，或者可以暴露网站服务端信息的内容。TP的那个跳转页面太经典了。稍微了解框架的人看到那个页面，就知道你的网站是基于哪个框架构建的了。然后就对症下药开始找你站上的漏洞了。
在TP官网的讨论区看到不少小伙伴在使用TP3.2的ajax的时候遇到各种小问题，尝试着回答了几个，但是力不从心，发帖的人实在是有点多，所以呢，就简单的写一个demo吧。希望对小伙伴们有帮助。
这里,我们以TP3.23完整版为例，只修改"URL_MODE"为重写模式(完全是个人习惯,勿喷
)，其他的保持默认即可。
第一步:我们先创建一个控制器:LoginController.class.php并定义视图。
namespace HomeController;
use ThinkController;
class LoginController extends Controller{
public function index(){
$this->display();
}
}
第二步:创建视图文件View/Login/index.html。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Ajax登陆演示</title> <script src="http://cdn.bootcss.com/jquery/1.10.1/jquery.min.js"></script> </head> <body> <<fieldset> <legend>登陆演示表单</legend> <input type="text" name="uname" id="uname"><br> <input type="password" name="upwd" id="upwd"><br> <input type="submit" value="登陆" id="checkLogin"> </fieldset> </body> </html>
不知道大家注意到没有,我并没有写<form>标签，由于我们是ajax提交，所以这里的<form>标签留空，提交地址可以通过javascript指定。
第三步:接下来我们需要通过js做一个简单的表单验证，然后通过ajax提交到指定的url地址，并且通过接收返回来的值而执行不同的操作，具体代码如下，必要的地方我都有注释哦。
<script type="text/javascript">
$(function(){
$("#checkLogin").click(function(){
var $unameVal = $.trim($("#uname").val());
var $upwdVal = $.trim($("#upwd").val());
//如果没有填写数据,则直接返回false.不执行ajax提交操作
if($unameVal == "" || $upwdVal == ""){
alert("请输入用户民和密码");
return false;
}
/*
$.post(url,parameters,callback);
url : post提交的服务器端资源地址。
parameters: 需要传递到服务器端的参数。 参数形式为“键/值”。
callback : 在请求完成时被调用,这里我们通过$data来接收服务器返回的数据
*/
$.post("{:U("Login/checkLogin")}", {uname : $unameVal,upwd : $upwdVal},function($data) {
alert($data.info);
if($data.status == 1){
location.href = $data.url;
}else{
$("#uname").reset();
$("#upwd").reset();
}
});
});
});
</script>
第四步:我们在LoginController.class.php中定义一个方法checkLogin()方法用来处理post过来的数据,并返回。
/*
* @param $uname string 接收到的用户名
* @param $upwd string 接收到的密码
* @return $data array 验证结果
* @author uctoo<uctoo@foxmail.com>
*/
public function checkLogin($uname,$upwd){
$data = array();
if(!empty($uname) && !empty($upwd)){
//1.这里的业务逻辑,小伙伴们自由发挥.我呢就简单的处理一下.只要接收到数据不为空,就表示成功.
//2.如果你觉得拼装数组比较麻烦,那么你可以将$this->success()或者$this->error中的第三个参数定义为true,即可返回json数据.例如:$this->success("登陆成功",U("User/index"),true).
//3.我个人倾向于拼装数组,主要原因是自己拼装的数组数据结构比较明了,方便阅读.
$data["status"] = 1;
$data["info"] = "登陆成功";
$data["url"] = U("User/index");
}else{
$data["status"] = 0;
$data["info"] = "用户名和密码不能为空";
$data["url"] = U("Login/index");
}
//通过ajaxReturn()方法返回我们之前生成的数组
$this->ajaxReturn($data);
}
附效果图一张:
好啦,尽情折腾吧。
声明：该文观点仅代表作者本人，牛骨文系教育信息发布平台，牛骨文仅提供信息存储空间服务。
- 上一篇： 设置PHP最长运行时间
- 下一篇： thinkphp3.2 ajax 提交返回数据
