Web page HTML login registration PHP+MySQL implementation

Introduction

The database principle course is too boring. . So I wanted to do something. Just make a gadget to log in and register with a database.
The following points are involved in the knowledge, the first three are not the focus, mainly the database:

  1. HTML form
  2. CSS
  3. PHP

  4. The part of the SQL verification code does not need to be delved into, here is just for installation, due to the brief design, SQL injection and password encryption have not been considered

Effect preview

The login and registration pages can jump to each other. After the login is successful, it will display "Login Successfully", and if it fails, re-enter
Insert picture description here
Insert picture description here

Code

  1. Implementation of database tables
--  userforP 的数据库结构
DROP DATABASE IF EXISTS `userforP`;
CREATE DATABASE IF NOT EXISTS `userforP` /*!40100 DEFAULT CHARACTER SET utf8 COLLATE utf8_bin */;
USE `userforP`;

--   表 userforP.userforP 结构
DROP TABLE IF EXISTS `userforP`;
CREATE TABLE IF NOT EXISTS `userforP` (
  `Uname` int(11) NOT NULL COMMENT '用户名',
  `Upassword` int(11) NOT NULL COMMENT '密码',
  `Ulogtimes` int(10) unsigned zerofill NOT NULL COMMENT '密码错误次数',
  PRIMARY KEY (`Uname`,`Upassword`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8;

  1. Login database verification
<?php 
/**
* 登录验证
*/

$dbhost = "localhost";
$charset = 'utf8';
$dbname = "userforP";	//数据库名称
$dbuser = "Admin2";		//数据库用户名
$dbpass = "123456789";	//数据库密码
$tbname = 'userforP'; 	//表格名
$name=$_POST['name'];  
$password=$_POST['password'];  

try
{
    
    
	$conn = new PDO("mysql:host=$dbhost;dbname=$dbname;charset=$charset", $dbuser, $dbpass);
	$sql = "SELECT * FROM userforP where Uname='$name'and Upassword='$password'";
	
	if ( $query = $conn->query($sql) ) 
	{
    
    
		if($query->rowCount()<1)	//如果数据库中找不到对应数据
		{
    
    
			echo"<script type='text/javascript'>alert('账号或密码错误'); location='sign.php';</script>";  
		}
		else
		{
    
    	
	//增加密码错误后错误次数和锁定功能
	//登录成功后错误次数归零,跳转到对应页面
			$reset="UPDATE userforP.userforP SET Ulogtimes=0 WHERE Uname = '$name'";
			$stmt = $conn->prepare($reset);
			$count = $stmt->execute();//执行预处理语句
			echo"<script type='text/javascript'>alert('登陆成功');location='logok.html';</script>";  
		}
	}
	else
	{
    
    
		echo "Query failed\n";
	}
	$conn = null; // 关闭连接
}
catch(PDOException $e)
{
    
    
	echo $e->getMessage();
}

?>
  1. Register-insert database
<?php 
/**
* 注册信息验证
*/
session_start();
if($_SESSION["validcode"] != $_POST['codeNum'])
{
    
    
	echo"<script type='text/javascript'>alert('验证码错误,登陆失败!'); location='register.php';</script>";  
}
else
{
    
    
	$user=$_POST['user'];
	$pass=$_POST['pass'];
	$confirm=$_POST['confirm'];
	$dbhost = "localhost";
	$charset = 'utf8';
	$dbname = "userforP";	//数据库名称
	$dbuser = "Admin2";		//数据库用户名
	$dbpass = "123456789";	//数据库密码
	$tbname = 'userforP'; 	//表格名
	if($pass!=$confirm)
	{
    
        
		echo "<script>alert('两次输入密码不一致!');location='register.php';</script>";
	}
	else
	{
    
    	
		try
		{
    
    
			$conn = new PDO("mysql:host=$dbhost;dbname=$dbname;charset=$charset", $dbuser, $dbpass);
			$sql = "INSERT INTO userforP.userforP(Uname,Upassword) VALUES(?,?)";
			$stmt = $conn->prepare($sql);			
			$stmt->bindValue(1,$user);//绑定参数
			$stmt->bindValue(2,$pass);
			$count = $stmt->execute();//执行预处理语句
			if($count<>0)
			{
    
    
				echo"<script type='text/javascript'>alert('注册成功');location='logok.html';</script>";  
			}
			else
			{
    
    
				echo"<script type='text/javascript'>alert('注册失败,请使用其它用户名'); location='register.php';</script>";  
			}
			$stmt = null;//释放
			$conn = null; // 关闭连接
		}
		catch(PDOException $e)
		{
    
    
			echo $e->getMessage();	
		}
	}
}	
?>

  1. Login page
    sign.php
<?php
session_start();
header("Content-Type:text/html;charset=utf-8");
?>
<html>
	<head>
		<meta  charset="utf-8">
		<title>登录</title>
		<link href="C.css" rel="stylesheet" type="text/css" />
	</head>
 <body>
		<div class="box"> 
		<h2>登录</h2>
		<form action="check.php" method="post" enctype="multipart/form-data">
			<div class="inputBox">
				<input type="text" name="name" value="" required="required" placeholder=
					"           请输入您的学号" pattern="[0-9]{13}" title="学号为13为数字"><label>学号</label></div>
			<div class="inputBox">
				<input type="password" name="password" value=""	required="required" placeholder=
					"           请输入您的密码"><label>密码</label></div>
					
			<input type="submit" name="submit" value="登录">
			<input type="button" onclick="window.location.href='register.php'" name="submit" value="注册" >			
					
		</form>
		</div>
	</body>
</html>

  1. registration page
<?php
header("Content-Type:text/html;charset=utf-8");
?>
<html>
	<head>
		<meta charset="utf-8">
		<title>注册</title>
		<link href="C.css" rel="stylesheet" type="text/css" />
	</head>
 <body>
		<div class="box"> 
		<h2>注册</h2>
		<!--将用户输入的user,和pass提交到login.php-->
		<form action="checkregister.php" method="post" enctype="multipart/form-data">
			<div class="inputBox"><input type="text" name="user" value="" required="required"
				placeholder=   "            请输入您的学号" pattern="[0-9]{13}" title="学号为13为数字"><label>学号</label></div>
			<div class="inputBox"><input type="password" name="pass" value=""required="required"
				placeholder="            请输入您的密码"><label>密码</label></div>
			<div class="inputBox"><input type="password" name="confirm" value=""required="required"
				placeholder="            请重复您的密码"><label>确认密码</label></div>
			<div class="inputBox"><input type="text" value="" name="codeNum" required="required"
				placeholder="            请输入验证码" pattern="[0-9]{4}"  title="验证码为4个数字"><label>验证码</label></div>
			<input type="submit" name="submit" value="确认注册">
			<input type="button" onclick="window.location.href='sign.php'" value="返回登陆">
			<img src="vericode.php" style="width:100px;height:25px;" id="code"/>
		</form>
		</div>
	</body>
</html>


to sum up

Please go to Github to download the complete code for free
.

reference

  • PHP Chinese Network
  • Introduction to Database-Wang Shan
  • https://blog.csdn.net/Misaka_0/article/details/79313294

Guess you like

Origin blog.csdn.net/weixin_43031092/article/details/106316064