基于PHP+MySQL的在线相册设计与实现

张日花 刘婷婷 陈红娟

摘  要：在生活中，人们将照片冲洗出来后，通常会把照片放入到相册中，以便更好地翻阅，而随着数码时代的到来，大多数人选择直接将照片保存在电脑或手机中，还可以上传到互联网中分享，在线相册就是一种用于保存图片的Web应用。文章从“在线相册”需求分析、功能实现、功能展示等几方面入手，采用PHP技术，同时结合MySQL数据库，实现了创建相册、上传图片、生成缩略图、添加水印、搜索，以及相册和图片的浏览等功能，极大地满足了广大摄影爱好者收集相册以及管理相册的个性化需求。

关键词：在线相册；PHP；MySQL

中图分类号：TP311  文献标识码：A  文章编号：2096-4706（2023）07-0015-05

Abstract： In daily life， after developing photos， people usually put them into photo albums for better browsing. With the advent of the digital era， most people choose to save photos directly on their computers or mobile phones， and they can also upload them to the Internet for sharing. Online photo albums are a Web application for saving photos. Starting with “online photo album” demand analysis， function implementation， function display， and other aspects， this paper uses PHP technology combined with MySQL database to achieve the functions of creating photo albums， uploading images， generating thumbnails， adding watermarks， searching， and browsing photo albums and images， greatly satisfying the personalized needs of photography enthusiasts to collect and manage photo albums.

Keywords： online photo album; PHP; MySQL

0  引  言

隨着数码相机和手机在家庭中越来越普及，人们可以更方便地拍摄照片，又不把拍摄的照片都冲印出来，更多是选择了存储在电脑和手机里，但时间一长，照片越来越多，就会显得杂乱无章，不方便管理，在线电子相册就充当了非常重要的作用，在线电子相册的设计与实现，能解决大量自拍者以及摄影爱好者大容量图片资料的存储与管理问题，为用户提供一个网络存储空间，让用户可以方便地把自己的照片分享给朋友或者任何用户。在线相册能为这些图片等进行分类管理，通过创建相册、上传图片、搜索图片、删除图片、图片生成缩略图、添加水印等功能来动态操作这些图片，并实现相册资料的在线、实时、交互式管理[1]。

1  在线相册的设计

1.1  在线相册的需求分析

在本设计中，对于在线相册的具体需求分析如下：

1）配置本地服务器用于测试和运行项目。

2）支持最大5 MB的图片上传，将图片保存到服务器。

3）使用MySQL数据库保存相册数据。

4）在一个相册内可以创建子相册，默认最多支持5级嵌套，且能够限制最多层级数。

5）在相册中显示图片列表时，为避免图片文件过大造成页面打开缓慢，只显示缩略图。

6）在浏览图片时，可以通过“上一张”“下一张”按钮切换到本相册内的其他图片。

7）支持相册图片的删除，在删除相册时只允许删除空相册。

8）支持设置相册封面。

9）可以通过文件名字搜索相册中的图片。

在实现以上效果前，首先进行准备工作，如图1所示。

1.2  开发环境配置及要求

网站开发设计工具Sublime 4.0是一款非常高效的代码编辑工具，既可以编写代码还可以编辑文本，此软件是主流前端开发编辑器，体积较小，运行速度快，文本功能强大，支持编译功能且可在控制台看到输出，内嵌Python解释器支持插件开发以达到可扩展目的。

网站的开发技术是PHP技术。PHP，一个嵌套的缩写名称，是英文超级文本预处理语言PHP：Hypertext Preprocessor的缩写。PHP是全球网站使用最多的脚本语言之一，全球前100万的网站中，有超过70%的网站使用了PHP开发，随着开源潮流的蓬勃发展，PHP与Linux、Apache和MySQL一起共同组成了一个强大的Web应用程序平台，简称LAMP。PHP之所以应用广泛，受到大家欢迎，是因为它有很多突出的特点如：开源免费、跨平台、面向对象、支持多种数据库、快捷[2]。

数据库应用MySQL，MySQL是最流行的关系型数据库管理系统，MySQL性能卓越、服务稳定，开放源代码，自主性及使用成本低，体积小，安装方便，易于维护，支持多种操作系统，提供多种API接口，支持多种开发语言，特别是PHP。

