发送表单数据

您所在的位置:网站首页 form表格提交list后端 发送表单数据

发送表单数据

2024-02-12 02:42| 来源: 网络整理| 查看: 265

元素定义了如何发送数据。它的所有属性都是为了让你配置当用户点击提交按钮时发送的请求。两个最重要的属性是action和method。

action 属性

这个属性定义了发送数据要去的位置。它的值必须是一个有效的 URL。如果没有提供此属性,则数据将被发送到包含这个表单的页面的 URL。

在这个例子中,数据被发送到一个绝对 URL——http://foo.com:

html…

这里,我们使用相对 URL——数据被发送到服务器上的不同 URL

html…

在没有属性的情况下,像下面一样,数据被发送到表单出现的相同页面上:

html…

许多较老的页面使用下面的符号表示数据应该被发送到包含表单的相同页面;这是必需的,因为直到 HTML5action属性都需要该符号。现在,这不再需要了。

html…

备注: 可以指定使用 HTTPS(安全 HTTP) 协议的 URL。当你这样做时,数据将与请求的其余部分一起加密,即使表单本身是托管在使用 HTTP 访问的不安全页面上。另一方面,如果表单是在安全页面上托管的,但是你指定了一个不安全的 HTTP URL,它带有action属性,所有的浏览器都会在每次尝试发送数据时向用户显示一个安全警告,因为数据不会被加密。

method 属性

该属性定义了如何发送数据。HTTP 协议提供了几种执行请求的方法;HTML 表单数据可以通过许多不同的方法进行数据传输,其中最常见的是GET方法和POST方法。

为了理解这两种方法之间的区别,让我们回过头来看看 HTTP 是如何工作的。 每当你想要访问 Web 上的资源时,浏览器都会向 URL 发送一个请求。 HTTP 请求由两个部分组成:一个包含关于浏览器功能的全局元数据集的头部,和一个包含服务器处理特定请求所需信息的主体。

GET 方法

GET方法是浏览器使用的方法,请求服务器返回给定的资源:“嘿,服务器,我想要得到这个资源。”在这种情况下,浏览器发送一个空的主体。由于主体是空的,如果使用该方法发送一个表单,那么发送到服务器的数据将被追加到 URL。

考虑下面这个表单:

html What greeting do you want to say? Who do you want to say it to? Send my greetings

由于已经使用了GET方法,当你提交表单的时候,你将看到www.foo.com/?say=Hi&to=Mom在浏览器地址栏里。

数据作为一系列的名称/值对被附加到 URL。在 URL web 地址结束之后,我们得到一个问号 (?),后面跟着由一个与符号 (&) 互相分隔开的名称/值对。在本例中,我们将两个数据传递给服务器。

say, 它有一个 Hi的值。 to, 它有一个 Mom的值。

HTTP 请求如下:

GET /?say=Hi&to=Mom HTTP/2.0 Host: foo.com

备注: 你可以在 GitHub 上看到本例子——见 get-method.html (预览版).

POST 方法

POST方法略有不同。这是浏览器在询问响应时使用与服务器通信的方法,该响应考虑了 HTTP 请求正文中提供的数据:“嘿,服务器,看一下这些数据,然后给我回一个适当的结果。”如果使用该方法发送表单,则将数据追加到 HTTP 请求的主体中。

让我们来看一个例子,这是我们在上面的GET部分中所看到的相同的形式,但是使用method属性设置为post。

html What greeting do you want to say? Who do you want to say it to? Send my greetings

当使用POST方法提交表单时,没有数据会附加到 URL,HTTP 请求看起来是这样的,而请求主体中包含的数据是这样的:

POST / HTTP/2.0 Host: foo.com Content-Type: application/x-www-form-urlencoded Content-Length: 13 say=Hi&to=Mom

Content-Length数据头表示主体的大小,Content-Type数据头表示发送到服务器的资源类型。稍后我们将讨论这些标头。

备注: 你可以在 GitHub 上看到本例——见 post-method.html(预览版)。

查看 HTTP 请求

HTTP 请求永远不会显示给用户 (如果你想要看到它们,你需要使用诸如Firefox Network Monitor或Chrome Developer Tools之类的工具)。例如,你的表单数据将显示在 Chrome 网络选项卡中:

按下 F12 选择 "Network" 选择 "All" 在 "Name" 标签页选择 "foo.com" 选择 "Headers"

你可以获得表单数据,像下图显示的那样

唯一显示给用户的是被调用的 URL。正如我们上面提到的,使用GET请求用户将在他们的 URL 栏中看到数据,但是使用POST请求用户将不会看到。这一点很重要,有两个原因:

如果你需要发送一个密码 (或其他敏感数据),永远不要使用GET方法否则数据会在 URL 栏中显示,这将非常不安全。 如果你需要发送大量的数据,那么POST方法是首选的,因为一些浏览器限制了 URL 的大小。此外,许多服务器限制它们接受的 URL 的长度。


【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3