HTML+MYSQL+PHP搭建带有cookie的登陆页面

这周学长给我们布置了新任务，要让我们在一周内搭建一个带有cookie的登陆界面，任务很轻松（才怪），几经波折之后终于弄好了（呜呜呜~），下面总结一下过程。

在本地搭建一个带有cookie的登陆注册界面需要以下步骤：

创建数据库
登陆界面
注册界面

大致需要以下PHP文件：
在这里插入图片描述
- 使用phpstudy 自带的mysql 创建数据库

在localhost 点击箭头新建数据库命名为 mysql
在这里插入图片描述
然后在新建数据库中新建一个表，命名为 user，添加新字段，username 和 password ；内容可以先空着

- 使用HTML编写登陆界面
总流程如下：
在这里插入图片描述
login.php；代码如下：

 <!DOCTYPE html>
 <html lang='zh'>
 <head>
 <title> login</title>
 <meta charset="UTF-8">
<style>
	body{
		background-image:url('325151.jpg');
		font-size:30px;//字体大小
	}
	.main{
		position:absolute;//全局变量
		top:35%;
		left:45%;
	}

	input{
		width:250px;
		height:30px;
		text-align:left;
		color:blue;
	}
	.sub{
		width:125px;
		height:30px;
	}
	button{
		width:125px;
		height:30px;
		text-align:left;
	}
</style>
</head>
 <body>  
<div class="main">
<form name="input" action="post.php" method="post">
用户名 ：<br /><input type="text" name="username"><br>
密码 ：  <br /><input type="password" name="password"> <br>
             <input type="submit" value="登陆" class="sub">
		     <button><a href="reg.php">注册</a></button>
		
</form>
</div>
</body> 
</html>

界面如下：
在这里插入图片描述
- 登陆验证：
post.php;代码如下

<?php

       $conn=mysql_connect("localhost",'root','root') or die("数据库连接失败！");//连接你的本地数据库
       localhost为服务器 root为用户名 root为密码

       mysql_select_db('myphp',$conn) or die("您要选择的数据库不存在");//选择你建立的数据表

       $name=$_POST['username'];

       $pwd=$_POST['password'];//获取表单提交的内容用两个变量来存post方式接受的值

       $sql="select * from user where username='$name' and password='$pwd'";//查询语句

       $query=mysql_query($sql);//函数执行一条 MySQL 查询。

       $arr=mysql_fetch_array($query);然后从$query中取一行数字数组

       if(is_array($arr)){//对$arr进行判断
		   
			  setcookie('username',$name,time()+3600);//设置cookie,时间为一小时，（以秒为单位）
              header("Location:index.php");//跳转页面

       }else{

              echo "您的用户名或密码输入有误，<a href=\"login.php\">请重新登录！</a>";

       }

?>

实现注册总流程：
在这里插入图片描述

-注册页面
在这里插入图片描述
reg.php;代码如下：

 <!DOCTYPE html>
    <html >
    <head>
    <title> 注册</title>
    <meta charset="UTF-8">
	<style>
	body{
		background-image:url('323971.jpg');
		background-repeat:no-repeat;
		font-size:30px;
	}
	.main{
		position:absolute;
		top:35%;
		left:45%;
	}

	input{
		text-align:center;
		width:250px;
		height:30px;
		text-align:left;
		color:green;
	}
	.sub{
		width:125px;
		height:30px;
	}
    </style>
    </head>
    <body>  
<div class="main">
<form name="input" action="regin.php" method="post">
用户名<br/><input type="text" name="username"><br>
密码  <br/><input type="password" name="password"> <br>
           <input type="submit" value="注册" class="sub">
    </body>
	</div>
    </html>

regin.php ; 注册验证：

 <?php
     $conn=mysql_connect("localhost",'root','root') or die("数据库连接失败！");

           mysql_select_db('myphp',$conn) or die("您要选择的数据库不存在");
     $name=trim($_POST['username']);
	//trim函数，过滤空格，如果不加，我们在用户名后面添加很多空格，提交表单，打开firebug
	//调试工具，我们可以到输入的用户名后面会有很多空格，使用trim函数，我们可以把表单中空格给过滤掉
	 $password=$_POST['password'];
	 $sql = "select * from user where username='$name'";
	 $info = mysql_query($sql);
	 $res = mysql_num_rows($info);
	if(empty($name)){
		echo "<script>alert('用户名不能为空');location.href='reg.php';</script>";
	}else if(empty($password)){
		echo "<script>alert('密码不能为空');location.href='reg.php';</script>";
	}else{	
		if($res){
			echo "<script>alert('用户名已存在');location.href='reg.php';</script>";
		}else{
			$sql1 ="insert into user(username,password) values('".$name."','" .($password)."')";
			$result = mysql_query($sql1);
			if($result){
		 			echo "<script>alert('注册成功')</script>",header("Location:login.php");;
			}else{
		 			echo "<script>alert('注册失败')</script>";
			}
		}
}	
?>

- 登陆成功界面
在这里插入图片描述
代码如下：

 <?php
	if(!isset($_COOKIE['username']))//对跳转方式判断，阻止直接跳转；
	{
		echo '登录非法!<a href="login.php">请登录</a>';
		exit();
	}
 ?>
 <!DOCTYPE html>
    <html >
    <head>
    <title> welcome! </title>
    <meta charset="UTF-8">
    </head>
    <body>  
   Hello 靓仔!
   <a href="logout.php">注销</a>//点击“ 注销 ”跳转页面
    </body>
    </html>

- 注销 cookie
logout.php:
代码如下：

<?php
	if(isset($_COOKIE['username'])){
		setcookie('username',$name,time()-1);//清除cookie 将时间设置为负数
		header('Location:login.php');
	}
	else{
		echo '注销失败';
		header('Location:index.php');
	}
?>