PHP form tutorial (1)

【Foreword】

       Today, I will summarize the knowledge points related to PHP forms. I will record and summarize here, and by the way, I will draw materials for the ppt tutorial.

 

【Introduction】

Main knowledge points:

(1) Review of form elements;

(2) The difference between GET and POST;

(3) URL encoding related;

(4) Form data processing related; 

 

【List】

 (1) Summary review of form elements (front-end);

 (2) Data processing (back-end);

           ①Form validation;

           ②The form is required;

           ③Form URL/E-mail;

           ④The form is completed;

 (3) Comparison of GET and POST; 

 

【main body】

(1) Summary review of form elements

        ① What is the role of the form?

            Used to collect different types of user input

        ②What are the form elements?

           Different types of input elements, checkboxes, radio buttons, submit buttons, and more. E.g:

<input type="text"> defines a text input
<input type="radio"> defines radio buttons
<input type="checkbox"> defines a multi-select button
<input type="submit"> button to submit the form to the form-handler

        ③What are the attributes? specific role?

    1. action attribute

       Defines the action to be performed when the form is submitted. Typically, the form is submitted to a web page on the web server, for example:

<form action="action_page.php">

       In the above example, a server script is specified to handle the submitted form. If the action attribute is omitted, the action will be set to the current page

      2.Method method attribute

         Specifies the HTTP method (GET or POST) to use when submitting the form:

<form action="action_page.php" method="GET">
或:
<form action="action_page.php" method="POST">

      3. GET方法(默认方法):

         表单提交是被动的(比如搜索引擎查询),并且没有敏感信息。

         当使用 GET 时,表单数据在页面地址栏中是可见的:

demo.php?firstname=秦&lastname=始皇

         注意:GET 最适合少量数据的提交,浏览器会设定容量限制

       4. POST方法

           如果表单正在更新数据,或者包含敏感信息(例如密码)时,POST的安全性更佳,因为在页面地址栏中被提交的数据是不可见的

       5. Name属性

           规定识别表单的名称(对于 DOM 使用:document.forms.name)。如果要正确地被提交,每个输入字段必须设置一个 name 属性

          下例只会提交 "Last name" 输入字段:

<form action="demo2.php" method="get">
First name:<br>
<input type="text" value="海贼王">
<br>
Last name:<br>
<input type="text" name="lastname" value="漫画">
<br><br>
<input type="submit" value="Submit">
</form>

    action动作属性指定了demo2.php这个脚本来处理被提交表单,下面来看下demo2.php

<?php
echo "我搜索的是" . $_GET['firstname'] . "的" . $_GET['lastname'];
?>

    输出结果:我搜索的是漫画。---->因为未设置name属性,所以并未审查到first name输入的“海贼王”

       6.<fieldset> 标签

          组合表单中的相关数据,将表单内的相关元素分组,当一组表单元素放到 <fieldset> 标签内时,浏览器会以特殊方式来显示它们,它们可能有特殊的边界、3D 效果,或者甚至可创建一个子表单来处理这些元素。

       7.<legend> 标签为 fieldset 元素定义标题  

 

(2)数据处理

      PHP超全局变量 $_GET 和 $_POST 用于收集表单数据(form-data)

      ①表单验证;

      ②表单必填;

      ③表单URL/E-mail;

      ④表单完成;

具体我在后面文章里做了总结

拓展:

      GET vs POST :

      ①GET 和 POST 都创建数组(例如,array( key => value, key2 => value2, key3 => value3, ...))。此数组包含键/值对,其中的键是表单控件的名称,而值是来自用户的输入数据;

      ②GET 和 POST 被视作 $_GET 和 $_POST。它们是超全局变量,这意味着对它们的访问无需考虑作用域 - 无需任何特殊代码,您能够从任何函数、类或文件访问它们;

      ③$_GET 是通过 URL 参数传递到当前脚本的变量数组;

      ④$_POST 是通过 HTTP POST (http请求主体)传递到当前脚本的变量数组; 

 

 

(3)GET与POST对比

      ①GET 方法

         缺点:

                  1. 发送的信息对任何人都是可见的(所有变量名和值都显示在 URL 中);

                  2. 对所发送信息的数量也有限制。限制在大于 2000 个字符;

         优点:

                 由于变量显示在 URL 中,把页面添加到书签中也更为方便

         注意:GET 可用于发送非敏感的数据,绝不能使用 GET 来发送密码或其他敏感信息!

GET实例:

