PHP表单

在学习PHP表单之前,我们先来了解如何使用PHP构建一个完整的网站,这也是PHP编程语言相对于其他后端语言来说最为擅长的。通常一个完整的网站,不仅会涉及到非常多的功能模块,而且还会涉及到非常多的资源(html、css、图片、js等等),所以要构建一个完整的网站就先要规划好文件的目录结构,让项目编写变得有序。

项目的文件结构

首先我们使用VS Code新建一个blog的文件夹,我们后面的内容会逐步建一个blog网站,然后在该文件夹下依次新建:

  • static文件夹,这个用于存放静态资源;
  • static文件夹下再分别新建css、images、js文件夹,分别存放css样式文件、图片以及js代码;
  • index.php,这个通常作为项目的首页;
  • includes文件夹,这个用来存放可以重复使用和关键性的php文件;
  • 在includes文件夹下,再新建functions.php文件,该文件会写一些主要而会重复使用的php函数
  • admin文件夹,用于存放网站后台的代码,从网站建设的活动了解到wordpress就有一个后台来管理文章的发布、查看用户的信息等等,一个完整的网站也少不了后台;
  • admin文件夹下也新建一个includes文件夹,用于存放后台重复使用和关键性的php文件。

编程不只是写写代码,要把代码写的清晰,注释写的详细,格式写的漂亮,还需要善于有序管理代码。上面很多文件名虽然可以随意更改,但是不符合程序员之间的约定,大家遵循一个统一的规则,团队协作时代码才更具可读性。

在php文件中插入其他文件

一个官网几乎所有页面的头部header和底部footer都是一样的,如果我们都写成html,那未免太麻烦。我们来看php是怎么处理这个问题的。

使用VS Code在blog的includes文件夹下新建header.php、footer.php。在header.php文件输入以下代码:

为了能够快速美化页面,上面我们引入了网站最为流行的前端开发框架BootStrap。这样我们只需要按照BootStrap的开发文档,给想要添加样式的标签打一个选择器就可以啦,非常方便。

在footer.php文件输入以下代码:

然后我们再来在blog文件夹下的首页index.php里输入以下代码:

然后使用浏览器打开index.php,查看一下效果(可以使用Chrome开发者工具来查看网页的代码),我们发现因为用了include,header.php和footer.php的内容就被引入到了index.php中了。

有了include,一个个独立的php文件就可以关联起来,或者说我们可以把一个大项目根据功能不同分割成很多个独立的php文件,这样我们就可以用php来开发一个大型的项目啦。

include、include_once、require、require_once

  • include函数:会将指定的文件读入并且执行里面的程序;
  • require函数:会将目标文件的内容读入,并且把自己本身代换成这些读入的内容;
  • include_once 函数:在脚本执行期间包含并运行指定文件。此行为和 include 语句类似,唯一区别是如果该文件中已经被包含过,则不会再次包含。如同此语句名字暗示的那样,只会包含一次;
  • require_once 函数:和 require 语句完全相同,唯一区别是 PHP 会检查该文件是否已经被包含过,如果是则不会再次包含。

include与require除了在处理引入文件的方式不同外,最大的区别就是:include在引入不存文件时产生一个警告且脚本还会继续执行,而require则会导致一个致命性错误且脚本停止执行。

通常情况下,我们引入网页结构文件的时候是使用include,而引入数据库等配置文件等敏感信息的时候是使用require_once。include可以放置到php文件的任何位置,而require最好是放在php文件的最顶部。

表单收集的方法

表单收集就是通过填写一个网页的表单来收集一些数据信息,并在另外一个网页把这些数据信息显示出来。比如用户的账号、密码,用户的个人简介;文章的标题、内容;商品的名称、价格、描述等等。通过页面来收集数据,就可以让访问者无需去执行复杂的SQL语句,就能在网页上对数据库进行增删改查

是不是听起来好像有点酷,但是感觉挺难的样子?要学习开发表单,首先我们需要先来大致了解PHP预定义的几个超全局变量。

技术文档:PHP超全局变量

其中的$_POST变量$_GET变量$_REQUEST变量,就是用于表单收集的,三个作用各有不同。

  • $_POST,用于收集method=”post”表单中的值,POST方法用于收集不可见的信息,数据量没有限制;
  • $_GET,用于收集method=”get”表单中的值,GET方法用于收集可见的信息,数据量不能超过2000个字符;
  • $_REQUEST,可用来收集通过 GET 和 POST 方法以及发送的表单数据以及$_COOKIE 里的内容。

