intheHttprequest-----搞前端的人学http相关知识已经不行了~作者也是后知后觉了。在做node的时候,意识到网络的弱点,开始学习http相关知识。本文是非常基础的讲解,适合初学者掌握内容型知识和有经验的人员参考。可以说,了解了content-type,就可以在学习http的道路上走得更加顺畅。激情出发吧~~两个特点1.了解content-type要学习content-type,你必须提前知道它是什么,有什么用。HTTP协议(RFC2616)采用请求/响应模型。客户端向服务器发送请求。请求标头包含请求方法、URI、协议版本和类似MIME的消息结构,包括请求修饰符、客户端信息和内容。服务器以包含消息协议版本、成功或错误代码以及服务器信息、实体元信息和可能的实体内容的状态行进行响应。通常,一条HTTP消息由起始行、一个或多个标头字段、标头字段末尾的空行和可选的消息正文组成。HTTP的头域包括四部分:通用头、请求头、响应头和实体头。每个头字段由一个域名、一个冒号(:)和一个字段值组成。域名不区分大小写。字段值前面可以有任意数量的空格。标题字段可以扩展到多行。在每一行的开头,至少使用一个空格或制表符。请求消息和响应消息都可以包含实体信息,实体信息一般由实体头字段和实体组成。实体头字段包含有关实体的原始信息。实体头包括Allow、Content-Base、Content-Encoding、Content-Language、Content-Length、Content-Location、Content-MD5、Content-Range、Content-Type、Etag、Expires、Last-Modified、extension-header。Content-Type是返回消息中很重要的内容,表示后面的文档属于什么MIME类型。内容类型:[类型]/[子类型];范围。比如最常见的是text/html,表示返回的内容是文本类型的,这个文本是HTML格式的。原则上浏览器会根据Content-Type决定如何显示返回的消息体内容。2.Content-Type与Accept(1)Accept属于请求头,Content-Type属于实体头。Http头分为通用头、请求头、响应头和实体头。请求者的http头结构:通用头|请求头|实体头响应者的http头结构:通用头|响应头|实体头(2)Accept表示发送者(客户端)要接受的数据类型。例如:接受:文本/xml;表示客户端要接受的数据类型是xml类型。Content-Type表示发送方(client|server)发送的实体数据的数据类型。例如:Content-Type:text/html;表示发送方发送的数据格式为html。结合两者,Accept:text/xml;Content-Type:text/html表示你要接受的数据类型是xml格式,本次请求发送的数据的数据格式是html。3.Content-typequickcheck更全面的请访问:http://www.runoob.com/http/ht...常见的媒体格式类型如下:text/html:HTML格式text/plain:纯文本格式text/xml:XML格式image/gif:gif图片格式image/jpeg:jpg图片格式image/png:png图片格式mediaformattype以application开头:application/xhtml+xml:XHTML格式application/xml:XML数据格式application/atom+xml:AtomXML聚合格式application/json:JSON数据格式application/pdf:pdf格式application/msword:Word文档格式application/octet-stream:二进制流数据(比如普通文件下载)application/x-www-form-urlencoded:中默认的encType,将form表单数据编码成key/value格式发送给服务器(表单默认的提交数据格式)常见的以audio开头的媒体格式文件:'audio/x-wav':wav文件'audio/x-ms-wma':wma文件'audio/mp3':mp3文件以视频开头的通用媒体格式文件:'video/x-ms-wmv':wmv文件'video/mpeg4':mp4文件'video/avi':avi文件上传文件时使用另一种常见的媒体格式:multipart/form-data:上传表单文件时需要使用该格式4.常见的content-type解释(1)application/x-www-form-urlencoded这应该是最常见的通过POST提交数据的方式。对于浏览器原生的form表单,如果不设置enctype属性,最终会以application/x-www-form-urlencoded的形式提交数据。请求类似如下(本文省略无关请求头):POSThttp://www.example.comHTTP/1.1Content-Type:application/x-www-form-urlencoded;charset=utf-8title=test&sub%5B%5D=1&sub%5B%5D=2&sub%5B%5D=3首先Content-Type指定为application/x-www-form-urlencoded;其次,提交的数据是按照key1=val1&key2=val2同样的方式编码的,key和val都是经过url转码的。大多数服务器端语言都对这种方式有很好的支持。比如在PHP中,$_POST['title']可以得到title的值,$_POST['sub']可以得到sub数组。很多时候,我们在使用Ajax提交数据的时候,也会用到这种方式。例如在JQuery和QWrap的Ajax中,Content-Type的默认值为“application/x-www-form-urlencoded;charset=utf-8”。(2)multipart/form-data这是另一种常见的POST数据提交方式。当我们使用表单上传文件时,必须让表单的enctyped等于这个值。客户端表单标签:直接看一个生成的请求示例:POSThttp://www.example.comHTTP/1.1内容类型:多部分/表单数据;boundary=----WebKitFormBoundaryrGKCBY7qhFd3TrwA------WebKitFormBoundaryrGKCBY7qhFd3TrwAContent-Disposition:form-data;name="text"title------WebKitFormBoundaryrGKCBY7qhFd3TrwAContent-Disposition:Dispositionform-data;名称=“文件”;filename="chrome.png"Content-Type:image/pngPNG...contentofchrome.png...------WebKitFormBoundaryrGKCBY7qhFd3TrwA--首先生成一个boundarywith以便分隔不同的字段,顺序为避免与正文内容重复,边界很长很复杂。然后Content-Type表示数据编码在multipart/form-data中,这个请求的边界是什么。消息体根据字段的个数分成多个结构相似的部分。每部分以-boundary开头,后面是内容描述信息,后面是回车,最后是字段的具体内容(文本或二进制)。如果传输的是文件,还包括文件名和文件类型信息。消息正文以--boundary-标志结束。mutipart/form-data的详细定义请到rfc1867查看。这种方式一般用于上传文件,各大服务器语言也都有很好的支持。上面提到的POST数据的两种方式浏览器都原生支持,现阶段原生的form表单只支持这两种方式。但是随着越来越多的网站,尤其是WebApps,都使用Ajax进行数据交互,我们完全可以定义新的数据提交方式,为开发带来更多的便利。(3)application/jsonapplication/json,作为响应头的Content-Type,大家肯定不陌生。事实上,现在越来越多的人将它作为请求头来告诉服务器消息体是一个序列化的JSON字符串。由于JSON规范的流行,除了低版本的IE,所有主流浏览器都原生支持JSON.stringify,而且服务端语言也有处理JSON的函数,所以使用JSON不会遇到什么麻烦。JSON格式支持比键值对复杂得多的结构化数据也很有用。记得几年前做项目的时候,需要提交的数据层级非常深。我提交的是JSON序列化后的数据。但是当时我是把json字符串作为val,还是放在key-valuepair里面,以x-www-form-urlencoded的形式提交。Google的AngularJS中的Ajax功能默认是提交一个JSON字符串。例如,以下代码:vardata={'title':'test','sub':[1,2,3]};$http.post(url,data).success(function(result){。..});最后发送的请求是:POSThttp://www.example.comHTTP/1.1Content-Type:application/json;charset=utf-8{"title":"test","sub":[1,2,3]}该方案可以轻松提交复杂的结构化数据,特别适合RESTful接口。主流的抓包工具,比如Chrome内置的开发者工具、Firebug、Fiddler,都会将JSON数据以树状结构展示出来,非常友好。但是,一些服务端语言还不支持这种方式。例如,PHP无法通过$_POST对象从上述请求中获取内容。这时候就需要自己动手了:当请求头中的Content-Type为application/json时,从php://input中获取原始输入流,然后json_decode成一个对象。一些php框架已经这样做了。(4)text/xml是一种以HTTP为传输协议,以XML为编码方式的远程调用规范。典型的XML-RPC请求如下所示:POSThttp://www.example.comHTTP/1.1Content-Type:text/xmlexamples.getStateName41XML-RPC协议简单实用,各种语言都有所有实施。应用也很广泛,比如WordPress的XML-RPCApi,搜索引擎的ping服务等等。在JavaScript中也有现成的库支持这种方式的数据交互,可以很好的支持现有的XML-RPC服务。不过个人认为XML结构还是过于臃肿,一般场景使用JSON更灵活方便。三篇后记RFC2616:https://www.w3.org/Protocols/...内容参考:(1)http://blog.csdn.net/bluehear...(2)https://www.topjishu。com/6324...(3)http://blog.csdn.net/muzizong...