基于PHP+MySQL许愿墙的设计与实现

王汝山 郭俊亮 张洪川

（铜仁职业技术学院 贵州省铜仁市 554300）

随着学习的不断深入，在完成网页、数据库等课程的基础上，综合运用Web 表单和MySQL 数据库设计开发“许愿墙”阶段案例，将所学内容运用到实际案例中，达到学以致用的目的。

1 需求分析

1.1 实验背景

随着网络的普及，人们将许愿墙搬上网络，通过网页来管理愿望，这便是网络“许愿树”。

1.2 功能描述

在本项目中，对于许愿墙的具体需求如下：

（1）配置虚拟主机；

（2）MySQL 保存数据；

（3）提供发布、展示、修改和删除功能；

（4）提供红、绿、蓝、黄贴纸；

（5）显示发布时间；

（6）分页展示；

（7）密码保护可选项。

1.3 开发环境

开发环境如下：

操作系统：Windows 7 旗舰版

Apache：Apache2.4.41

PHP：PHP7.2.27

MySQL：mysql-8.0.19

2 案例实现

2.1 前期准备

2.1.1 创建虚拟机

虚拟主机又称共享主机，通过虚拟主机可在一台服务器上部署多个项目。首先，启用虚拟主机配置文件。打开Apache 配置文件httpd.conf，找到httpd-vhosts.conf 所在的行，取消注释即可。

其次，配置虚拟主机文件。打开httpd-vhosts.conf 文件进行配置，其中域名如下：

ServerName www.wishingwall.com

最后，配置本地DNS。打开C 盘下的系统文件hosts[2]，添加：127.0.0.1 www.wishingwall.com。重启Apache 服务确保配置生效，在主目录文件中编写测试文件，添加代码

2.1.2 目录结构

项目的开发除必要的PHP 文件外，页面的前端展示还需要HTML、CSS、JavaScript 等[3]。本项目包括含目录common、css、js、view，基本文件function.php、init.php、save.php、index.php，自定义模板文件index.php、add.html、edit.html、password.html。其中的index.php 是项目主页，主要有展示、删除愿望及密码验证等功能，save.php 主要有添加、修改愿望等功能。

2.1.3 连接数据库

连接数据库时使用MySQLi 扩展，打开PHP 配置文件php.ini，找到mysqli 所在行并取消注释，重启Apache 服务即可生效。

在MySQL 中创建数据库，在init.php 文件中使用mysqli_connect()连接数据库。

2.1.4 准备公共函数

将公共函数保存在function.php 文件中。input()函数根据$method 为get 或post 确定对应的超全局变量，根据$type 的值返回对应类型的数据，例如s 对应string，d 对应int，a 对应数组，若不存在，使用trigger_error()自定义错误。

2.1.5 引入公共文件

为能够在index.php 和save.php 中使用定义在common 中的init.php 和function.php，使用require 将其引入。

2.2 数据库设计

在数据库wish 中创建数据表wall，用于保存数据。表含有字段id、name、content、time、color、password，数据类型分别为int、varchar、varchar、int、varchar、varchar，分别代表id、姓名、内容、发布时间戳、颜色、密码。其中发布时间time 使用整型表示，主要用于保存 Unix 时间戳。在命令行使用insert 插入几条测试数据。

2.3 愿望展示

2.3.1 查询显示所有愿望

在首页index.php 中使用select 查询所有愿望贴纸，并使用mysqli_query()执行SQL 语句，使用mysqli_fetch_all()取出并显示所有愿望。

2.3.2 日期格式化

由于表中保存的是Unix 时间戳，为让其以友好格式显示，在function.php 中添加format_date()函数，其实现思想是：计算当前时间戳与表中时间戳的差（秒数），该差值若超过1 天则换算为天数；若不满一天且超过1 小时则换算为小时数；若不满1 小时且超过1 分钟则换算为分钟数；若不满1 分钟且超过1 秒则返回秒数；若不满1 秒则返回“1 秒”。

其中$format 数组的键为对应单位时间内的秒数，例如1 天为60*60*24 秒，即86400 秒。为以良好的格式显示贴纸，可将已取出的数据输出到指定的index.html 模板中。

2.3.3 HTML 模板

打开index.html 文件，依次遍历取出的$data 数组并显示。对于name 和content 字段，由于是用户输入数据，使用htmlspecialchars()函数进行转义[4]；time 字段是自动获取的系统时间，无需转义，使用format_date()和date()进行格式化输出；color由单选按钮提供，也无需转义。

2.4 分页查询

2.4.1 原理

当表中的数据越来越多时，页面无法将其全部显示，为防止数据量过大，可使用分页功能。分页功能又分为“假分页”和“真分页”。所谓“假分页”是指一次性查询出全部数据，显示时依次取出部分数据。“真分页”是指查询时限定查询数量，将查询出的数据全部显示[5]。此处利用“真分页”减轻服务器负担。