是不是感觉很迷糊?迷糊就对了,计算机的很多理论知识如果你不实战一下,你理解起来当然会觉得很难,这个时候千万不要陷入到传统而又错误的学习方法去死记硬背之中,而是结合实战的案例来理解。

用户资料表单

首先我们在blog文件夹下新建一个php文件,比如profile.php,

然后再在blog文件夹下新建一个welcome.php

我们在profile.php页面的form表单中填写的数据,就显示在了另一个文件welcome.php页面上了。

前面我们提到$_REQUEST,可用来收集通过 GET 和 POST 方法以及发送的表单数据,在这里我们把welcome.php里的$_POST换成$_REQUEST,也同样能够把数据显示到网页上,但是把$_POST换成$_GET就不行啦。

用户注册页面

用户的注册页面所涉及的知识点和上面没有太大区别,我们可以在blog文件夹下新建一个login.php文件,输入下面的代码:

我们在header.php里就已经引入了BootStrap样式,所以我们是可以直接给login.php的一些html标签添加选择器以让样式看起来可以接受。

然后在之前建好的index.php文件里添加以下代码:

验证表单

有时我们需要给表单设置必填字段,比如用户注册登录时,用户名、密码不能为空;也需要给表单定义错误信息,比如密码不能小于6位数等等。

验证表单所涉及到的知识点非常多,在实战验证表单前,我们先来大致了解以下知识点。

去除特殊字符

有的人填写用户名、密码时直接用空格、Tab或Enter,或者使用一些奇怪的字符、表情等奇怪的操作,这些我们需要过滤掉这些情况。

  • 使用 PHP trim() 函数去除用户输入数据中不必要的字符 (如:空格,tab,换行)。
  • 使用PHP stripslashes()函数去除用户输入数据中的反斜杠 (\)。

$_SERVER

$_SERVER也是一个超全局变量,它包含了诸如头信息(header)、路径(path)、以及脚本位置(script locations)等等信息的数组。这个数组中的项目由 Web 服务器创建。

技术文档:PHP超全局变量之$_SERVER

  • $_SERVER[‘REQUEST_METHOD’]是访问页面使用的请求方法;例如,“GET”, “HEAD”,“POST”,“PUT”。
  • $_SERVER[“PHP_SELF”]当前执行脚本的文件名,与 document root 有关。

我们可以在lesson3文件夹下新建一个php_self.php文件,然后执行看看效果。

它会返回当前php文件的文件路径(相对于根目录)与文件名。

PHP变量处理函数

技术文档:PHP变量处理Variable handling函数

  • empty():检查一个变量是否为空;
  • isset:检测变量是否已设置并且非 NULL

我们在 blog文件夹下的includes下新建validate.php,在下面输入以下代码:

然后把直接建好的login.php修改成以下代码:

复杂的表单收集
这里有一段代码是多个知识点的应用,比较复杂,我们来一一讲解。
通常情况下表单收集应该下下面的格式,$_SERVER[“PHP_SELF”]会返回当前php文件的地址
那结合我们之前的htmlspecialchars()函数的知识,比如我们在lesson3文件夹下新建一个script.php

我们先随意输入一个用户名,表单会返回用户名,但是如果我们在填写用户名时输入这段JavaScipt代码:

这段代码会让浏览器跳出弹窗(当然很多浏览器会拦截该脚本),还有其他恶心的代码,是不是很不安全,很危险?如果使用了htmlspecialchars()函数,即使输入脚本也没有用啦

三元运算符

上面多次使用到三元运算符,我们可以回顾一下之前学的三元运算符的知识来理解下面。


如果username_err非空,也就是username_err报错了,那就给输出has-error,也就是给div添加了一个has-error的选择器,如果没有错误,那就什么也不添加。我们可以给该选择器添加颜色样式来强调报错信息。

本节任务

  1. 掌握项目的文件结构;
  2. 了解include、include_once、require、require_once的用法与区别;
  3. 掌握表单收集的方法
  4. 创建一个用户资料页,用户注册页
  5. 掌握表单的验证的知识