简单介绍一下PHP登录注册案例
数据存储于MySQL数据库
页面使用PHP+HTML搭建
一、首先我们先用代码开发工具创建一个文件夹PHP-login(记住创建在你自己的电脑集成工具的运行目录下)
二、创建一下文件夹与文件(如图所示)
接下来展示代码部分
index.php
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>PHP登录注册案例</title>
<link rel="stylesheet" href="./css/bootstrap.min.css">
<style>
body {
color: white;
padding: 20px;
background: url(./img/bg.jpg) repeat center top;
margin-top: 10%;
}
button {
margin: 10px;
}
.title {
font-size: 60px;
text-shadow: 2px 2px 3px #000000;
margin-bottom: 20px;
}
</style>
</head>
<body>
<div class="container">
<div class="col text-center title">PHP注册登录案例</div>
<button class="btn btn-primary col" onclick="location.href='./register.html'">注册</button>
<button class="btn btn-success col" onclick="location.href='./login.html'">登录</button>
</div>
</body>
</html>
register.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>注册页面</title>
</head>
<script>
function ResCheck() {
var x=document.forms["Register"]["username"].value;
if ( x == "" || x == null){
alert("用户名不能为空!");
return (false);
}
var y= document.forms["Register"]["password"].value;
if (y == "" || y == null){
alert("密码不能为空!");
return (false);
}
var z= document.forms["Register"]["password2"].value;
if ( z!=y ) {
alert("两次密码输入不一致,重新输入!");
return (false);
}
}
</script>
<body>
<div style="position: absolute; left: 25%; top: 25%;width: 1000px; margin-left:-50px; margin-top: -100px; border: 1px dashed; padding: 50px">
<div>
<form action="register.php" method="post" name="Register" onsubmit="return ResCheck()">
<div style="color:black">
<h2>用户注册</h2>
</div>
<div>
<label>用户名</label>
<div>
<input type="text" name="username" id="username" placeholder="用户名" autocomplete="off">
</div>
</div>
<br/>
<div>
<label>密码</label>
<div>
<input type="password" name="password" id="password" placeholder="密码" autocomplete="off">
</div>
</div>
<br/>
<div>
<label>确认密码</label>
<div>
<input type="password" name="password2" id="password2" placeholder="再次输入密码" autocomplete="off">
</div>
</div>
<br/>
<div>
<input type="submit" value="提交">
</div>
</form>
</div>
</div>
</body>
</html>
register.php
<?php
//数据库连接
require("connectsql.php");
//从注册页接受来的数据
$user=$_POST["username"];
$pwd=$_POST["password"];
$sql="INSERT INTO user (username,password) VALUES ('$user','$pwd')";
$select="SELECT username FROM user WHERE username='$user'";
$result=mysqli_query($conn,$select);
$row=mysqli_num_rows($result);
if(!$row){
if (mysqli_query($conn,$sql)){
echo "<script>alert('注册成功,请登录');location='login.html'</script>";
}else{
echo "<script>alert('注册失败,请重新注册');location='regsiter.html'</script>";
}
}else{
echo "<script>alert('该用户已经存在,请直接登录');location='login.html'</script>";
}
?>
login.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>注册登录</title>
</head>
<script language=JavaScript>
function InputCheck(){
var x = document.forms["Login"]["username"].value;
if ( x == "" || x == null){
alert("请输入用户名!");
return (false);
}
var y= document.forms["Login"]["password"].value;
if (y == "" || y == null){
alert("请输入密码!");
return (false);
}
}
function Regpage() {
location='register.html';
}
</script>
<body>
<div style="position: absolute; left: 50%; top: 50%;width: 500px; margin-left:-250px; margin-top: -200px">
<div style="background: #eFeFeF; padding: 20px;border-radius: 4px;box-shadow: 5px 5px 20px #444444" >
<div>
<form action="login.php" method="post" name="Login" onsubmit="return InputCheck()">
<div style="color: black">
<h2>注册登录系统</h2>
</div>
<hr>
<div>
<label>用户名</label>
<div>
<input type="text" name="username" id="username" placeholder="用户名" autocomplete="off">
</div>
</div>
<div>
<label>密 码</label>
<div>
<input type="password" name="password" id="password" placeholder="密码" autocomplete="off">
</div>
</div>
<div>
<div>
<input type="submit" value="登录">
<input type="button" name="register" id="register" value="注册" onclick="Regpage()">
</div>
</div>
</form>
</div>
</div>
</div>
</body>
</html>
login.php
<?php
//数据库连接
require("connectsql.php"); //我把连接数据库的连接代码写在connectsql.php脚本上
//从登录页接受来的数据
$name=$_POST["username"];
$pwd=$_POST["password"];
$sql="SELECT id,username,password FROM user WHERE username='$name' AND password='$pwd';";
$result=mysqli_query($conn,$sql);
$row=mysqli_num_rows($result);
if(!$row){
echo "<script>alert('密码错误,请重新输入');location='login.html'</script>";
}
else{
echo "<script>alert('登录成功');location='user.html'</script>";
}
?>
connectsql.php
<?php
// 创建连接
$conn = new mysqli("localhost", "root", "", "regitlogin", 3306);
$conn->set_charset("utf8");
// 检测连接
if ($conn->connect_error) {
die("数据库连接失败: " . $conn->connect_error);
}
?>
user.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<h1>欢迎登录成功</h1>
</body>
</html>
regitlogin.sql 数据库文件代码
-- phpMyAdmin SQL Dump
-- version 5.0.2
-- https://www.phpmyadmin.net/
--
-- 主机: 127.0.0.1:3306
-- 生成日期: 2021-09-26 02:57:47
-- 服务器版本: 5.7.31
-- PHP 版本: 7.3.21
SET SQL_MODE = "NO_AUTO_VALUE_ON_ZERO";
START TRANSACTION;
SET time_zone = "+00:00";
/*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */;
/*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */;
/*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */;
/*!40101 SET NAMES utf8mb4 */;
--
-- 数据库: `regitlogin`
--
-- --------------------------------------------------------
--
-- 表的结构 `user`
--
DROP TABLE IF EXISTS `user`;
CREATE TABLE IF NOT EXISTS `user` (
`id` mediumint(32) UNSIGNED NOT NULL AUTO_INCREMENT COMMENT 'id',
`username` varchar(255) COLLATE utf8_unicode_ci NOT NULL COMMENT '用户名',
`password` varchar(64) COLLATE utf8_unicode_ci NOT NULL COMMENT '密码',
PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=9 DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;
COMMIT;
/*!40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */;
/*!40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS */;
/*!40101 SET COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */;
数据库截图:
数据库具体操作:首先创建一个数据库名字叫做regitlogin,再创建一个数据表user,选项有id,username,password具体类型参数如下图