Apache服务器是一款源代码开放的Web服务器，由于其开源、跨平台和安全性的特点被广泛应用。

1.3  目录结构划分

在线相册系统的功能主要通 index.php、show.php和search.php来完成。其中index.php是相册的首页，提供了相册浏览、新建相册、上传图片、删除图片、删除相册、设置图片为相册封面等功能；show.php用于图片的查看功能；search.php提供了图片的搜索功能[3]。如表1所示。

1.4  创建配置文件

在项目中通常有一些常用配置，如数据库连接信息，使用独立的配置文件来保存配置可以使代码更利于维护。接下来，在comm目录中创建配置文件config.php，保存数据库的连接信息，相册层级最大值，允许的图片扩展名，缩略图大小等主要代码如下：

return [

'DB_CONNECT' => [

'host' => 'localhost'，

'user' => 'root'，

'pass' => 'root'，

'dbname' => 'php_album'，

'port' => '3306'

]，

'DB_CHARSET' => 'utf8'，

'LEVEL_MAX' => 5，

'ALLOW_EXT' => ['jpg'， 'jpeg'， 'png']，

'THUMB_SIZE' => 260，

];

上述代码通过数组保存了数据库连接信息，其中DB_CONNECT数组保存了用于mysqli_connect（）函数使用的连接参数，DB_CHARSET保存了用于 mysqli_set_charset（）函数使用的字符集信息。

1.5  数据库的连接与设计

对于数据库的操作，有许多重复的代码需要编写。因此，可以将这些代码封装成函数，从而提高项目的开发速度。在comm目录中创建db.php保存数据库操作相关的函数，具体函数如下。

1.5.1  连接数据库

本设计中，对数据库的操作是十分频繁的，通过封装函数实现一次定义多次引用，编写db_connect（）函数用于连接数据库，该函数通过静态变量$link保存数据库连接，仅当函数第一次调用的时候连接数据库[3]。主要代码如下：

function db_connect（）

{

static $link = null;

if （！$link） {

$config = array_merge（['host' => ''， 'user' => ''， 'pass' => ''，

'dbname' => ''， 'port' => '']， config（'DB_CONNECT'））;

if （！$link = call_user_func_array（'mysqli_connect'， $config）） {

exit（'数据库连接失败：' . mysqli_connect_error（））;

}

mysqli_set_charset（$link， config（'DB_CHARSET'））;

}

return $link;

}

1.5.2  引入公共文件

公共函數是项目中通用的函数库，保存在function.php和db.php中，用于封装常用的代码，提高代码的复用性和可维护性，$_POST接收和过滤常用的操作[4]。为了在项目中使用，还需要引入这些文件。下面通过项目的初始化文件comm/init.php来引入这些公共文件，并设置项目的时区和字符集，具体代码如下：

require './comm/function.php';

require './comm/db.php';

date_default_timezone_set（'Asia/Shanghai'）;

mb_internal_encoding（'UTF-8'）;

完成上述代码后，就可以通过引入init.php来实现项目的初始化。

1.5.3  数据库设计

数据库设计对项目功能的实现起着至关重要的作用，如果设计不合理、不完善，在开发和维护过程中可能会出现很多问题，本设计在MySQL中创建数据库_ablum.sql，用户保存本设计中的数据[5]，根据项目的需求分析，在数据库中创建album 和 picture两个数据表，分别保存相册和图片数据。

相册信息表保存在线相册的相册ID、上级相册ID、相册名、相册路径、封面图地址及图片数等，其中相册路径和封面图地址是附加信息，用于记录用户上传的图片保存的位置，图片数用于记录相册中上传了几张图片，表结构如表2所示。

图片信息表有四个字段：图片ID、所属相册ID、图片名、保存地址，如表3所示。

2  相册管理

2.1  创建相册

一般动态网站都分为前台代码和后台代码分开设计与制作，因此，创建相册首先进行网站的前台页面的设计，创建新建相册表单，为了便于用户在当前浏览的相册中创建子相册，可以在页面中提供一个新建相册的表单。主要代码如下：

