整合营销服务商

电脑端+手机端+微信端=数据同步管理

免费咨询热线:

如何使用PHP验证和过滤HTML表单提交的数据?示例代码剖析

用户在 HTML 表单中填写并提交数据时,可以使用 PHP 来接收并处理这些数据。要实现这一点,需要创建一个 PHP 脚本来处理提交的数据,然后将 HTML 表单的 "action" 属性设置为该脚本的文件路径。表单提交的数据需要进行验证和过滤,以确保数据的完整性和安全性。可以使用条件语句、正则表达式、过滤器函数等方法来验证和过滤数据,并使用 htmlspecialchars() 函数转义 HTML 标记,以防止 XSS 攻击。

以下是一个简单的示例:

HTML 表单代码:

<form action="submit.php" method="post">

<label for="name">Name:</label>

<input type="text" id="name" name="name">

<label for="email">Email:</label>

<input type="email" id="email" name="email">

<button type="submit">Submit</button>

</form>

PHP 代码(submit.php):

<?php

// 获取表单提交的数据

$name = $_POST['name'];

$email = $_POST['email'];

// 在这里进行处理,例如将数据存储到数据库中

// ...

// 返回一个响应,告诉用户数据已经被成功提交

echo "Thank you for submitting the form, $name!";

?>

在上面的示例中,表单的 "action" 属性设置为 "submit.php",这意味着提交表单时,数据将被发送到 submit.php 文件中的 PHP 代码中进行处理。PHP 代码使用 $_POST 数组来获取表单提交的数据,然后进行处理,例如将数据存储到数据库中。最后,PHP 代码返回一个响应,告诉用户数据已经被成功提交。在处理表单数据时,一定要对用户输入进行验证和过滤,以防止安全漏洞。

需要对表单提交的数据进行验证和过滤,以确保数据的完整性和安全性。以下是一些常见的方法:

1、验证表单字段:在 PHP 代码中使用条件语句和正则表达式等方法来验证表单字段的有效性,例如验证电子邮件地址的格式是否正确。

$email = $_POST['email'];

if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {

// 如果邮件地址格式不正确,则显示错误消息

echo "Invalid email address";

}

2、过滤输入数据:使用 PHP 中的过滤器函数来过滤表单输入数据,以防止 XSS 攻击和 SQL 注入等安全漏洞。

$name = $_POST['name'];

$name = filter_var($name, FILTER_SANITIZE_STRING); // 过滤特殊字符和标签

3、防止跨站脚本攻击(XSS):在 PHP 代码中使用 htmlspecialchars() 函数来转义 HTML 标记,防止恶意脚本注入到页面中。

$name = $_POST['name'];

$name = htmlspecialchars($name, ENT_QUOTES, 'UTF-8'); // 转义 HTML 标记

4、防止 SQL 注入攻击:在 PHP 代码中使用参数化查询或准备语句来执行数据库操作,以防止恶意 SQL 语句注入到数据库中。

$stmt = $pdo->prepare("INSERT INTO users (name, email) VALUES (:name, :email)");

$stmt->bindParam(':name', $name);

$stmt->bindParam(':email', $email);

$stmt->execute();

通过这些方法,可以确保表单提交的数据是安全和有效的,并且能够正常地处理和存储到数据库中。

单标签的作用

  • <form>标签及其属性

<from></form>标签对用来创建一个表单,即定义表单的开始和结束位置,<form>标签具有下面等属性。

  • action属性用来设置接收和处理浏览器递交的表单内容的服务器程序的URL。相对和绝对
  • Method属性用来定义浏览器将表单中的信息提交给服务器端的处理程序的方式,取值可以为:GET或POST.
  • Target属性用来指定服务器返回结果显示的目标窗口或目标帧。
  • Title属性用来设置当网站访问者的素、鼠标在表单上的任一位置停留过几秒时,浏览器用黄色小浮标显示的文本(如表单的名称或描述)。
  • Enctype属性指示浏览器使用哪种编码方法将表单数据传送给www服务器。该属性可以有两种取值:
  • application/x-www-form-urlencoded(默认的设置)
  • multipart/form-data

表单字段元素(1)

  • <input type=“submit”>
  • <input type=“reset”>
  • <input type=“text”>

属性:size、value、maxlength、readonly、disabled

  • <input type=“checkbox”>

