• Accept 表示请求方希望的资源类型,或者能解析识别的类型
  • Content-Type 表示实际发送的资源类型

这里资源类型通过 MIME types 表示。

Accept

Accept 是浏览器发送的请求头,用于表示想要的资源类型。根据请求的上下文不同,所设置的 Accept 请求头会相应变化。服务器根据 content negotiation 规则选择最合适的类型设置 Content-Type 并返回。

例如请求路由页面时,Chrome 设置 Accept 为

Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8

对于页面中的样式文件 css,其 Accept 为:

Accept: text/css,*/*;q=0.1

可用的值有以下几种:

  • <MIME_type>/<MIME_subtype>,精确指定,示例: text/html
  • <MIME_type>/*, 不限制子类型,比如 image/* 会匹配 image/pngimage/svgimage/gif 以及其他任何图片类型。
  • */* 任意 MIME 类型。
  • ;q= (q-factor weighting) 多种类型组合的情况,通过指定权重(quality value)来表明每种类型的优先级。

Quality value

Header 中逗号分隔的值,每项的权重,或优先级。

比如:

text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8

表示:

优先级
text/htmlapplication/xhtml+xml 1.0
application/xml 0.9
*/* 0.8

Content-Type

用来表示资源的类型。某些情况下,浏览器会对资源的类型进行嗅探而忽略掉服务器返回的 Content-Type。如果想强制客户端使用服务器返回的类型,可加上 X-Content-Type-Options:nosniff 响应头。

支持的值有:

  • media-type,常见的 Content-Type 可 参考这里
  • charset,指定资源编码类型。
  • boundary, 多个资源实例情况下,指定资源的分界符。比如 form 表单提交时分隔多个表单字段,见后面示例。

一般情况下,包含在由服务器发送给客户端的响应头里。但也存在浏览器发送给服务器的情况,比如 POST 请求,表单提交这种由浏览器向服务器发送数据的情况下。

表单的提交类型

form 表单中,提交的内容类型通过表单的 enctype 属性来指定。包含两种:

  • application/x-www-form-urlencoded 较古老的格式,只支持简单文本,不支持文件上传。
  • multipart/form-data 较新,支持文件上传,尺寸较大的二进制数据等。

一个表单提交示例

通过 koa.js 搭建一个简单的表单提交示例,以查看 Content-Type。

server.js

const { createReadStream } = require("fs");
const Koa = require("koa");
const app = new Koa();
const router = require("koa-router")();
const koaBody = require("koa-body"); router

.get("/", async ctx => {

ctx.type = "html";

ctx.body = createReadStream("form.html");

})

.post(

"/submit",

koaBody({

multipart: true

}),

ctx => {

console.log("form data is:", ctx.request.body);

ctx.body = JSON.stringify(ctx.request.body);

}

); app.use(router.routes()); app.listen(3000); console.log(</span>server started at http://localhost:3000<span class="pl-pds">);

form.html

<form action="/submit" method="POST" enctype="multipart/form-data">
foo:<input type="text" name="foo" />
bar:<input type="text" name="bar" />
<button type="submit">submit</button>
</form>

访问页面并提交后,可在 Chrome DevTools 网络面板看到,/submit 这个 POST 请求相关的信息:

Request Headers


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

Form Data

------WebKitFormBoundaryNgS8sggyuawQSr8W
Content-Disposition: form-data; name="foo" 1

------WebKitFormBoundaryNgS8sggyuawQSr8W

Content-Disposition: form-data; name="bar" 2

------WebKitFormBoundaryNgS8sggyuawQSr8W--

这里 ------WebKitFormBoundaryNgS8sggyuawQSr8W 便是上面提到的 boundary ,用以分隔表单内容字段。

内容协商/Content Negotiation

前面提到客户端通过设置 Accept 请求头设置请求资源的类型,服务器根据 content negotiation 规则返回。

Content negotiation 是这么一种机制,同一 URI可响应多种资源,客户端可自行决定请求何种资源(譬如文档的语言,图片格式,文件编码类型)。





来自 MDN 展示内容协商流程的图片

内容协商包含两种方式:

  • 客户端通过设置请求头由服务器决定合适的类型进行返回(服务器驱动 )。
  • 服务器通过设置响应头中响应代码为 300 (Multiple Choices)或 406 (Not Acceptable)作为备用方案(客户端驱动)。

除了 Accept ,用于主动发起内容协商的请求头还有:

  • Accept-Charset:期望的字符集。
  • Accept-Encoding:期望的编码方式。
  • Accept-Language:期望的语言。

服务器驱动的内容协商

由客户端发送一组期望的类型,服务器根据自己的算法决定出最合适的类型进行返回,具体实现因服务器类型而异。服务器驱动是最常见的方式,但其也有一些明显的缺点:

  • 由于不是完全了解客户端的兼容性,服务器的返回有时候存在局限性。相反,客户端驱动的是服务器返回多个选择,客户端根据自己的情况选用最合适的,因为客户端自己最了解自己支持哪些。
  • 关于客户端的信息在多次请求中会冗余(当然,请求头冗余的情况在 HTTP/2 中有所缓解),也存在安全隐患(HTTP fingerprinting)。
  • 多种类型的资源被返回后,服务端的缓存策略不再那么有效并且实现会变得复杂。

客户端驱动的内容协商



来自 MDN 展示客户端驱动内容协商流程的图片

得到真实资源前多了一次选择的请求。

参考

Accept 与 Content-Type的更多相关文章

  1. Jsoup问题---获取http协议请求失败 org.jsoup.UnsupportedMimeTypeException: Unhandled content type. Must be text/*, application/xml, or application/xhtml+xml.

    Jsoup问题---获取http协议请求失败 1.问题:用Jsoup在获取一些网站的数据时,起初获取很顺利,但是在访问某浪的数据是Jsoup报错,应该是请求头里面的请求类型(ContextType)不 ...

  2. jmeter报"msg":"Content type 'application/x-www-form-urlencoded;charset=UTF-8' not supported"的解决方法

    1.报"msg":"Content type 'application/x-www-form-urlencoded;charset=UTF-8' not supporte ...

  3. 接入WxPusher微信推送服务出现错误:Content type 'application/x-www-form-urlencoded;charset=UTF-8' not supported

    背景 使用WxPusher微信推送服务 ,可以及时的将服务的一些运行异常信息,发送到自己的微信上,方便了解服务的运行状态(PS:这个服务是免费的). 你可以在这里看到WxPusher微信推送服务的接入 ...

  4. Jsoup获取部分页面数据失败 org.jsoup.UnsupportedMimeTypeException: Unhandled content type. Must be text/*, application/xml, or application/xhtml+xml.

    用Jsoup在获取一些网站的数据时,起初获取很顺利,但是在访问某浪的数据是Jsoup报错,应该是请求头里面的请求类型(ContextType)不符合要求. 请求代码如下: private static ...

  5. SharePoint自动化系列——Add content type to list.

    转载请注明出自天外归云的博客园:http://www.cnblogs.com/LanTianYou/ 将创建好的content type(若是跨web application需要事先publish c ...

  6. SharePoint自动化系列——Content Type相关timer jobs一键执行

    转载请注明出自天外归云的博客园:http://www.cnblogs.com/LanTianYou/ 背景: 在SharePoint Central Administration->Monito ...

  7. 转载 SharePoint【Site Definition 系列】– 创建Content Type

    转载原地址:  http://www.cnblogs.com/wsdj-ITtech/archive/2012/09/01/2470274.html Sharepoint本身就是一个丰富的大容器,里面 ...

  8. the request doesn't contain a multipart/form-data or multipart/form-data stream, content type header

    the request doesn't contain a multipart/form-data or multipart/form-data stream, content type header ...

  9. Springs Element 'beans' cannot have character [children], because the type's content type is element-only

    Springs Element 'beans' cannot have character [children], because the type's content type is element ...

  10. springboot 报错 Content type 'application/x-www-form-urlencoded;charset=UTF-8' not supported

    开始 controller 方法写的是 @RequestMapping( value = "/add", method = RequestMethod.POST ) public ...

随机推荐

  1. poj~1904

    Description Once upon a time there lived a king and he had N sons. And there were N beautiful girls ...

  2. 理解、学习与使用 Java 中的 Optional

    从 Java 8 引入的一个很有趣的特性是 Optional  类.Optional 类主要解决的问题是臭名昭著的空指针异常(NullPointerException) -- 每个 Java 程序员都 ...

  3. B20J_2733_[HNOI2012]永无乡_权值线段树合并

    B20J_2733_[HNOI2012]永无乡_权值线段树合并 Description:n座岛,编号从1到n,每座岛都有自己的独一无二的重要度,按照重要度可以将这n座岛排名,名次用1到 n来表示.某些 ...

  4. BZOJ_1070_[SCOI2007]修车_费用流

    BZOJ_1070_[SCOI2007]修车_费用流 Description 同一时刻有N位车主带着他们的爱车来到了汽车维修中心.维修中心共有M位技术人员,不同的技术人员对不同 的车进行维修所用的时间 ...

  5. Nginx重新编译添加新模块

    找到nginx的安装包目录,如果没有的话去官网重新下载 查看ngixn版本极其编译参数 /usr/local/nginx/sbin/nginx -V 进入nginx源码目录,重新设置nginx ./c ...

  6. Form表单 JSON Content-type解析

    Form表单 JSON Content-type解析 1 表单Form概述 在Form表单中,参数一般有: action 表单提交的url method 提交方式:post get name 表单的属 ...

  7. Angular2+ 使用 Protractor 与 Modify Header Value (HTTP Headers) 插件 完成 Windows Authorization 验证

    入职新公司第二周,接到了一个E2E测试的任务,两天的时间把所有的测试条件都写完了,结果剩下三天都卡在了Windows Authorization验证这里. 先说一下公司项目Authorize的逻辑 第 ...

  8. Linux上好用的工具集合

    1.截图工具 WIndows下有Snipaste,Ubuntu自带的截图工具不能涂鸦等,不好用.Linux下可以使用deepin-screenshot(深度截图,https://www.deepin. ...

  9. 蚂蚁通讯框架SOFABolt之私有通讯协议设计

    前言 SOFABolt 是蚂蚁金融服务集团开发的一套基于 Netty 实现的网络通信框架. 为了让 Java 程序员能将更多的精力放在基于网络通信的业务逻辑实现上,而不是过多的纠结于网络底层 NIO ...

  10. es6学习笔记-proxy对象

    前提摘要 尤大大的vue3.0即将到来,虽然学不动了,但是还要学的啊,据说vue3.0是基于proxy来进行对值进行拦截并操作,所以es6的proxy也是要学习一下的. 一 什么是proxy Prox ...