国强极客
有问题请加微信：guoqiang7585
国强极客

项目：个人相册 登陆/展示

项目：个人相册 登陆/展示
全国大流量卡免费领

项目文件在 全栈教程/03_php高级+mvc/6_项目_个人相册

创建数据库

1、创建数据库 php69

2、创建用户数据表 user

3、添加一条用户数据

4、创建相册数据表 photos

创建数据库完整代码

//创建数据库完整代码
//创建相册数据库php68
CREATE DATABASE IF NOT EXISTS `php68` CHARSET utf8;

//创建用户数据表user
CREATE TABLE IF NOT EXISTS `user`(
`id` int not null auto_increment primary key, #用户ID
`username` varchar(20), #用户名，长度为20个字符
`password` char(32) #密码，长度为32个字符
)ENGINE=InnoDB;

//创建相册数据表photos
CREATE TABLE IF NOT EXISTS `photos`(
`id` int not null auto_increment primary key, #相册ID
`title` varchar(20), #照片标题
`imgsrc` varchar(100), #图像路径
`intro` text, #照片简介
`hits` int not null default 0, #访问量
`addate` int(10) #发布时间
)ENGINE=InnoDB;

//往user表中插入一条记录
INSERT INTO `user`(username,password) VALUES('admin','e10adc3949ba59abbe56e057f20f883e');

用户登录功能

1、登录表单页面 login.php

