实验四 Web表单技术

实验四Web表单技术

一、实验目的

1．掌握GET和POST两者的区别。

2．了解文件上传的机制。

3．掌握HTTP请求中POST文件上传方式。

4. 掌握PHP提供的strip_tags()函数

二、实验准备

1．准备实验开发环境PHPWamp开发软件。

2．准备DreamWeaver等页面开发软件，建网站文件夹，并创建一个网站。3．准备实验素材进行程序开发设计。

三、实验内容及步骤

1. 在表单中数据的传输方式有两种,一种是GET方式，另一种是POST方式，通过对比，分析两者的区别，了解两种传输数据方式的特点。

（1）设计思路

1)创建一个表单，分别以GET方式和POST方式发送数据，数据接收页面为

showinfo.php。

2)表单中设置以下几个表单元素，姓名、年龄、性别，通过按钮点击提交，可

以重置。

3)在showinfo.php中接收传输的数据，并打印输出到浏览器。

（2）代码实现

1）首先创建一个以GET方式请求的表单，表单中有以上说明的表单元素，在表单元素中赋予相应的值，发送给showinfo.php页面。

GET方式请求数据
姓名：
年龄：
性别：

以上代码输出结果：

2）在showinfo.php文件中编写接收get请求的数据并输出：

header("content-type:text/html;charset=utf-8");

var_dump($_GET);

输出效果图：

3）再创建一个以POST方式请求的表单，表单中有以上说明的表单元素，在表单元素中赋予相应的值，发送给showinfo.php页面。

……

……

以上代码输出结果：

4）在showinfo.php文件中接收post方式提交的数据：

header("content-type:text/html;charset=utf-8");

var_dump($_POST);

4）运行结果展示：

（3）总结

1)不同方式的请求，传输数据的形式不同，接收数据的方式也不同。

2)GET方式提交的数据放置在HTTP请求协议头中，附加在url之后，以？与

url分开，而每个数据以&分开。POST方式提交的数据放在实体数据中。相对而言在安全性上POST方式比GET方式更好。

3)GET方式提交的数据最多只能有1024字节，而POST在php.ini配置文件中

默认为8M，可以自定义修改。

4)GET方式请求是form表单的默认请求方式。

2. 在项目实际开发中，为了使作者的发表的内容丰富多彩，我们会采用图文并茂的方式给读者体现。那么图片的上传在这里将会很重要，图片上传时通过表单的文件域获取文件的路径，通过 表单元素

enctype="multipart/form-data"属性设置表单的MIME编码，此时表单内的数据是以二进制的方式进行数据传输。当提交表单后，在PHP脚本中使用全局变量$_POST接收表单的文本数据，使用全局变量$_FILES来读取数据中的文件信息。（1）设计思路

1)编写用于上传文件的html表单页面index.html。

2)编写接收数据的PHP脚本文件post.php。

3)实现文件上传的功能及效果显示。

（2）代码实现

1）编写上传文件使用的表单页面，代码如下：

文件上传
形象照片：

2）运行程序，结果如下图所示：

3）编写接收表单数据的PHP脚本

echo("");

//判断文件上传是否有错误

if ($_FILES['file']['error'] > 0) {

die("上传文件有误！");

}

//输出文件信息

echo "文件的名称：" . $_FILES['file']['name'] . "
";

echo "文件的类型：" . $_FILES['file']['type'] . "
";

echo "文件的大小：" . $_FILES['file']['size'] . "Kb
";

echo "文件的临时路径：" . $_FILES['file']['tmp_name'] . "
";

//判断文件是否已经存在

if (file_exists("./upload/" . $_FILES['file']['name'])) {

die("文件已经存在！");

}

//文件名称的编码转换

$saveFilePath = iconv("UTF-8", "GBK//IGNORE",

"./upload/" . $_FILES['file']['name']);

//上传图片

if (move_uploaded_file($_FILES['file']['tmp_name'], $saveFilePath)) {

echo "上传成功:./upload/" . $_FILES['file']['name'] . "
";

echo "
";

} else {

die("上传错误！");

}

?>

上传的文件展示：

（3）总结

1)文件上传时必须使用post方式提交数据。

2)文件接收数据时必须使用$_FILES获取表单提交的文件信息。

3. 当接收表单时，用户输入的内容中可能会有HTML、CSS、JavaScript代码，如果PHP将这些输入数据原样显示到HTML中，就会对网页造成破坏，而且JavaScript代码也会被浏览器执行，影响网站的安全。请使用strip_tags()函数过滤表单中的HTML标签。

（1）设计思路

1)创建一个表单，表单中有一个输入用户姓名的表单元素。

2)该表单数据传输给post.php。

3)post.php中将该变量获取并打印。

4)向表单元素中输入正常的值，查看页面显示效果。

5)返回该表单，在输入的小明前添加标签，在传输给showinfo.php查

看显示效果。

6)重复上一步操作，在post.php中使用strip_tags()函数对该变量进行处理，再

次查看页面显示效果。

（2）代码实现

1）创建一个表单，表单中有text类型表单元素，用以输入用户姓名。

表单数据安全验证
用户名：

查看网页展示效果：

2）编写post.php 文件：

header('content-type:text/html;charset=utf-8');

$name = $_POST['name'];

//下面的代码用于过滤HTML标签

//$name = strip_tags($_POST['name']);

?>

你好！ 欢迎来到传智播客。

3）在表单中输入“小明”，提交表单，效果图如下：

4）在表单中输入“小明”，提交表单运行结果如下：

5）当在PHP页面使用strip_tags()函数对变量进行处理后，结果如下：

（3）总结

1)表单数据如果不经过安全性处理，轻则破坏页面布局和显示，重则影响

网站安全。

2)使用strip_tags()函数可以轻松的将HTML、XML和PHP标签过滤，只

剩下原本的数据。

3)如果想处理文本中的单引号和双引号等字符，则需要借助

htmlspecialchars函数来完成。

4. 实现书上案例21，保存用户登录状态。详细要求和步骤参考书P120-P125。