码迷,mamicode.com
首页 > Web开发 > 详细

详解http之post

时间:2017-05-21 23:20:38      阅读:2928      评论:0      收藏:0      [点我收藏+]

标签:page   color   art   ror   images   example   文件   没有   request   

详解http之post

  首先,我们先看看jquery中的post方法的使用:

 $.ajax({
          url:api/bbg/goods/get_goods_list_wechat,
          data:{
            data: JSON.stringify({"offset": 0,
                       "pageSize": 25
                    })        
          },   
          beforeSend: function(request) {
            request.setRequestHeader("BBG-Key", "ab9ef204-3253-49d4-b229-3cc2383480a6");
          }, 
          type:post,  
          dataType:json,  
          success:function(data){      
            console.log(data);
          },
          error: function (error) {
            console.log(err);
          },
          complete: function () {
            
          }
        });
  •  url指定访问的接口。
  • data表示post键值对。 
  • beforeSend里我们可以设置请求头。
  • type表示请求的方法。
  • dataType表示希望获得的数据形式。
  • success表示成功后调用的函数。
  • error表示失败后调用的函数。
  • complete表示请求完成后的函数。

 

  下面主要介绍post提交数据的方式。

  我们知道post请求包括状态行、请求头、请求主体。 如下:

<method> <request-URL> <version> --- 状态行
<headers> --- 请求头

<entity-body> --- 请求主体

 

  协议规定, post的数据即ajax中的data必须在请求主体中,但是协议并没有规定你请求主体中的数据格式,所以,这时我们就有自己的空间规定请求主体中的数据格式了。 

  但是,虽然你发送的格式是各种各样的,但还是要根据服务器端对你的数据的要求来确定,否则服务器端是无法正确解析的。 

  并且服务器端是根据请求头中的Content-Type字段获知请求主体中的数据是何种方式编码。然后根据格式再对其进行解析。

 

First --- application/x-www-form-urlencoded

  这是最常见的提交post数据的方式,如果在form表单中我们没有设置enctype属性,那么表单最终就会以这种方式来提交数据了。请求类似于下面这样。

POST http://www.example.com HTTP/1.1
Content-Type: application/x-www-form-urlencoded;charset=utf-8

title=test&sub%5B%5D=1&sub%5B%5D=2&sub%5B%5D=3

  即在请求主体中的数据都是key1=value1&key2=value2&key3=value3的形式进行编码的, key1就对应于表单中的name属性的值,value1就对应于表单中的value中的值,这样的方式是最为普遍的方式。 

  大多数服务器端的语言对此都有很好的支持。并且,我们使用jquery、zepto时,默认的content-type的值也是 x-www-form-urlencoded 的编码方式。

  之所以说是urlencoded,是因为浏览器会对其中的key和value都使用encodeURI的方法进行编码。 form即为form表单。  

举例: 我们登录github,然后找到相应的请求,可以看到请求中的Form Data如下:

技术分享

 


这默认就是使用 x-www-form-urlencoded 的方式进行编码数据的,这为什么和上面讲述的不一样呢? 因为这里是parse过得,方便开发者查看,如果我们希望查看像之前所讲的那样的数据,可以点击view source,如下所示:

技术分享

那么 view URL encoded是什么呢? 即对所有的特殊符号进行编码,类似于对整个URL使用 encodeURI 的方式进行编码是一样的,如下所示:

技术分享

 

 

 

 

Second  ---  multipart/form-data

  这也是一种非常常见的形式,比如当一个form表单中含有文件需要上传时,我们就需要将form的enctype的值设置为 multipart/form-data 这样才能成功上传文件。 下面是一个例子:

Content-Type:multipart/form-data; boundary=----WebKitFormBoundaryrGKCBY7qhFd3TrwA

------WebKitFormBoundaryrGKCBY7qhFd3TrwA

Content-Disposition: form-data; name="text"

title

------WebKitFormBoundaryrGKCBY7qhFd3TrwA

Content-Disposition: form-data; name="file"; filename="chrome.png"

Content-Type: image/png

PNG ... content of chrome.png ...

------WebKitFormBoundaryrGKCBY7qhFd3TrwA--

  这个例子中, 首先生成了 boundary 用于分割不同的字段,为了避免和正文内容重复,所以boundry很长很复杂。 且开头就指明了 Content-Type 是用multipart/form-data进行编码的。 

  消息主题按照字段的个数又分为了多个结构类似的部分。 每一部分都是用--boundry 开始,紧接着就是内容描述信息,接着就是描述字段的具体内容(或者是文本或者是二进制)。 如果包含的是文件,还要包含文件名和文件类型信息。

  消息主体最后是用 --boundry--表示结束。

  这种方式用来上传文件,各大服务器端语言对之都有很好的支持。 

 

举例: 在知乎中上传图片时,使用的方式就是 multipart/form-data。

技术分享

然后我们还可以看到请求主体中的内容:

技术分享

可以看到在请求头中先设置了boundary(即分界线的意思), 然后再在请求主体中使用, 最后以 ------。。。--- 作为结束。

 

 

 

Third --- application/json

   现在越来越多的人将 Content-Type 的值用 application 作为响应头, 这用来告诉服务器---消息主体是序列化之后的JSON字符串。 

   由于JSON规范的流行,除了低版本IE之外的各大浏览器都原生的支持JSON.stringify, 服务器端语言也都有处理JSON的函数, 使用JSON之后是不会遇到什么麻烦的。

   好处: JSON格式支持比键值对复杂得多的结构化数据, 这一点很有用。

   

举例:在知乎中同样可以看到这样的使用方式。

技术分享

 

其JSON内容为:

技术分享

 

 

 

 

Fourth --- text/xml

  使用这种传输方式的具体例子如下:

POST http://www.example.com HTTP/1.1

Content-Type: text/xml

<!--?xml version="1.0"?-->

<methodcall>

<methodname>examples.getStateName</methodname>

<params>

<param>

<value><i4>41</i4></value>


</params>

</methodcall>

  即其主体为XML格式的。

  这种方式使用简单,但是比较臃肿,一般还是JSON用起来更为方便。

 

 

 

 

 

  

 

 

  

  

 

详解http之post

标签:page   color   art   ror   images   example   文件   没有   request   

原文地址:http://www.cnblogs.com/zhuzhenwei918/p/6886427.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!