记录POST请求头中常见的content-type

426 阅读2分钟

HTTP请求头的Content-Type字段是约定HTTP body内容编码类型,服务端会根据该字段正确的解码 HTTP body内容。

常见的Content-Type有如下几个:

1、application/x-www-form-urlencoded
2、multipart/form-data
3、application/json

1、application/x-www-form-urlencoded

POST最常见的数据提交方式。浏览器原生form表单,在不设置enctype属性的情况下,会默认以application/x-www-form-urlencoded方式提交数据。

举例:

    <form action="/login" method="POST">      <label>姓名:<input type="text" name="name"/></label>      <label>年龄:<input type="text" name="age"/></label>      <input type="submit" value="Submit" />    </form>

打开浏览器开发者工具,在Request Headers中我们可以看到Content-Type的属性值为application/x-www-form-urlencoded; 在提交的数据中会按照key1=val1&key2=val2 的方式进行编码,而且其中的key和val都会进行URL转码

2、multipart/form-data

此提交方式用于表单上传文件,必须设置form表单的enctype属性为multipart/form-data。

举例:

上图可以看到Request Headers中的Content-Type属性值为multipart/form-data,同时浏览器会自动生成一个boundary(边界)值。

------WebKitFormBoundaryrbEWVKEzx4hDoZL2
Content-Disposition: form-data; name="usename"
aaa
------WebKitFormBoundaryrbEWVKEzx4hDoZL2
Content-Disposition: form-data; name="file"; filename="part-00321-2386.jpg"
Content-Type: image/jpeg

------WebKitFormBoundaryrbEWVKEzx4hDoZL2--

上面是消息的主题内容,可以看到每部分都是由Content-Type属性值的boundary值开始,然后是描述信息,最后是具体内容。如果传输内容包含文件,里面还有具体的文件名称和文件类型。最后以boundary--结尾。

3、application/json

开发中最最常见的响应头。由于现在的绝大多数浏览器对JSON的支持和服务端对JSON的快速处理,使得此响应头在开发中越来越常见。

使用过程也非常简单,只要将Content-Type属性值设置为application/json,并将提交的数据用JSON.stringify转换为字符串即可。