属性:checked

  • <input type=“radio”>
  • <input type=“hidden”>
  • <input type=“password”>
  • <input type=“button”>

表单字段元素(2)

  • <input type=“file”>
  • <input type=“image”>
  • <select></select><option></option>
  • <select>标签的属性:multiple、size,name
  • <option>标签的属性:value、selected

如何在列表中实现取消选项

  • <textarea></textarea>

属性:cols、rows

  • <label>

属性:for、accesskey

我们在浏览网页的时候,经常需要向服务器提交信息,并让后台程序处理。浏览器中使用 GET 和 POST 方法向服务器提交数据。

GET 方法

GET方法将请求的编码信息添加在网址后面,网址与编码信息通过"?"号分隔。如下所示:

http://www.runoob.com/hello?key1=value1&key2=value2

GET方法是浏览器默认传递参数的方法,一些敏感信息,如密码等建议不使用GET方法。

用get时,传输数据的大小有限制 (注意不是参数的个数有限制),最大为1024字节。

POST 方法

一些敏感信息,如密码等我们可以通过POST方法传递,POST提交数据是隐式的。

POST提交数据是不可见的,GET是通过在url里面传递的(可以看一下你浏览器的地址栏)。

JSP使用getParameter()来获得传递的参数,getInputStream()方法用来处理客户端的二进制数据流的请求。

JSP 读取表单数据

  • getParameter(): 使用 request.getParameter() 方法来获取表单参数的值。

  • getParameterValues(): 获得如checkbox类(名字相同,但值有多个)的数据。 接收数组变量 ,如checkbox类型

  • getParameterNames():该方法可以取得所有变量的名称,该方法返回一个Emumeration。

  • getInputStream():调用此方法来读取来自客户端的二进制数据流。



使用URL的 GET 方法实例

以下是一个简单的URL,并使用GET方法来传递URL中的参数:

http://localhost:8080/testjsp/main.jsp?name=菜鸟教程&url=http://ww.runoob.com

testjsp 为项目地址。

以下是 main.jsp 文件的JSP程序用于处理客户端提交的表单数据,我们使用getParameter()方法来获取提交的数据:

<%@ page language="java" contentType="text/html; charset=UTF-8"

pageEncoding="UTF-8"%>

<%@ page import="java.io.*,java.util.*" %>

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>菜鸟教程(runoob.com)</title>

</head>

<body>

<h1>使用 GET 方法读取数据</h1>

<ul>

<li><p><b>站点名:</b>

<%= request.getParameter("name")%>

</p></li>

<li><p><b>网址:</b>

<%= request.getParameter("url")%>

</p></li>

</ul>

</body>

</html>

接下来我们通过浏览器访问 http://localhost:8080/testjsp/main.jsp?name=菜鸟教程&url=http://ww.runoob.com 输出结果如下所示:

使用表单的 GET 方法实例

以下是一个简单的 HTML 表单,该表单通过GET方法将客户端数据提交 到 main.jsp 文件中:

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>菜鸟教程(runoob.com)</title>

</head>

<body>

<form action="main.jsp" method="GET">

站点名: <input type="text" name="name">

<br />

网址: <input type="text" name="url" />

<input type="submit" value="提交" />

</form>

</body>

</html>

将以上HTML代码保存到test.htm文件中。 将该文件放置于当前jsp项目的 WebContent 目录下(与 main.jsp 同一个目录)。

通过访问 http://localhost:8080/testjsp/test.html 提交表单数据到 main.jsp 文件,演示 Gif 图如下所示:

在 "站点名" 与 "网址" 两个表单中填入信息,并点击 "提交" 按钮,它将输出结果。

使用表单的 POST 方法实例

接下来让我们使用POST方法来传递表单数据,修改main.jsp与Hello.htm文件代码,如下所示:

main.jsp文件代码:

<%@ page language="java" contentType="text/html; charset=UTF-8"

pageEncoding="UTF-8"%>

<%@ page import="java.io.*,java.util.*" %>

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>菜鸟教程(runoob.com)</title>

</head>

<body>

<h1>使用 POST 方法读取数据</h1>

<ul>

<li><p><b>站点名:</b>

<%

// 解决中文乱码的问题

