JSONP实现登录（pdo预处理）

<!DOCTYPE html>
<html>
<head>
    <title>登录</title>
    <meta charset="utf-8">
</head>
<body>
        <input type="text" name="username" class='username' placeholder="请输入账号">
        <span class="s1"></span>
        <br>
        <input type="password" name="password" class='password' placeholder="请输入密码">
        <span class="s2"></span>
        <br>
        <input type="submit" class="submit" value="登录">
</body>
</html>
<script src='jquery-3.3.1.min.js'></script>
<script>
    $('.submit').click(function(){
        var username = $('.username').val();
        var password = $('.password').val();
        
        if(username.length==0){
            $('.s1').html("<font color='red'>账号不能为空</font>");
            return false;
        }

        var reg = /^[a-zA-Z]{6}$/;
        if(reg.test(username)==false){
            $('.s1').html("<font color='red'>账号必须是6位数字母</font>");
            return false;
        }

        $('.s1').html("<font color='green'>检测合格</font>");

        if(password.length==0){
            $('.s2').html("<font color='red'>密码不能为空</font>");
            return false;
        }

        var pass_reg = /^\w{3,}$/;
        if(pass_reg.test(password)==false){
            $('.s2').html("<font color='red'>密码最少3位数</font>");
            return false;
        }

        $('.s2').html("<font color='green'>检测合格</font>");

        $.ajax({
            url:'login.php',
            type:'post',
            dataType:'jsonp',
            jsonpCallback:'Liyue',//处理后台返回的数据
            data:{
                username:username,
                password:password
            },
            success:function(){
                console.log('请求完成');
            }
        })

    })

    function Liyue(data){
        alert(data.msg);
    }
</script>

php代码：

<?php
header("Content-type:text/html;charset=utf-8");
//接收传值
$username = $_POST['username'];
$password = $_POST['password'];

//接收回调函数
$callback = $_GET['callback'];

$pdo = new PDO('mysql:host=127.0.0.1;dbname=1703a','root','root');
$sql = 'select * from user1 where username=? and password=?';
$query = $pdo->prepare($sql);
$query->execute([$username,$password]);
$data = $query->fetch(2);
if(empty($data)){
    $res = json_encode(['code'=>400,'msg'=>'账号密码有误','data'=>null]);
}else{
    $res = json_encode(['code'=>200,'msg'=>'登录成功','data'=>null]);
}

echo $callback.'('.$res.')';

JSONP实现登录（pdo预处理）

猜你喜欢