简单的注册登录页面
2017-01-05 23:02
525 查看
1、register.html 用户注册页面表单
<html>
<head>
<meta charset="UTF-8">
<title>注册页面</title>
<script type="text/javascript">
function checkForm(){
var username = document.getElementById("username");
var password = document.getElementById("password");
if(username.value == ""){
alert("请输入用户名！");
username.focus();
return;
}
if(password.value == ""){
alert("请输入密码！");
password.focus();
return;
}
if(email.value == ""){
alert("请输入邮箱地址！");
email.focus();
return;
}
return true;
}
</script>
</head>
<
4000
;body>
<form action="register.php" method="post">
<table width="250" bgcolor="#ccffcc" style="border-color" border="0">
<tr align="center">
<td>用户名</td><td><input type="text" name="username" id="username"></td>
</tr>
<tr align="center">
<td>密 码</td><td><input type="password" name="password" id="password"></td>
</tr>
<tr>
<td></td>
</tr>
<tr align="center">
<td>邮 箱</td><td><input type="text" name="email" id="email"></td>
</tr>
<tr><td align="right"><img src="captcha.php"></td></tr>
<tr align="center">
<td>验证码</td><td><input type="text" name="authcode"></td>
</tr>
<tr align="center">
<td colspan="2"><input type="submit" name="submit" value="注册" onclick="checkForm();" /><input type="reset" value="重置" /></td>
</tr>
</table>
</form>
</body>
</html>
2、register.php 注册验证
<?php
include 'config.php';
if(!isset($_POST['submit'])){
exit('非法访问！');
}
$username = $_POST['username'];
$password = $_POST['password'];
$email = $_POST['email'];
//注册信息判断
if(!preg_match('/^[\w\x80-\xff]{3,15}$/',$username)){
exit('用户名不符合规定！<a href="javascript:history.back(-1);">返回</a>');
}
if(strlen($password)<6){
exit('密码要大于6位数！<a href="javascript:history.back(-1);">返回</a>');
}
if(!preg_match('/\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*/',$email)){
exit('邮件格式错误！<a href="javascript:history.back(-1);">返回</a>');
}
//检查用户名是否存在
$check_query = $mysqli->query("select uid from user_list where username='$username' limit 1");
if($check_query->fetch_array()){
echo '用户名：'.$username.'已存在！<a href="javascript:history.back(-1);">返回</a>';
exit();
}
if(isset($_REQUEST['authcode'])){
if(!(strtolower($_REQUEST['authcode'])==strtolower($_SESSION['authcode']))){
echo '<font color="#CC0000"><b>验证码错误！</font>';
exit;
}
}else{
echo "<script>alert('请输入验证码！');location.href='register.html';</script>";
}
$password = MD5($password.ALL_PS);
$date = date('Y-m-d');
$sql = "insert into user_list(email,username,password,date) values('$email','$username','$password','$date')";
echo $sql;
if($mysqli->query($sql)){
exit('用户注册成功！点击此处<a href="login.html">登陆</a>');
}else{
echo "注册失败！";
echo '点击此处<a href="javascript:history.back(-1);">返回</a>重试';
}
?>
3、login.html 登录前台界面
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>用户登陆</title>
<style type="text/css">
html{font-size:12px;}
div{bgcolor:#ccffcc;}
fieldset{width:520px;margin:0 auto;}
legend{font-weight:bold;font-size:14px;}
label{float:left;width:70px;margin-left:10px;}
.left{margin-left:80px;}
.input{width:150px;}
span{color:#666666;}
p
</style>
<script>
function InputCheck(LoginForm){
if(LoginForm.username.value == ""){
alert("请输入用户名！");
LoginForm.username.focus();
return false;
}
if(LoginForm.password.value == ""){
alert("请输入密码！");
LoginForm.password.focus();
return false;
}
}
</script>
</head>
<body>
<div>
<fieldset>
<legend>用户登陆</legend>
<form name="LoginForm" method="post" action="login.php" onSubmit="return InputCheck(this)">
<p>
<label for="username" class="label">用户名：</label>
<input id="username" name="username" type="text" class="input" />
</p>
<p>
<label for="password" class="label">密 码：</label>
<input id="password" name="password" type="password" class="input" />
</p>
<p><img src="captcha.php"></p>
<p>
<label for="captcha" class="label">验证码：</label>
<input id="captcha" name="authcode" type="text" class="input" />
</p>
<p>
<input type="submit" name="submit" value="登陆" class="left" /> <a href="register.php">注册</a>
</p>
</form>
</fieldset>
</div>
</body>
</html>
4、login.php 登录验证
<?php
include 'config.php';
//注销登陆
if(@$_GET['action']=="logout"){
unset($_SESSION['userid']);
unset($_SESSION['username']);
echo "<script>alert('注销登陆成功！');location.href='login.html';</script>";
}
if(@$_POST['submit']){
//用户名空格的过滤
$username = str_replace(" ","",$_POST['username']);
$sql = "SELECT * FROM user_list WHERE `username` = '$username'";
$query = $mysqli->query($sql);
//is_array判断是否存在数组
$query_result = is_array($row=$query->fetch_array());
$result = $query_result ? md5($_POST['password'].ALL_PS) == $row['password'] : False;
$username = htmlspecialchars($_POST['username']);
$password = MD5($_POST['password']);
if($result){
$_SESSION['uid'] = $row['uid'];
$_SESSION['username'] = $row['username'];
$_SESSION['date'] = $row['date'];
$_SESSION['user_shell'] = md5($row['username'].$row['password'].ALL_PS);
if(isset($_REQUEST['authcode'])){
if(strtolower($_REQUEST['authcode'])==strtolower($_SESSION['authcode'])){
echo $username.',欢迎你！进入<a href="my.php">用户中心</a><br />';
}else {
echo '<font color="#CC0000"><b>验证码错误！</font>';
}
}else{
echo '<font color="#CC0000"><b>请输入验证码！</font>';
exit;
}
}else{
echo "<script>alert('登陆失败！');location.href='login.html';</script>";
}
}
?>
5、config.php 连接数据库
6、my.php 后台个人简易界面信息
7、captcha.php 验证码界面
<?php
//
session_start();//通过session保存数据，必须处于脚本最顶部
//创建一个宽为100，高为30的图片
$image = imagecreatetruecolor(100,30);
//设置背景颜色为白色
$bgcolor = imagecolorallocate($image,255,255,255);
//在图像$image坐标0,0处开始填充背景颜色
imagefill($image, 0 ,0, $bgcolor);
$captch_code='';
for($i=0;$i<4;$i++){
//设置字体大小
$fontsize = 7;
//设置字体颜色
$fontcolor = imagecolorallocate($image,rand(0,120),rand(0,120),rand(0,120));
$date = 'abcdefghijkmnopqrstuvwxyABCDEFGHIJKLMNOPQRSTUVWXYZ3456789';
//strlen获取字符串长度，substr返回指定位置的字符，若位置为负数则从尾部的1开始，为正数则从首处的0开始
$fontcontent = substr($date,rand(0,strlen($date)),1);
//依次将取得的字符赋给左边的变量，用连接符连接起来
$captch_code.=$fontcontent;
//给验证码设置相应的位置
$x = ($i*100/4)+rand(5,10);
$y = rand(5,10);
//imagestring的作用是用颜色$fontcolor将字符$fontcontent画在图片$image上的坐标$x,$y处，
//$fontsize在1-5之内时使用内置字体
imagestring($image,$fontsize,$x,$y,$fontcontent,$fontcolor);
}
//将循环得到的验证码字符串赋给session来保存
$_SESSION['authcode']=$captch_code;
//添加干扰点
for($i=0;$i<200;$i++){
//用循环迭代出小不同颜色的小点
//小点的颜色
$pointcolor = imagecolorallocate($image,rand(50,200),rand(50,200),rand(50,200));
//干扰点在图片$image的相应位置及颜色
imagesetpixel($image,rand(1,99),rand(1,29),$pointcolor);
}
//添加干扰线
for($i=0;$i<3;$i++){
$linecolor = imagecolorallocate($image,rand(80,220),rand(80,220),rand(80,220));
imageline($image,rand(1,99),rand(1,29),rand(1,99),rand(1,29),$linecolor);
}
//清空输出缓冲区，如果缺少很可能会导致无法正常输出图片
ob_clean();
//输出图片
header('content-type: image/png');
//进行相应的编码转换
imagepng($image);
?>
<html>
<head>
<meta charset="UTF-8">
<title>注册页面</title>
<script type="text/javascript">
function checkForm(){
var username = document.getElementById("username");
var password = document.getElementById("password");
if(username.value == ""){
alert("请输入用户名！");
username.focus();
return;
}
if(password.value == ""){
alert("请输入密码！");
password.focus();
return;
}
if(email.value == ""){
alert("请输入邮箱地址！");
email.focus();
return;
}
return true;
}
</script>
</head>
<
4000
;body>
<form action="register.php" method="post">
<table width="250" bgcolor="#ccffcc" style="border-color" border="0">
<tr align="center">
<td>用户名</td><td><input type="text" name="username" id="username"></td>
</tr>
<tr align="center">
<td>密 码</td><td><input type="password" name="password" id="password"></td>
</tr>
<tr>
<td></td>
</tr>
<tr align="center">
<td>邮 箱</td><td><input type="text" name="email" id="email"></td>
</tr>
<tr><td align="right"><img src="captcha.php"></td></tr>
<tr align="center">
<td>验证码</td><td><input type="text" name="authcode"></td>
</tr>
<tr align="center">
<td colspan="2"><input type="submit" name="submit" value="注册" onclick="checkForm();" /><input type="reset" value="重置" /></td>
</tr>
</table>
</form>
</body>
</html>
2、register.php 注册验证
<?php
include 'config.php';
if(!isset($_POST['submit'])){
exit('非法访问！');
}
$username = $_POST['username'];
$password = $_POST['password'];
$email = $_POST['email'];
//注册信息判断
if(!preg_match('/^[\w\x80-\xff]{3,15}$/',$username)){
exit('用户名不符合规定！<a href="javascript:history.back(-1);">返回</a>');
}
if(strlen($password)<6){
exit('密码要大于6位数！<a href="javascript:history.back(-1);">返回</a>');
}
if(!preg_match('/\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*/',$email)){
exit('邮件格式错误！<a href="javascript:history.back(-1);">返回</a>');
}
//检查用户名是否存在
$check_query = $mysqli->query("select uid from user_list where username='$username' limit 1");
if($check_query->fetch_array()){
echo '用户名：'.$username.'已存在！<a href="javascript:history.back(-1);">返回</a>';
exit();
}
if(isset($_REQUEST['authcode'])){
if(!(strtolower($_REQUEST['authcode'])==strtolower($_SESSION['authcode']))){
echo '<font color="#CC0000"><b>验证码错误！</font>';
exit;
}
}else{
echo "<script>alert('请输入验证码！');location.href='register.html';</script>";
}
$password = MD5($password.ALL_PS);
$date = date('Y-m-d');
$sql = "insert into user_list(email,username,password,date) values('$email','$username','$password','$date')";
echo $sql;
if($mysqli->query($sql)){
exit('用户注册成功！点击此处<a href="login.html">登陆</a>');
}else{
echo "注册失败！";
echo '点击此处<a href="javascript:history.back(-1);">返回</a>重试';
}
?>
3、login.html 登录前台界面
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>用户登陆</title>
<style type="text/css">
html{font-size:12px;}
div{bgcolor:#ccffcc;}
fieldset{width:520px;margin:0 auto;}
legend{font-weight:bold;font-size:14px;}
label{float:left;width:70px;margin-left:10px;}
.left{margin-left:80px;}
.input{width:150px;}
span{color:#666666;}
p
</style>
<script>
function InputCheck(LoginForm){
if(LoginForm.username.value == ""){
alert("请输入用户名！");
LoginForm.username.focus();
return false;
}
if(LoginForm.password.value == ""){
alert("请输入密码！");
LoginForm.password.focus();
return false;
}
}
</script>
</head>
<body>
<div>
<fieldset>
<legend>用户登陆</legend>
<form name="LoginForm" method="post" action="login.php" onSubmit="return InputCheck(this)">
<p>
<label for="username" class="label">用户名：</label>
<input id="username" name="username" type="text" class="input" />
</p>
<p>
<label for="password" class="label">密 码：</label>
<input id="password" name="password" type="password" class="input" />
</p>
<p><img src="captcha.php"></p>
<p>
<label for="captcha" class="label">验证码：</label>
<input id="captcha" name="authcode" type="text" class="input" />
</p>
<p>
<input type="submit" name="submit" value="登陆" class="left" /> <a href="register.php">注册</a>
</p>
</form>
</fieldset>
</div>
</body>
</html>
4、login.php 登录验证
<?php
include 'config.php';
//注销登陆
if(@$_GET['action']=="logout"){
unset($_SESSION['userid']);
unset($_SESSION['username']);
echo "<script>alert('注销登陆成功！');location.href='login.html';</script>";
}
if(@$_POST['submit']){
//用户名空格的过滤
$username = str_replace(" ","",$_POST['username']);
$sql = "SELECT * FROM user_list WHERE `username` = '$username'";
$query = $mysqli->query($sql);
//is_array判断是否存在数组
$query_result = is_array($row=$query->fetch_array());
$result = $query_result ? md5($_POST['password'].ALL_PS) == $row['password'] : False;
$username = htmlspecialchars($_POST['username']);
$password = MD5($_POST['password']);
if($result){
$_SESSION['uid'] = $row['uid'];
$_SESSION['username'] = $row['username'];
$_SESSION['date'] = $row['date'];
$_SESSION['user_shell'] = md5($row['username'].$row['password'].ALL_PS);
if(isset($_REQUEST['authcode'])){
if(strtolower($_REQUEST['authcode'])==strtolower($_SESSION['authcode'])){
echo $username.',欢迎你！进入<a href="my.php">用户中心</a><br />';
}else {
echo '<font color="#CC0000"><b>验证码错误！</font>';
}
}else{
echo '<font color="#CC0000"><b>请输入验证码！</font>';
exit;
}
}else{
echo "<script>alert('登陆失败！');location.href='login.html';</script>";
}
}
?>
5、config.php 连接数据库
<?php
session_start();
//数据库连接
$mysqli = new mysqli("localhost","root","070423","php100") or die('连接失败！');
$mysqli->set_charset('utf8');
//定义常量
@define(ALL_PS,"PHP100");
?>6、my.php 后台个人简易界面信息
<?php
include 'config.php';
//检测是否登陆，若没登陆则转向登陆界面
if(!isset($_SESSION['uid'])){
header("Location:login.html");
exit();
}
$uid = $_SESSION['uid'];
$username = $_SESSION['username'];
$date = $_SESSION['date'];
$user_query = $mysqli->query("select * from user_list where uid=$uid limit 1");
$row = $user_query->fetch_array();
echo '用户信息：<br />';
echo '用户ID：'.$uid.'<br />';
echo '用户名：'.$username.'<br />';
echo '注册日期：'.$date.'<br />';
echo '<a href="login.php?action=logout">注销</a>登陆<br />';
?>7、captcha.php 验证码界面
<?php
//
session_start();//通过session保存数据，必须处于脚本最顶部
//创建一个宽为100，高为30的图片
$image = imagecreatetruecolor(100,30);
//设置背景颜色为白色
$bgcolor = imagecolorallocate($image,255,255,255);
//在图像$image坐标0,0处开始填充背景颜色
imagefill($image, 0 ,0, $bgcolor);
$captch_code='';
for($i=0;$i<4;$i++){
//设置字体大小
$fontsize = 7;
//设置字体颜色
$fontcolor = imagecolorallocate($image,rand(0,120),rand(0,120),rand(0,120));
$date = 'abcdefghijkmnopqrstuvwxyABCDEFGHIJKLMNOPQRSTUVWXYZ3456789';
//strlen获取字符串长度，substr返回指定位置的字符，若位置为负数则从尾部的1开始，为正数则从首处的0开始
$fontcontent = substr($date,rand(0,strlen($date)),1);
//依次将取得的字符赋给左边的变量，用连接符连接起来
$captch_code.=$fontcontent;
//给验证码设置相应的位置
$x = ($i*100/4)+rand(5,10);
$y = rand(5,10);
//imagestring的作用是用颜色$fontcolor将字符$fontcontent画在图片$image上的坐标$x,$y处，
//$fontsize在1-5之内时使用内置字体
imagestring($image,$fontsize,$x,$y,$fontcontent,$fontcolor);
}
//将循环得到的验证码字符串赋给session来保存
$_SESSION['authcode']=$captch_code;
//添加干扰点
for($i=0;$i<200;$i++){
//用循环迭代出小不同颜色的小点
//小点的颜色
$pointcolor = imagecolorallocate($image,rand(50,200),rand(50,200),rand(50,200));
//干扰点在图片$image的相应位置及颜色
imagesetpixel($image,rand(1,99),rand(1,29),$pointcolor);
}
//添加干扰线
for($i=0;$i<3;$i++){
$linecolor = imagecolorallocate($image,rand(80,220),rand(80,220),rand(80,220));
imageline($image,rand(1,99),rand(1,29),rand(1,99),rand(1,29),$linecolor);
}
//清空输出缓冲区，如果缺少很可能会导致无法正常输出图片
ob_clean();
//输出图片
header('content-type: image/png');
//进行相应的编码转换
imagepng($image);
?>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- 小白教程——Windows下用PHP写一个简单的登录注册页面（二）
- 简单的小清新表单登录注册页面~~
- 小白教程——Windows下用PHP写一个简单的登录注册页面（一）
- JSP作业3 - 使用JSP实现简单的用户登录注册页面
- javaWeb 简单注册登录(含数据库连接) -- （一）页面
- HTML简单登录和注册页面及input标签诠释
- Django登录、注册和修改密码简单页面实现
- android -简单注册登录页面应用
- 一个简单的注册登录页面（包括阿里大于的手机验证）html+JS+AJAX+PHP
- JavaScript 注册登录页面的简单实现
- 使用JDBC做一个简单的登录，注册页面！
- C#窗体应用程序 vs + sql server2008连接举例，简单的学生信息管理系统 补充注册页面，如有侵权，请联系本人删除
- 使用Bmob云端服务器模拟简单的注册登录
- 简单实现用户注册,登录的留言簿
- 十大打动人的注册与登录页面细节设计
- 移动端简单的登录页面
- 利用ajax在index页面自动执行方法并显示相关内容，在执行相关按钮操作（如登录注册）后返回index页面后ajax不执行，无法显示相关内容的问题解决方法之一
- 登录注册简单servlet案列
- 如何设计网站的登录注册页面
- 简单的注册页面