String name = new String((request.getParameter("name")).getBytes("ISO-8859-1"),"UTF-8");

%>

<%=name%>

</p></li>

<li><p><b>网址:</b>

<%= request.getParameter("url")%>

</p></li>

</ul>

</body>

</html>

代码中我们使用 new String((request.getParameter("name")).getBytes("ISO-8859-1"),"UTF-8")来转换编码,防止中文乱码的发生。

以下是test.htm修改后的代码:

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>菜鸟教程(runoob.com)</title>

</head>

<body>

<form action="main.jsp" method="POST">

站点名: <input type="text" name="name">

<br />

网址: <input type="text" name="url" />

<input type="submit" value="提交" />

</form>

</body>

</html>

通过访问 http://localhost:8080/testjsp/test.html 提交表单数据到 main.jsp 文件,演示 Gif 图如下所示:

传递 Checkbox 数据到JSP程序

复选框 checkbox 可以传递一个甚至多个数据。

以下是一个简单的HTML代码,并将代码保存在test.htm文件中:

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>菜鸟教程(runoob.com)</title>

</head>

<body>

<form action="main.jsp" method="POST" target="_blank">

<input type="checkbox" name="google" checked="checked" /> Google

<input type="checkbox" name="runoob" /> 菜鸟教程

<input type="checkbox" name="taobao" checked="checked" />

淘宝

<input type="submit" value="选择网站" />

</form>

</body>

</html>

以上代码在浏览器访问如下所示:

以下为main.jsp文件代码,用于处理复选框数据:

<%@ page language="java" contentType="text/html; charset=UTF-8"

pageEncoding="UTF-8"%>

<%@ page import="java.io.*,java.util.*" %>

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>菜鸟教程(runoob.com)</title>

</head>

<body>

<h1>从复选框中读取数据</h1>

<ul>

<li><p><b>Google 是否选中:</b>

<%= request.getParameter("google")%>

</p></li>

<li><p><b>菜鸟教程是否选中:</b>

<%= request.getParameter("runoob")%>

</p></li>

<li><p><b>淘宝是否选中:</b>

<%= request.getParameter("taobao")%>

</p></li>

</ul>

</body>

</html>

通过访问 http://localhost:8080/testjsp/test.html 提交表单数据到 main.jsp 文件,演示 Gif 图如下所示:

读取所有表单参数

以下我们将使用 HttpServletRequestgetParameterNames() 来读取所有表单参数,该方法可以取得所有变量的名称,该方法返回一个枚举。

一旦我们有了一个 Enumeration(枚举),我们就可以调用 hasMoreElements() 方法来确定是否还有元素,以及使用nextElement()方法来获得每个参数的名称。

<%@ page language="java" contentType="text/html; charset=UTF-8"

pageEncoding="UTF-8"%>

<%@ page import="java.io.*,java.util.*" %>

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>菜鸟教程(runoob.com)</title>

</head>

<body>

<h1>读取所有表单参数</h1>

<table width="100%" border="1" align="center">

<tr bgcolor="#949494">

<th>参数名</th><th>参数值</th>

</tr>

<%

Enumeration paramNames = request.getParameterNames();

while(paramNames.hasMoreElements()) {

String paramName = (String)paramNames.nextElement();

out.print("<tr><td>" + paramName + "</td>\n");

String paramValue = request.getParameter(paramName);

out.println("<td> " + paramValue + "</td></tr>\n");

}

%>

</table>

</body>

</html>

以下是test.htm文件的内容:

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>菜鸟教程(runoob.com)</title>

</head>

<body>

<form action="main.jsp" method="POST" target="_blank">

<input type="checkbox" name="google" checked="checked" /> Google

<input type="checkbox" name="runoob" /> 菜鸟教程

<input type="checkbox" name="taobao" checked="checked" />

淘宝

<input type="submit" value="选择网站" />

</form>

</body>

</html>

现在我们通过浏览器访问 test.htm 文件提交数据,输出结果如下:

通过访问 http://localhost:8080/testjsp/test.html 提交表单数据到 main.jsp 文件,演示 Gif 图如下所示:

你可以尝试使用以上的JSP代码读取其它对象,如文本框,单选按钮或下拉框等等其他形式的数据。

如您还有不明白的可以在下面与我留言或是与我探讨QQ群308855039,我们一起飞!