<form action="demo2.php" method="GET">
First name:<br>
<input type="text" name="firstname" value="海贼王">
<br>
Last name:<br>
<input type="text" name="lastname" value="漫画">
<br><br>
<input type="submit" value="Submit">
</form>
<?php
echo "我搜索的是" . $_GET['firstname'] . "的" . $_GET['lastname'];
?>

运行代码,点击搜索后查看效果即可看到URL变为

http://localhost/demo2.php?firstname=海贼王lastname=漫画  

    复制出来后会自动经过URL编码,改为

http://localhost/demo2.php?firstname=%E6%B5%B7%E8%B4%BC%E7%8E%8B&
                         lastname=%E6%BC%AB%E7%94%BB

   这里经过URL编码,具体我在文章URL编码来源及详解 里做过介绍

点击收藏按钮,即可收藏该网页,可以再次打开

 

       ②POST方法

           缺点:

                   由于变量未显示在 URL 中,也就无法将页面添加到书签

           优点:

                   1. 发送的信息对其他人是不可见的(所有名称/值会被嵌入 HTTP 请求的主体中);

                   2. 对所发送信息的数量也无限制;

                   3. 此外POST 支持高阶功能,比如在向服务器上传文件时进行 multi-part 二进制输入

POST实例:

<form action="demo2.php" method="POST">
First name:<br>
<input type="text" name="firstname" value="海贼王">
<br>
Last name:<br>
<input type="text" name="lastname" value="漫画">
<br><br>
<input type="submit" value="Submit">
</form>
<?php
echo "我搜索的是" . $_POST['firstname'] . "的" . $_POST['lastname'];
?>

运行代码,点击搜索后查看效果即可看到URL变为

http://localhost/demo2.php

点击收藏后到收藏夹,但是再次打开会发现数据消失了

 

【总结】

(1)HTML <form> 元素,已设置所有可能的属性

    案例:

<form action="action_page.php" method="GET" target="_blank" accept-charset="UTF-8"
ectype="application/x-www-form-urlencoded" autocomplete="off" novalidate>
.
form elements
 .
</form> 

    下面是 <form> 属性的列表:

accept-charset 规定在被提交表单中使用的字符集(默认:页面字符集)。
action 规定向何处提交表单的地址(URL)(提交页面)。
autocomplete 规定浏览器应该自动完成表单(默认:开启)。
enctype 规定被提交数据的编码(默认:url-encoded)。
method 规定在提交表单时所用的 HTTP 方法(默认:GET)。
name 规定识别表单的名称(对于 DOM 使用:document.forms.name)。
novalidate 规定浏览器不验证表单。
target 规定 action 属性中地址的目标(默认:_self)。

(2)提示:开发者偏爱 POST 来发送表单数据

(3)GET与POST区别的列表:

       ①GET后退按钮/刷新无害,POST数据会被重新提交(浏览器应该告知用户数据会被重新提交);

       ②GET书签可收藏,POST为书签不可收藏;

       ③GET能被缓存,POST不能缓存 ;

       ④GET编码类型application/x-www-form-url,POST编码类型encodedapplication/x-www-form-urlencoded 或 multipart/form-data。为二进制数据使用多重编码;

       ⑤GET历史参数保留在浏览器历史中,POST参数不会保存在浏览器历史中;

       ⑥GET对数据长度有限制,当发送数据时,GET 方法向 URL 添加数据;URL 的长度是受限制的(URL 的最大长度是 2048 个字符);POST无限制;

       ⑦GET只允许 ASCII 字符,POST没有限制。也允许二进制数据;

       ⑧与 POST 相比,GET 的安全性较差,因为所发送的数据是 URL 的一部分。在发送密码或其他敏感信息时绝不要使用 GET。POST 比 GET 更安全,因为参数不会被保存在浏览器历史或 web 服务器日志中。GET的数据在 URL 中对所有人都是可见的。POST的数据不会显示在 URL 中。

 (4)什么是HTTP?

        超文本传输协议(HyperText Transfer Protocol -- HTTP)是一个设计来使客户端和服务器顺利进行通讯的协议。

        HTTP在客户端和服务器之间以request-response protocol(请求-回复协议)工作。

       由于Web服务器不保存发送请求的Web浏览器进程的任何信息,所以HTTP是无状态的。

 (5)为什么GET能保存标签,而POST不能保存?

          GET能被缓存,POST不能缓存 ;

          GET历史参数保留在浏览器历史中,POST参数不会保存在浏览器历史中;

 

 

 

 

 

 

.

Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=326179738&siteId=291194637