PHP世纪论坛

 找回密码
 立即注册
搜索
查看: 289|回复: 0

thinkphp 页面跳转 和 AJAX 应用 登录实例

[复制链接]

12

主题

12

帖子

108

积分

版主

Rank: 7Rank: 7Rank: 7

积分
108
发表于 2016-9-23 18:37:52 | 显示全部楼层 |阅读模式
基于ThinkPHP3.23的简单ajax登陆案例
2015-12-28 16:09 355人阅读 评论(0) 收藏 举报
分类:PHP
版权声明:本文为博主原创文章,未经博主允许不得转载。
本文将给小伙伴们做一个基于ThinkPHP3.2.的简单ajax登陆demo。闲话不多说。直接进入正文吧。

可能有些小伙伴认为TP自带的跳转页面挺好,但是站在网站安全的角度来说,我们不应该让会员看到任何错误信息,或者可以暴露网站服务端信息的内容。TP的那个跳转页面太经典了。稍微了解框架的人看到那个页面,就知道你的网站是基于哪个框架构建的了。然后就对症下药开始找你站上的漏洞了。

在TP官网的讨论区看到不少小伙伴在使用TP3.2的ajax的时候遇到各种小问题,尝试着回答了几个,但是力不从心,发帖的人实在是有点多,所以呢,就简单的写一个demo吧。希望对小伙伴们有帮助。

这里,我们以TP3.23完整版为例,只修改'URL_MODE'为重写模式(完全是个人习惯,勿喷),其他的保持默认即可。
第一步:我们先创建一个控制器oginController.class.php并定义视图。

[php] view plain copy
namespace Home\Controller;  
    use Think\Controller;  
  
    class LoginController extends Controller{  
  
        public function  index(){  
  
            $this->display();  
        }  
    }  

第二步:创建视图文件View/Login/index.html。

[html] view plain copy
<!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地址,并且通过接收返回来的值而执行不同的操作,具体代码如下,必要的地方我都有注释哦。
[javascript] view plain copy
<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过来的数据,并返回。
[php] view plain copy
/*
* @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);  
}  

附效果图一张:

好啦,尽情折腾吧。



来源: http://blog.csdn.net/uctoo_cc/article/details/50419674
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

手机版|PHP世纪论坛 ( 豫ICP备15004666号-2 )

GMT+8, 2018-1-19 23:31

Powered by Discuz! X3.4

© 2001-2017 Comsenz Inc.

快速回复 返回顶部 返回列表