在上述代码中，隐藏域“action”用于标识当前表单提交的操作为“new”，表示新建相册。由于没有 指定表单的 action 属性，表单在提交时会自动携带当前参数。例如，当 index.php的参数为“？id=1”时，提交新建相册的表单就表示在ID为1的相册中创建子相册。

在后台接收来自POST方式提交的action隐藏域内容，由于在新建相册时，需要判断当前相册嵌套的层数是否超过了限制，用于根据相册id获取相册记录，同时考虑到此功能多次调用，利用静态变量保存从数据库中查询到的结果，$data数组的键是待查询的相册ID，若从数据库中查不到则返回FALSE。主要代码如下：

static $data = [0 => false];

if （！isset（$data[$id]）） {

$data[$id] = db_fetch_row（"SELECT `pid`，`path`，`name`，`cover`，`total`

FROM `album` WHERE `id`=$id"） ？： false;

完成上边函数后，再编写创建相册函数，计算相册的上级相册的数量，判断是否达到了最大值，当达到最大值时，输出提示信息“无法继续创建子目录，已经达到最多层级！”，否则，应用INSERT插入语句创建相册，主要代码如下：

if （substr_count（$data['path']， '，'） >= config（'LEVEL_MAX'）） {

exit（'无法继续创建子目录，已经达到最多层级！'）;}

$name = mb_strimwidth（trim（$name）， 0， 12）;

db_exec（'INSERT INTO `album` （`pid`，`path`，`name`） VALUES （？，？，？）'， 'iss'， [

$pid， （$data['path'] . $pid . '，'）， （$name ？： '未命名'） ]）;

通過浏览器访问进行测试效果如图2、图3所示。

2.2  图片上传

2.2.1  检查上传文件并且生成文件名和保存路径

创建完相册后，相册为空，接下来我们在空相册中添加图片，在index.html中添加文件上传的表单，隐藏域action用于标识当前表单提交后执行upload操作，即图片上传。考虑到相册中可以保存大量的图片，为了避免文件名冲突，或者在一个目录中保存过多的文件导致难以维护，在album_upload（）函数中实现文件名和保存目录的自动生成，并判断上传图像的类型是否符合要求，关键代码如下：

// 检查文件类型是否正确

$ext = pathinfo（$file['name']， PATHINFO_EXTENSION）;

if （！in_array（strtolower（$ext）， config（'ALLOW_EXT'））） {

return tips（'文件上传失败：只允许扩展名：' . implode（'， '， config（'ALLOW_EXT'）））;    }

// 生成文件名和保存路径

$new_dir = date（'Y-m/d'）;

$new_name = md5（microtime（true）） .".$ext";

2.2.2  生成缩略图

在相册管理模块中，图片的上传是必不可少的功能，但随着高分辨率相片的普及，上传图片的容量会很大。在很多图片的网页中，图片容量越大打开网页的速度越慢。在用户上传图片时，可能图片的大小尺寸不同，就会出现同一相册中图片大小不一，影响美观程度，为了解决以上问题，需要对用户上传的图片进行相应的处理，可以让其在指定大小的地方显示，定义函数实现缩略图的生成，主要代码如下：

$info = getimagesize（$file）;

list（$width， $height） = $info;

在获取到原图的宽高后，就可以计算生成缩略图所需的坐标点，实现缩略图的生成。由于原图的比例不确定，为了避免缩略图比例失调，这里使用了最大裁剪的方式来生成缩略图。例如，一张400×200 px的图片，若要生成100×100 px的缩略图，就按照比例从原图的中心位置取出200×200 px的图像内容，如图4所示。取出之后，再将图像缩小成100×100 px的缩略图即可。

在计算坐标点时，应考虑原图宽度大于高度和高度大于宽度两种情况。主要代码如下：

if （$width > $height） {

$size = $height;

$x = （int） （（$width - $height） / 2）;

$y = 0;

} else {

$size = $width;

$x = 0;

$y = （int） （（$height - $width） / 2）;

}

$thumb = imagecreatetruecolor（$limit， $limit）;

imagecopyresampled（$thumb， $img， 0， 0， $x， $y， $limit， $limit， $size， $size）;

2.2.3  添加水印

在网站上，为了保证网站中所上传的图片不被他人盗用，经常需要在所上传的图片上添加水印，水印分为图片水印和文字水印，本项目采用文字水印，在每张上传的图片上添加“XX的个人相册”，以保护自己图片的信息不被盗用。关键代码如下：

//设置字体

$font_style = 'C：＼Windows＼Fonts＼simsun.ttc';

//设置字体颜色

$color = imagecolorallocate（$thumb， 0xff， 0x00， 0xff）;

imagefttext（$thumb， 15， 0， 0，35， $color， $font_style， 'XX的个人相册'）;

实现效果如图5、图6所示。

2.3  查看图片

在浏览相册中的多个图片时，若要反复从相册列表和图片查看页面切换，显得非常麻烦。因此可以在图片展示页面中添加切换上一张和下一张图片的链接，主要代码如下：

$prev = db_fetch_row（"SELECT `id` FROM `picture` WHERE `pid`=$pid AND `id`<$id

ORDER BY `id` DESC LIMIT 1"）['id'];

$next = db_fetch_row（"SELECT `id` FROM `picture` WHERE `pid`=$pid AND `id`>$id

ORDER BY `id` ASC LIMIT 1"）['id'];

实现效果如图7所示。

2.4  图片搜索功能

相册中图片很多，当忘记自己需要的圖片放置在那个相册中时，每个相册逐个查找太麻烦，本项目中提供了图片搜索功能是按照图片的文件名进行搜索，用户可以输入关键词，查找相册中所有符合关键词的图片，利用SQL语句中的LIKE操作符进行搜索即可。需要注意的是，由于LIKE条件可以用“%”“_”进行模糊搜索，为了避免用户输入的内容和这些字符冲突，应该将这些字符进行转义。主要代码如下：

$search = input（'get'， 'search'， 's'）;

$like = '%' .db_escape_like（$search）. '%';

$list = db_fetch_all（"SELECT `id`，`name`，`save` FROM `picture` WHERE `name` LIKE ？ ORDER BY `id` DESC"， 's'， [$like]）;

实现效果如图8所示。

2.5  删除图片

对于相册中不再需要的照片可以删除，实现图片的删除，在删除图片时，不仅需要删除数据库中的记录，还需要删除图片的文件和缩略图。主要代码如下：

if （！$data = album_picture_data（$id）） {

return tips（'删除失败：图片不存在！'）;

}

db_exec（"DELETE FROM `picture` WHERE `id`=$id"）;

实现效果如图9所示。

3  结  论

在线相册系统的实现，方便大家存储和管理自己的照片和喜欢的图片，也能够及时与他人分享自己的生活记录。通过创建相册模块可以将图片清楚的分类管理，通过生成缩略图可以使相册中的图片大小比较统一，添加水印功能保证网站中所上传的图片不被他人盗用，通过查找功能可以很快找到自己想要的图片，使用户在体验本系统同时更加愉快。本设计实现了一个个性化的在线相册，为广大摄影爱好者提供了沟通和交流的平台。

参考文献：

[1] 朱小琴.基于PHP技术的电子相册网站设计与实现 [J].河北软件职业技术学院学报，2016，18（4）：56-59+73.

[2] 白春雨.基于PHP的社交化艺术品电商平台的研究与设计 [D].北京：北京邮电大学，2021.

[3] 黑马程序员.PHP基础案例教程 [M].北京：人民邮电出版社，2017.

[4] 王飞飞.MySQL数据库应用从入门到精通 [M].北京：中国铁道出版社，2014.

[5] 周少卿.基于PHP+MySQL的“许愿墙”设计 [J].无线互联科技，2022，19（11）：73-75.

作者简介：张日花（1980—），女，汉族，山东德州人，高级工程师，本科，研究方向：计算机应用；刘婷婷（1989—），女，汉族，山东德州人，讲师，硕士研究生，研究方向：计算机应用；陈红娟（1998—），女，民族，汉，河北衡水人，工程师，本科，研究方向：计算机科学与技术。