在写完上一篇《AJAX跨域请求之JSONP》后,我觉得还有一点儿问题没有说清楚。我们在页面中做一个提交请求时,常用到的方法有form(表单提交)和AJAX(异步请求)。不管是用哪种提交方式,他们之中都有一个共同的参数即提交方法GET或POST。那么这两种请求方式在请求过程又有什么区别呢?

     下面就来对这两种提交方式做一下描述:

        一、GET与POST的区别

             1、GET方式(form表单)

                 1)、GET方式是通过URL请求传递用户所输入的内容,其提交的内容会全部显示的浏览器的地址栏中;其安全性很低。如果用户输入的内容包含密码之类的私人信息时很容易被其他人获取。

                 2)、GET方式提交需要用到Request.QueryString来取得变量的值。

                 3)、GET提交具有长度限制,最长不能超过2048字节(1024个汉字)。

                 4)、GET是从服务器上获取数据。

                 5)、GET是把参数数据队列加到提交表单的action属性所指的URL中,值和表单内容一一对应,在URL中可以看到。

<form method = "get" name = "form1" action = "getpost.asp">
	<input type="text" name="user" value="Sammy">
	<input type="text" name="callNumber" value="139xxxxx">
	<input type="submit" name="Submit" value="Submit">
</form>

// 此时在做表单提交时,用户所输入的一些个人信息都会显示在地址栏中。
// http://localhost/getpost.asp?user=Sammy&callNumber=139xxxx
// 用户的安全性比较差

                 6)、在页面重新刷新载入时,没有提示框询问“是否重新发送请求”。

                 7)、在做请求时,GET是将表单内容放到信息的请求头中。(带星号的)

☆ GET /?username=%E5%BC%A0%E4%B8%89&callNumber=139xxxxx ☆ HTTP/1.1
Accept: image/gif, image/x-xbitmap, image/jpeg, image/pjpeg, application/vnd.ms-powerpoint, application/vnd.ms-excel, application/msword, */*
Accept-Language: zh-cn
Accept-Encoding: gzip, deflate
User-Agent: Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.0; .NET CLR 1.1.4322)
Host: localhost
Connection: Keep-Alive

 

             2、POST方式(form表单)

                 1)、POST提交不会将用户所输入的个人信息显示在浏览器的地址栏中且地址栏中没有什么变化。

                 2)、POST方式提交需要用到Request.Form来取得变量的值。

                 3)、POST没有提交长度限制。

                 4)、POST是向服务器传送数据。

                 5)、POST是通过HTTP post机制,将表单内容 中各个字段与其内容旋转在HTML HEADER内一起传送到action属性所批的URL地址。用户是看不到这一过程的。

                 6)、在页面重新刷新载入时,会有提示框询问“是否重新发送请求”。

 

        二、GET和POST在AJAX提交时的情况

                 1)、在AJAX下提交时,用户所输入的内容会以字符串的形式拼接起来传递给服务器端。而此时浏览器地址中的内容不会发生变化。

                 2)、 在AJAX下提交时,分为“请求主体”和“请求头”。

// 以下为请求头

POST / HTTP/1.1
Accept: image/gif, image/x-xbitmap, image/jpeg, image/pjpeg, application/vnd.ms-powerpoint, application/vnd.ms-excel, application/msword, */*
Accept-Language: zh-cn
Content-Type: application/x-www-form-urlencoded
Accept-Encoding: gzip, deflate
User-Agent: Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.0; .NET CLR 1.1.4322)
Host: localhost
Content-Length: 28
Connection: Keep-Alive

// 以下为请求主体,即请求时所用到的具体数据信息。对应于GET中的星号部分。
username=%E5%BC%A0%E4%B8%89&callNumber=139xxxxx

如果用firebug看的话,在网络标签中会看到“参数”,“Headers”,“响应”,“HTML”和“Cookies”。其中“参数”就是请求主体;“Headers”就是请求头。

 

        三、表单(form)提交与AJAX提交适用的场合

             1、表单提交(form)

                 1)、比较适合提交用户输入信息量比较大的场合。

                 2)、表单提交的可靠性相对比较好一些。

 

             2、AJAX提交(异步请求)

                 1)、表单驱动的交互

                       在传统的表单提交中,如果想验证一下用户所输入信息的正确性就需要提交表单进行后端程序的验证;而此时用户所面对的就是一个白屏,生硬无趣!通过AJAX可以很好的改变这用户体验。

                 2)、树结构的导航

                       在表单提交中,如果想要展开某个结点树下的内容就需要进行一次表单提交,但这样就又出现了第一种情况所出现的问题。如果用AJAX可以解决响应速度,不重载页面以及避免向服务器频繁发送请求的问题。

                 3)、对数据进行过滤和操纵相关数据的场景

                       如果用户向服务器端发送了一个请求,服务器端可以给我们返回一个以json或是XML格式的信息。我们可以通过对这些返回进行过滤,以找到我们所需要的信息数据。

                 4)、自动完成功能

                       如:google和百度首页的自动完成功能(Auto Complete)

                 5)、替换大量折文本

                       使用AJAX来替换局部信息是一件不错的办法而且效果也比较直观。但是如果要用其来替换页面中大量的信息,那还不如做一次重新请求来完成。

     以上只是一个小小的总结也是在平时的工作所用到的,当然还有一些是在面试的时候被问到而没有答上来的,呵呵~~~~~   关于前端知道的还是太少了,还得好好学习,天天向上!

相关文章: