📖前言

当今互联网中,我们所浏览的网页中通常会包含各种不同类型的文件,如图像、音频、视频以及其他的数据文件。当浏览器发出对这些不同类型文件的请求时,服务器需要知道它们的正确类型,以便能正确处理它们。MIME (Multipurpose Internet Mail Extensions) 类型就是用于描述在互联网上交换的不同类型文件的标准化方式。在本文中,我们将介绍 MIME 类型的概念、作用以及常见的 MIME 类型。

📝定义

当我们在浏览器中访问一个网页时,浏览器需要根据HTTP响应头部的Content-Type字段来识别所接收的数据格式,才能够正确地渲染页面或处理数据。而这个Content-Type字段中所表示的数据格式类型就是MIME类型

MIME类型Multipurpose Internet Mail Extensions,通常翻译为多用途互联网邮件扩展类型或媒体类型)用于标记Internet上的文档、图片、视频等资源及其对应的内容类型。它最初的设计目的是为了应对电子邮件传输中多种类型文件的传输和呈现问题,随后被应用于HTTP协议的通信过程中。

MIME类型在IETF RFC 6838中进行了定义和标准化。

互联网号码分配机构(IANA)是负责跟踪所有官方 MIME 类型的官方机构,您可以在媒体类型页面中找到最新的完整列表。

浏览器通常使用 MIME 类型(而不是文件扩展名)来确定如何处理 URL,因此 Web 服务器在响应头中添加正确的 MIME 类型非常重要。如果配置不正确,浏览器可能会曲解文件内容,网站将无法正常工作,并且下载的文件也会被错误处理。

🔧结构

组成

MIME类型的结构是”type/subtype”,两者都是字符串,type表示主类型,subtype表示子类型。主类型和子类型通过斜杠 “/“ 分割,可以有多个子类型属于同一个主类型。例如,图片的主类型是image,其中的子类型有jpegpnggif

type(主类型)一般代表数据类型所属的一般类别,例如 video or text

subtype(子类型)识别MIME类型表示的指定类型数据的确切种类。例如,对于MIME类型文本,子类型可能是plain(普通文本)、html(HTML源代码)或日历 calendar(iCalendar/.ics)文件。

每个type(主类型)都有自己的subtype(子类型),一个MIME必须同时拥有type(主类型)和subtype(子类型)

可选的参数也可以被添加的MIME类型中,格式为”type/subtype;parameter=value”。例如,一个指定UTF-8编码的普通文本类型:text/plain;charset=UTF-8

Type分类

主要有两大类type(主类型): discrete(翻译为离散或独立) and multipartDiscrete类型代表单个文件或单个媒体介质,例如单个文本或音乐文件,或单个视频。Multipart类型代表由多个组成部分组成的文档,每个组成部分都可能有自己独立的MIME类型;或者,multipart类型可以封装在一个事务中一起发送的多个文件。例如,multipart MIME types用于将多个文件附加到电子邮件中。因此这种特性,multipart类型常用http的post方法上传文件

Discrete类型

现在在IANA注册过discrete类型如下:

类型 说明 示例
application 这里指任何不属于其他类型的二进制数据,这些数据将以某种方式被执行或解释,或者需要一个特定的应用程序或应用程序类别来使用。 通用二进制数据(或其实际类型未知的二进制数据)的MIME类型为application/octet-stream。其他常见的二进制数据类型包括application/pdfapplication/pkcs8application/zipapplication/json
audio 音频或音乐数据 audio/mpegaudio/vorbis
example example 用于示例中演示如何使用 MIME 类型的占位符,不应该在实际环境中使用,实际使用时应替换为适当的类型。 audio/exampleapplication/example
font 字体或 typeface 数据。 font/wofffont/ttffont/otf
image 图像或图形数据,包括位图和矢量静态图像以及静态图像格式(如动画GIF或APNG)的动画版本。 image/jpegimage/pngimage/svg+xml
model 三维对象或场景的模型数据。 model/3mfmodel/vrml
text 仅包含文本的数据,包括可读的任何内容、源代码或文本数据(如逗号分隔值(CSV)格式的数据)。 text/plaintext/csvtext/html
video 视频数据或文件。 video/mp4video/oggvideo/webm

对于没有指定subtype(子类型)的文本文件,我们应该使用”text/plain”;同样的如果是未指定或者未知subtype(子类型)的二进制文件,我们应该使用”application/octet-stream”

Multipart类型

Multipart 类型指的是被分成多个部分的文件类型,常常每一部分都具有不同的 MIME 类型。它们还可以被用来表示作为同一事务的多个独立文件,在点赞邮件交互场景中使用。它们代表一个复合文档

除了multipart/form-dataPOSTHTML Forms被使用,还有

multipart/byteranges使用状态码206 Partial Content 来发送整个文件的部分内容外,HTTP对其他multipart文件并没有进行额外的特殊处理:message被传输到浏览器中,如果浏览器无法显示该文档,则可能会显示“Save As(另存为)”窗口。

目前有两种multipart类型:

类型 说明 示例
message 一种封装其他消息的消息,用来表示包含转发消息的电子邮件,或者允许将非常大的消息分块发送,就像它是多条消息一样。 message/rfc822 (用于转发或回复消息) 和 message/partial (用于将大消息自动分解成多个消息以便接收者重新组装)
multipart 由多个组件组成的数据,这些组件可能具有各自不同的 MIME 类型。 multipart/form-data(用于使用 FormData API 生成的数据)和multipart/byteranges (在 RFC 7233, section 5.4.1 中定义,用于 HTTP206Partial Content 状态码一起使用 ,该响应仅返回已获取内容的一部分, 例如使用header里面 Range 传递的内容)

💡重要的MIME类型

application/octet-stream

application/octet-stream 是二进制文件的默认 MIME 类型。由于它表示未知的二进制文件,因此浏览器通常不会执行它,甚至都不会询问是否应该执行。浏览器会将其视为 Content-Disposition 头部设置为 attachment,并提供“Save As(另存为)”对话框。

text/plain

text/plain 是文本文件的默认 MIME 类型。即使它真正的含义是“未知的文本文件”,浏览器也认为可以将其显示出来。

text/plain 不意味着“任何类型的文本数据”。如果期希望指定类型的文本数据,那么它可能会不匹配。比如说,当你从一个<link>链接下载一个内容被声明为CSS文件的text/plain文件,这个文件不会被浏览器识别为有效的CSS文件,必须使用CSS的MIME类型text/css才能正确识别。

text/css

用于样式化网页的 CSS 文件必须使用 text/css进行发送。服务器是无法识别 CSS 文件的.css 后缀的,如果你将CSS文件用 text/plainapplication/octet-stream MIME 类型发送,大多数浏览器将无法将其识别为 CSS,并将其忽略。

text/html

所有的HTML的内容都应该用这种text/htmlMIME类型,其他的关于XHTML的MIME类型到今天大部分已经被淘汰了,例如application/xhtml+xml

如果你想使用XML的严格解析规则,<![CDATA[…]]>部分或者那些并非来自 HTML/SVG/MathML 命名空间的元素,你应该使用 application/xmlapplication/xhtml+xml

text/javascript

根据 IANA Media Types registry, RFC 9239, 和 HTML specification, JavaScript的内容都应该使用MIME类型 text/javascript 。对于JavaScript来说,没有其他的MIME类型被认为是合法的,使用text/javascript其外的其他MIME类型会导致你的脚本不被加载或者运行。

你可能发现很多JavaScript内容总是错误地带上了charset参数作为MIME类型的一部分,试图去为脚本指定字符集类型。然而chatset参数对于JavaScript内容来说并不是合法的,这样做很可能会导致脚本运行失败

Legacy JavaScript MIME types

除了 text/javascript MIME 类型以外,出于历史原因,MIME Sniffing Standard(MIME 嗅探标准,定义了浏览器应如何解释 MIME 类型和处理那些非法的MIME 类型的内容)还允许使用以下任何旧版 JavaScript MIME类型进行传输:

  • application/javascript Deprecated🗑
  • application/ecmascript Deprecated🗑
  • application/x-ecmascript Non-standard⚠️
  • application/x-javascript Non-standard⚠️
  • text/ecmascript Deprecated🗑
  • text/javascript1.0 Non-standard⚠️
  • text/javascript1.1 Non-standard⚠️
  • text/javascript1.2 Non-standard⚠️
  • text/javascript1.3 Non-standard⚠️
  • text/javascript1.4 Non-standard⚠️
  • text/javascript1.5 Non-standard⚠️
  • text/jscript Non-standard⚠️
  • text/livescript Non-standard⚠️
  • text/x-ecmascript Non-standard⚠️
  • text/x-javascript Non-standard⚠️

尽管user agent可能支持他们当中的一些或者全部,你应该只使用text/javascript,它是在现在和未来唯一保证能正常使用的MIME类型

Image types

MIME的type(主类型)是image 的文件包含图像数据. Subtype(子类型)会指定数据代表的图像文件格式

下面的Image types(图像类型)是广泛使用,被认为足够安全在网页中使用的:

类型 说明
image/apng 动态可移植网络图形格式(APNG)
image/avif AV1 图像文件格式(AVIF)
image/gif 图形交换格式(GIF)
image/jpeg 联合图像专家组图像格式(JPEG)
image/png 可移植网络图形格式(PNG)
image/svg+xml 可缩放矢量图形格式(SVG)
image/webp Web 图片格式(WEBP)

Image file type and format guide 中提供了关于如何使用不同格式的图像的信息和建议

Audio and video types

像图像一样,HTML并不会要求浏览器对<audio>或者<video>元素的任意特定文件和解码编辑器提供支持,因此在选择文件类型和解码编辑器时,考虑你的目标受众和他们可能使用的浏览器范围(以及那些浏览器的版本)非常重要。

media container formats guide提供了一系列浏览器广泛支持文件类型,包含的信息有:它们可能的特殊用例,它们拥有的缺点和兼容性信息,以及其他细节。