<?php
//开启SESSION会话
session_start();
//产生表单验证随机字符串
$_SESSION['token'] = uniqid();
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>用户登录</title>
<style type="text/css">
/*全局样式*/
body,h2,form,a{margin:0px;padding:0px}
body{font-size:14px;color:#444;background-color:#00343f;}
a{text-decoration:none;color:#444;}
a:hover{color:red;} 
/*局部样式*/
.box{width:1000px;margin:0px auto;background-color:white;}
.title{
    text-align:center;
    padding: 10px 0px;
    border-bottom: 2px solid #444;
    background-color:#d0e9ff;
}
.title h2{font-size:36px;padding:10px;}
form{padding:30px;height:400px;}
form td{padding:8px;}
</style>
</head>
<body>
<div class="box">
<!--title-->
<div class="title">
    <h2>用户登录</h2>
    <a href="javascript:void(0)">欢迎光临，请先登录！</a>
</div><!--//title-->
<!--form-->
<form method="post" action="loginSave.php">
<table align="center" width="400">
    <tr>
        <td width="100" align="right">用户名：</td>
        <td><input type="text" name="username"></td>
    </tr>
    <tr>
        <td align="right">密&nbsp;&nbsp;&nbsp;码：</td>
        <td><input type="password" name="password"></td>
    </tr>
    <tr>
        <td align="right">验证码：</td>
        <td>
            <input style="float:left;" type="text" name="verify" size="4" maxlength="4">
            <img style="float:left;margin-left:10px;cursor: pointer;height:22px;" src="./captcha.php" onClick="this.src='./captcha.php?'+Math.random()">
        </td>
    </tr>
    <tr>
        <td></td>
        <td>
            <input type="submit" value="登录">
            <input type="hidden" name="token" value="<?php echo $_SESSION['token']?>">
            <input type="reset" value="重置">
        </td>
    </tr>
</table>
</form><!--//form-->
</div><!--//box-->
</body>
</html>

2、登录程序处理页面 loginSave.php

<?php
//包含连接数据库的公共文件
require_once("./conn.php");
//开启SESSION会话
session_start();

//判断表单是否合法提交
if(isset($_POST['token']) && $_POST['token']==$_SESSION['token'])
{
    //获取表单提交数据
    $username = $_POST['username']; //用户名
    $password = md5($_POST['password']); //加密字符串
    $verify   = $_POST['verify']; //验证码

    //判断验证码与服务器保存的是否一致：验证码不区分大小写
    if(strtolower($verify) != $_SESSION['captcha'])
    {
        echo "<h2>两次输入的验证码不一致！</h2>";
        header("refresh:3;url=./login.php");
        die();
    }

    //判断用户名和密码与数据库是否一致
    $sql = "SELECT * FROM user WHERE username='$username' and password='$password'";
    $result = mysqli_query($link, $sql); //执行SQL语句，并返回结果集对象
    $records = mysqli_num_rows($result); //取回记录数：0没找到，1找到了
    if(!$records)
    {
        echo "<h2>用户名或密码不正确！</h2>";
        header("refresh:3;url=./login.php");
        die();
    }

    //保存用户信息到SESSION中
    $_SESSION['username'] = $username;

    //跳转到相册首页
    header("location:./index.php");
}else
{
    //直接跳转到login.php
    header("location:./login.php");
}

3、连接数据库公共文件 conn.php

<?php
//(1)数据库配置信息
$db_host = "localhost"; //主机名
$db_user = "root"; //用户名
$db_pass = "root"; //密码
$db_name = "php69"; //数据库名称
$charset = "utf8"; //字符集

//(2)PHP连接MySQL服务器
if(!$link = @mysqli_connect($db_host, $db_user, $db_pass))
{
    echo "<h2>PHP连接MySQL服务器失败！</h2>";
    die(); //中止程序向下运行
}

//(3)选择当前数据库
if(!mysqli_select_db($link, $db_name))
{
    echo "<h2>选择数据库{$db_name}失败！</h2>";
    die();
}

//(4)设置字符集
mysqli_set_charset($link, $charset);

4、创建验证码页面 captcha.php

<?php
/*
    图像验证码：
    (1)产生随机验证码字符串
    (2)创建空画布，并分配颜色
    (3)绘制带填充的矩形
    (4)绘制像素点
    (5)绘制线段
    (6)写入一行TTF字符串
    (7)输出图像，并销毁图像
 */

//(1)产生4位随机验证码字符串
$arr1 = array_merge(range('a','z'),range(0,9),range('A','Z'));
shuffle($arr1);
$arr2 = array_rand($arr1,4);
$str = "";
foreach($arr2 as $index)
{
    $str .= $arr1[$index];
}
//将验证码字符串保存到SESSION中
session_start();
$_SESSION['captcha'] = strtolower($str);

//(2)创建空画布
$width = 70;
$height = 22;
$img = imagecreatetruecolor(70,22);

//(3)绘制带填充的矩形
$color1 = imagecolorallocate($img, mt_rand(0,255), mt_rand(0,255), mt_rand(0,255));
imagefilledrectangle($img,0,0,$width,$height,$color1);

//(4)绘制像素点
for($i=1;$i<=100;$i++)
{
    $color2 = imagecolorallocate($img, mt_rand(0,255), mt_rand(0,255), mt_rand(0,255));
    imagesetpixel($img,mt_rand(0,$width),mt_rand(0,$height),$color2);
}

//(5)绘制线段
for($i=1;$i<=10;$i++)
{
    $color3 = imagecolorallocate($img, mt_rand(0,255), mt_rand(0,255), mt_rand(0,255));
    imageline($img,mt_rand(0,$width),mt_rand(0,$height),mt_rand(0,$width),mt_rand(0,$height),$color3);
}

//(6)绘制一行TTF字符串
$fontfile = "./images/msyh.ttf";
$color4 = imagecolorallocate($img, mt_rand(0,255), mt_rand(0,255), mt_rand(0,255));
imagettftext($img,18,0,5,20,$color4,$fontfile,$str);

//(7)输出图像，并销毁图像
header("content-type:image/png");
imagepng($img);
imagedestroy($img);

5、登录页面添加验证码

显示照片列表

1、读取照片数据 index.php

<?php
//包含连接数据库的公共文件
require_once("./conn.php");

//开启SESSION会话
session_start();
//判断用户是否登录
if(empty($_SESSION['username']))
{
    //如果用户没有登录，则直接跳转到login.php
    header("location:./login.php"); 
    die();
}

//每页显示多少条
$pagesize = 15;
//获取当前页码，并计算开始行号
$page = isset($_GET['page']) ? $_GET['page'] : 1;
$startrow = ($page-1)*$pagesize;
//获取总记录数和计算总页数
$sql = "SELECT * FROM photos";
$result = mysqli_query($link, $sql);
$records = mysqli_num_rows($result);
$pages = ceil($records/$pagesize);

//构建查询的分页的SQL语句
$sql = "SELECT * FROM photos ORDER BY id DESC LIMIT {$startrow},{$pagesize}";
$result = mysqli_query($link, $sql);
$arrs = mysqli_fetch_all($result,MYSQLI_ASSOC);
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>相册首页</title>
<style type="text/css">
/*全局样式*/
body,ul,li,h2,a{margin:0px;padding:0px}
body{font-size:14px;color:#444;background-color:#00343f;}
ul,li{list-style: none;}
a{text-decoration:none;color:#444;}
a:hover{color:red;} 
/*局部样式*/
.box{width:1000px;margin:0px auto;background-color:white;}
.title{
    text-align:center;
    padding: 10px 0px;
    border-bottom: 2px solid #444;
    background-color:#d0e9ff;
}
.title h2{font-size:36px;padding:10px;}
.photos{padding:15px;}
.photos li{
    float:left;
    width:290px;
    padding:8px 5px;
    margin:10px;
    text-align:center;
    border:1px solid red;
}
.photos img{width:280px;height:160px;}
.pagelist{height:40px;line-height:40px;text-align:center;}
.pagelist a{padding:8px 15px;margin:0px 3px;border:1px solid #ccc;}
.pagelist a:hover{border:1px solid #0000ff;}
.pagelist .current{padding:8px 15px;}
</style>
</head>
<body>
<div class="box">
<!--title-->
<div class="title">
    <h2>我的相册</h2>
    <a href="./upload.php">上传照片</a>
    共有个<font color='red'><?php echo $records?></font>照片
</div><!--//title-->
<!--photos-->
<div class="photos">
    <ul>
        <?php
        //循环二维数组
        foreach($arrs as $arr){
        ?>
        <li>
            <a href="./detail.php?id=<?php echo $arr['id']?>"><img src="<?php echo $arr['imgsrc']?>"></a>
            <a href="./detail.php?id=<?php echo $arr['id']?>"><?php echo $arr['title']?></a>
        </li>
        <?php }?>
    </ul>
    <div style="clear:both"></div>
    <div class="pagelist">
        <?php
        //循环起点和终点
        $start = $page-5;
        $end   = $page+4;
        //如果当前页<=6时
        if($page<=6)
        {
            $start = 1;
            $end   = 10;
        }
        //如果$page>=$pages-4
        if($page>=$pages-4)
        {
            $start = $pages-9;
            $end   = $pages;
        }
        //如果$pages<10
        if($pages<10)
        {
            $start = 1;
            $end   = $pages;
        }
        //循环输出所有页码
        for($i=$start;$i<=$end;$i++)
        {
            //当前页不加链接
            if($page==$i)
            {
                echo "<span class='current'>$i</span>";
            }else
            {
                echo "<a href='./index.php?page=$i'>$i</a>";
            }
        }
        ?>
    </div>
</div><!--//photos-->
</div><!--//box-->
</body>
</html>

2、数据分页

添加照片

1、制作添加相册的表单 upload.php

<?php
//开启SESSION会话
session_start();
//判断用户是否登录
if(empty($_SESSION['username']))
{
    //如果用户没有登录，则直接跳转到login.php
    header("location:./login.php"); 
    die();
}
//产生表单验证随机字符串
$_SESSION['token'] = uniqid();
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>上传照片</title>
<style type="text/css">
/*全局样式*/
body,h2,form,a{margin:0px;padding:0px}
body{font-size:14px;color:#444;background-color:#00343f;}
a{text-decoration:none;color:#444;}
a:hover{color:red;} 
/*局部样式*/
.box{width:1000px;margin:0px auto;background-color:white;}
.title{
    text-align:center;
    padding: 10px 0px;
    border-bottom: 2px solid #444;
    background-color:#d0e9ff;
}
.title h2{font-size:36px;padding:10px;}
form{padding:30px;height:400px;}
form td{padding:8px;}
</style>
</head>
<body>
<div class="box">
<!--title-->
<div class="title">
    <h2>上传照片</h2>
    <a href="./index.php">返回首页</a>
</div><!--//title-->
<!--form-->
<form method="post" action="uploadSave.php" enctype="multipart/form-data">
<table align="center" width="600">
    <tr>
        <td width="100" align="right">照片标题：</td>
        <td><input type="text" name="title" size="60"></td>
    </tr>
    <tr>
        <td align="right">上传照片：</td>
        <td><input type="file" name="uploadFile"></td>
    </tr>
    <tr>
        <td align="right">照片描述：</td>
        <td><textarea name="intro" cols="45" rows="5"></textarea></td>
    </tr>
    <tr>
        <td></td>
        <td>
            <input type="submit" value="提交">
            <input type="hidden" name="token" value="<?php echo $_SESSION['token']?>">
            <input type="reset" value="重置">
        </td>
    </tr>
</table>
</form><!--//form-->
</div><!--//box-->
</body>
</html>

2、表单处理程序 uploadSave.php

<?php
//包含连接数据库的公共文件
require_once("./conn.php");

//开启SESSION会话
session_start();
//判断用户是否登录
if(empty($_SESSION['username']))
{
    //如果用户没有登录，则直接跳转到login.php
    header("location:./login.php"); 
    die();
}

//判断表单的来源是否合法
if(isset($_POST['token']) && $_POST['token']==$_SESSION['token'])
{
    //**********************上传图片*******************************
    //(1)判断上传图片是否有错误发生
    if($_FILES['uploadFile']['error']!=0)
    {
        echo "<h2>上传图片有错误发生！</h2>";
        header("refresh:3;url=./upload.php");
        die();
    }

    //(2)判断上传文件内容类型是不是图片
    $arr1 = array("image/jpeg","image/png","image/gif");
    //创建finfo的资源：获取文件内容类型，与扩展名无关
    $finfo = finfo_open(FILEINFO_MIME_TYPE);
    //获取文件内容的原始类型，不会随着扩展名改名而改变
    $mime = finfo_file($finfo,$_FILES['uploadFile']['tmp_name']);
    if(!in_array($mime,$arr1))
    {
        echo "<h2>上传的必须是图像！</h2>";
        header("refresh:3;url=./upload.php");
        die();      
    }

    //(3)判断上传的文件扩展名是不是图片
    $arr2 = array("jpg","gif","png");
    $ext  = pathinfo($_FILES['uploadFile']['name'],PATHINFO_EXTENSION); //文件扩展名
    if(!in_array($ext,$arr2))
    {
        echo "<h2>上传的必须是图像！</h2>";
        header("refresh:3;url=./upload.php");
        die();      
    }

    //(4)移动图片到 images目录中
    $tmp_name = $_FILES['uploadFile']['tmp_name'];
    $dst_name = "./images/".uniqid().".".$ext;
    move_uploaded_file($tmp_name,$dst_name);

    //***********************将表单提交数据保存到数据库****************************
    //(1)获取表单提交数据
    $title  = $_POST['title'];
    $intro  = $_POST['intro'];
    $imgsrc = $dst_name; //将图片路径保存到数据库
    $addate = time();

    //(2)判断记录是否添加成功
    $sql = "INSERT INTO photos VALUES(null,'$title','$imgsrc','$intro',0,$addate)";
    if(mysqli_query($link, $sql))
    {
        echo "<h2>上传照片成功！</h2>";
        header("refresh:3;url=./index.php");
        die();              
    }
}else
{
    //直接跳转到index.php页面
    header("location:./index.php");
}

3、finfo应用

修改php.ini配置文件，开启finfo扩展：

显示照片详细信息

1、首页文件 index.php

<?php
//包含连接数据库的公共文件
require_once("./conn.php");

//开启SESSION会话
session_start();
//判断用户是否登录
if(empty($_SESSION['username']))
{
    //如果用户没有登录，则直接跳转到login.php
    header("location:./login.php"); 
    die();
}

//每页显示多少条
$pagesize = 15;
//获取当前页码，并计算开始行号
$page = isset($_GET['page']) ? $_GET['page'] : 1;
$startrow = ($page-1)*$pagesize;
//获取总记录数和计算总页数
$sql = "SELECT * FROM photos";
$result = mysqli_query($link, $sql);
$records = mysqli_num_rows($result);
$pages = ceil($records/$pagesize);

//构建查询的分页的SQL语句
$sql = "SELECT * FROM photos ORDER BY id DESC LIMIT {$startrow},{$pagesize}";
$result = mysqli_query($link, $sql);
$arrs = mysqli_fetch_all($result,MYSQLI_ASSOC);
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>相册首页</title>
<style type="text/css">
/*全局样式*/
body,ul,li,h2,a{margin:0px;padding:0px}
body{font-size:14px;color:#444;background-color:#00343f;}
ul,li{list-style: none;}
a{text-decoration:none;color:#444;}
a:hover{color:red;} 
/*局部样式*/
.box{width:1000px;margin:0px auto;background-color:white;}
.title{
    text-align:center;
    padding: 10px 0px;
    border-bottom: 2px solid #444;
    background-color:#d0e9ff;
}
.title h2{font-size:36px;padding:10px;}
.photos{padding:15px;}
.photos li{
    float:left;
    width:290px;
    padding:8px 5px;
    margin:10px;
    text-align:center;
    border:1px solid red;
}
.photos img{width:280px;height:160px;}
.pagelist{height:40px;line-height:40px;text-align:center;}
.pagelist a{padding:8px 15px;margin:0px 3px;border:1px solid #ccc;}
.pagelist a:hover{border:1px solid #0000ff;}
.pagelist .current{padding:8px 15px;}
</style>
</head>
<body>
<div class="box">
<!--title-->
<div class="title">
    <h2>我的相册</h2>
    <a href="./upload.php">上传照片</a>
    共有个<font color='red'><?php echo $records?></font>照片
</div><!--//title-->
<!--photos-->
<div class="photos">
    <ul>
        <?php
        //循环二维数组
        foreach($arrs as $arr){
        ?>
        <li>
            <a href="./detail.php?id=<?php echo $arr['id']?>"><img src="<?php echo $arr['imgsrc']?>"></a>
            <a href="./detail.php?id=<?php echo $arr['id']?>"><?php echo $arr['title']?></a>
        </li>
        <?php }?>
    </ul>
    <div style="clear:both"></div>
    <div class="pagelist">
        <?php
        //循环起点和终点
        $start = $page-5;
        $end   = $page+4;
        //如果当前页<=6时
        if($page<=6)
        {
            $start = 1;
            $end   = 10;
        }
        //如果$page>=$pages-4
        if($page>=$pages-4)
        {
            $start = $pages-9;
            $end   = $pages;
        }
        //如果$pages<10
        if($pages<10)
        {
            $start = 1;
            $end   = $pages;
        }
        //循环输出所有页码
        for($i=$start;$i<=$end;$i++)
        {
            //当前页不加链接
            if($page==$i)
            {
                echo "<span class='current'>$i</span>";
            }else
            {
                echo "<a href='./index.php?page=$i'>$i</a>";
            }
        }
        ?>
    </div>
</div><!--//photos-->
</div><!--//box-->
</body>
</html>

2、照片详细信息页面 detail.php

<?php
//包含连接数据库的公共文件
require_once("./conn.php");

//开启SESSION会话
session_start();
//判断用户是否登录
if(empty($_SESSION['username']))
{
    //如果用户没有登录，则直接跳转到login.php
    header("location:./login.php"); 
    die();
}

//获取地址栏传递的id
$id = $_GET['id'];
//更新访问量
$sql = "UPDATE photos SET hits=hits+1 WHERE id=$id";
mysqli_query($link,$sql);

//构建查询的SQL语句
$sql = "SELECT * FROM photos WHERE id=$id";
//执行SQL语句，返回结果集对象
$result = mysqli_query($link, $sql);
//获取一行数据
$arr = mysqli_fetch_assoc($result);
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>照片详细信息</title>
<style type="text/css">
/*全局样式*/
body,ul,li,h2,a{margin:0px;padding:0px}
body{font-size:14px;color:#444;background-color:#00343f;}
ul,li{list-style: none;}
a{text-decoration:none;color:#444;}
a:hover{color:red;} 
/*局部样式*/
.box{width:1000px;margin:0px auto;background-color:white;}
.title{
    text-align:center;
    padding: 10px 0px;
    border-bottom: 2px solid #444;
    background-color:#d0e9ff;
}
.title h2{font-size:36px;padding:10px;}
.detail{padding:15px 100px;}
.detail div{text-align:center;}
.detail img{width:640px;}
.detail p{font-size:16px;text-indent: 36px; font-family: 微软雅黑;line-height: 28px;}
</style>
</head>
<body>
<div class="box">
<!--title-->
<div class="title">
    <h2><?php echo $arr['title']?></h2>
    访问<font color=red><?php echo $arr['hits']?></font>次，
    发布时间 <font color=red><?php echo date("Y-m-d H:i:s",$arr['addate'])?></font>，
    <a href="./index.php">返回首页</a>
</div><!--//title-->
<!--photos-->
<div class="detail">
    <div class="photo"><img align="center" src="<?php echo $arr['imgsrc']?>"></div>
    <p><?php echo $arr['intro']?></p>
</div><!--//photos-->
</div><!--//box-->
</body>
</html>
赞赏
全国大流量卡免费领
对内容有疑问，请加我微信：guoqiang7585
#
首页   •   全栈教程   •   php高级   •   项目：个人相册 登陆/展示

推荐文章

arrow_back 上一篇
5、php COOKIE SESSION 添加 读取 删除 垃圾回收
arrow_forward 下一篇
7、php面向对象1 对象和类 常量 构造析构方法

国强极客

项目：个人相册 登陆/展示
项目文件在 全栈教程/03_php高级+mvc/6_项目_个人相册 创建数据库 1、创建数据库 php69 2、创建用户数据表 user 3、添加一条用户数据 4、创建相册数据表 photos 创建数据库完整代码 //创…
扫描二维码继续阅读
2019-08-06