MySQL 中的limit 命令用于限定select 命令中记录的起始位置和数量。limit 后的第2 个参数为每次查询的最大记录数，第1 个参数为查询起始记录的偏移量。其两个参数关系如下：

第1 个参数 =(页码 - 1)*第2 个参数

由于每页显示的最大记录数固定，可将第2 个参数定义为常量，在function.php 中创建函数返回limit 的两个参数。

2.4.2 实现

通过function.php 中的input()函数确定当前要显示的页码，结合limit 参数拼接SQL 语句，通过ORDER 使最新发布的愿望排在最前面。为防止查询到空白页码，需对流程进行控制，使用header()重定向，并停止脚本执行。

2.4.3 分页导航

实现分页查询后，为方便翻页浏览，需提供分页导航功能，通常包括“首页”、“上一页”、“下一页”、“尾页”链接。首页的页码为1，尾页的页码为最后一页的页码。

使用count(*)获取总记录数，总页数为总记录数/每页记录数，若不能整除则向上取整，最小值为1。

打开function.php，将分页导航代码封装到函数page_html()中，用于返回导航链接。其中，若位于首页时，取消“首页”和“上一页”链接；若位于“尾页”时，取消“下一页”和“尾页”链接。将链接输出到index.html 模板中，通过浏览器访问测试，如图1所示。

2.5 发布愿望

2.5.1 创建表单

使用JS 实现当单击主页中的“我要许愿”按钮时弹出许愿表单，将其保存在add.html 文件中，在HTML 模板文件index.html 使用require 引入即可。

2.5.2 接收并过滤

add 表单会将数据提交到save.php 文件，因此在该脚本中使用input()接收变量，同时限制用户提交数据的长度并指定默认值。strlen()函数对于中、英文字符并不能准确地获取字符长度，因此需要使用PHP 提供的mb_strlen()函数，使用mb_strimwidth()截取指定宽度的字符串。而该函数的使用需要在PHP 配置文件中开启相应的扩展，找到mbstring 一行并取消注释，重启Apache 服务即可生效。

2.5.3 保存数据

完成对输入数据的过滤后，即可将数据保存到数据库中。打开save.php，利用MySQLi 扩展提供的预处理方式，实现了SQL 语句与数据的分离，同时支持批量操作。

PHP 执行SQL 的传统方式是将发送的数据与SQL 语句绑定，每条SQL 都需要经过分析、编译、优化，而预处理方式则是预先编译一次用户提交的SQL 模板，在操作时，直接添加数据即可，大大提高了运行效率。保存完毕，使用header()函数跳转到首页。

2.6 修改愿望

2.6.1 验证密码

为防止提交的愿望被随意修改，在发布时提供密码保护可选项。若设置密码，则在修改和删除愿望时需首先验证密码。在展示愿望贴纸时，显示每个愿望的修改链接。

单击超链接会为index.php 传递愿望id 和当前page 页码。打开首页index.php，使用input()函数获取待编辑愿望的id，使用max()确保id 有效。在获取$id 后，即可根据$id 判断是否需要显示验证密码表单。

利用$id 及密码验证表单中的密码即可查询指定的数据记录是否存在。在首页index.php 中添加如下代码：

$checked = isset($_POST['password'])|| empty($edit['password']);

其中的$checked 指明密码验证是否成功。当原密码为空或密码正确时值为true，密码不正确时值为false。$tips 保存验证失败时的提示信息。为显示修改表单，在模板中添加如下代码：

require($checked?'edit':'password').'.html';

图1：分页导航

图2：修改或删除标记

将index.php 中查询出结果集取出，使用函数mysqli_fetch_assoc()将数据保存为关联数组，并在edit.html 显示修改愿望表单。

2.6.2 确认更新

save.php 目前只有添加功能，根据传递的id 参数可以判断此时是添加还是修改操作。在修改前，同样需要验证保护密码。若数据记录存在且密码一致，使用预处理操作修改数据记录。

2.7 删除愿望

删除愿望主要用于发布者删除自己的愿望。为防止被别人误删，同样需要进行密码验证。添加删除超链接，其中的“action=delete”用于区分删除和修改功能，单击超链接会为index.php 传递待删除愿望id 和当前page 页码。

当要修改或删除愿望时，将鼠标移动至愿望贴纸上，即可显示修改和删除标记和×，如图2所示。

3 结束语

本文主要使用Apache+PHP+MySQL 实现“许愿墙”案例。利用Apache 配置虚拟主机，利用MySQL 保存数据记录，使用MySQLi 扩展访问数据库，实现了Unix 时间戳的友好显示，实现了分页显示功能，为限制修改提供了密码保护功能。通过该阶段性案例，加强了学生对PHP 基础知识的理解。