audio codec(音频编解码器)video codec(视频编解码器) 指南列出了各种web浏览器通常支持的编解码器,提供了兼容性细节以及技术性信息,例如它们支持的音频频道有多少,它们使用哪种压缩,在哪些比特率下它们是有用的。codecs used by WebRTC 指南进一步扩展了这一点,专门涵盖了主流web浏览器支持的编解码器,所以你可以选择最合适的涵盖你希望支持的浏览器范围的编解码器。

至于音频或视频文件的 MIME 类型,它们通常指定容器格式(文件类型)。可选的编解码器参数可以被添加到MIME类型中去指定使用的编解码器和用于编码媒体的选项,例如编解码器配置,级别或者其他信息。

下面是在Web内容中最常用的MIME类型。然而,这不是完整的可用类型列表,在media container formats guide 可查看更多。

类型 说明
audio/wave, audio/wav, audio/x-wav, audio/x-pn-wav WAVE格式的音频文件。PCM 音频编解码器(WAVE 编解码器 “1”)通常被支持,但其他编解码器的支持有限(如果有的话)。
audio/webm WebM 格式的音频文件。Vorbis 和 Opus 是 WebM 规范正式支持的编解码器。
video/webm 可能带有音频的WebM 格式的视频文件。VP8 和 VP9 是最常见的视频编解码器;Vorbis 和 Opus 是最常见的音频编解码器。
audio/ogg Ogg 格式的音频文件。Vorbis 是在此类容器中使用的最常见音频编解码器;但是,Opus 也可以被 Ogg 所支持。
video/ogg 可能带有音频的Ogg 格式的视频文件。Theora 是其通常使用的视频编解码器;尽管 Opus 越来越普遍,Vorbis 仍然是其通常使用的音频编解码器。
application/ogg Ogg 格式的音频或视频文件。Theora 是其通常使用的视频编解码器;Vorbis 是其通常使用的音频编解码器。

multipart/form-data

multipart/form-data 类型可以把已经完成的 HTML Form表格的值从浏览器发送给服务器

作为一个multipart文件格式,他由不同部分组成,被一个分界符(以--开始的字符串)分隔。每个部分都有自己的实体和自己的HTTP的headers, Content-DispositionContent-Type,用于文件上传字段。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
Content-Type: multipart/form-data; boundary=aBoundaryString
(other headers associated with the multipart document as a whole)

--aBoundaryString
Content-Disposition: form-data; name="myFile"; filename="img.jpg"
Content-Type: image/jpeg

(data)
--aBoundaryString
Content-Disposition: form-data; name="myField"

(data)
--aBoundaryString
(more subparts)
--aBoundaryString--

如下所示的<from>

1
2
3
4
5
6
7
8
9
10
11
<form
action="http://localhost:8000/"
method="post"
enctype="multipart/form-data">
<label>Name: <input name="myTextField" value="Test" /></label>
<label><input type="checkbox" name="myCheckBox" /> Check</label>
<label>
Upload file: <input type="file" name="myFile" value="test.txt" />
</label>
<button>Send the file</button>
</form>

会发送如下请求

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
POST / HTTP/1.1
Host: localhost:8000
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.9; rv:50.0) Gecko/20100101 Firefox/50.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate
Connection: keep-alive
Upgrade-Insecure-Requests: 1
Content-Type: multipart/form-data; boundary=---------------------------8721656041911415653955004498
Content-Length: 465

-----------------------------8721656041911415653955004498
Content-Disposition: form-data; name="myTextField"

Test
-----------------------------8721656041911415653955004498
Content-Disposition: form-data; name="myCheckBox"

on
-----------------------------8721656041911415653955004498
Content-Disposition: form-data; name="myFile"; filename="test.txt"
Content-Type: text/plain

Simple file.
-----------------------------8721656041911415653955004498--

multipart/byteranges

MIME 类型multipart/byteranges用于向浏览器发送部分响应。

当发送 206 Partial Content状态码时,该 MIME 类型指示文档由多个部分组成,每个请求的范围对应一个部分。与其他multipart类型一样,Content-Type 使用boundary将这些部分分开。每个部分都有一个Content-Type 头部,用于表示其实际类型,以及一个 Content-Range ,用于表示它代表的字节范围。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
HTTP/1.1 206 Partial Content
Accept-Ranges: bytes
Content-Type: multipart/byteranges; boundary=3d6b6a416f9b5
Content-Length: 385

--3d6b6a416f9b5
Content-Type: text/html
Content-Range: bytes 100-200/1270

eta http-equiv="Content-type" content="text/html; charset=utf-8" />
<meta name="viewport" content
--3d6b6a416f9b5
Content-Type: text/html
Content-Range: bytes 300-400/1270

-color: #f0f0f2;
margin: 0;
padding: 0;
font-family: "Open Sans", "Helvetica
--3d6b6a416f9b5--

🔗参考链接

  1. MIME types (IANA media types) - HTTP | MDN (mozilla.org)
  2. Internet Assigned Numbers Authority (iana.org)