各浏览器对常用或者错误的 Content-Type 类型处理方式

CH9001: 各浏览器对常用或者错误的 Content-Type 类型处理方式不一致

标准参考

content-type 用于定义用户的浏览器或相关设备如何显示将要加载的数据，或者如何处理将要加载的数据，此属性的值可以查看 MIME 类型。

MIME (Multipurpose Internet Mail Extensions，多用途互联网邮件扩展) 是描述消息内容类型的因特网标准。MIME 消息能包含文本、图像、音频、视频以及其他应用程序专用的数据。

content-type 一般以下面的形式出现：

Content-Type: [type]/[subtype]; parameter

type 有下面的形式：

Text：用于标准化地表示的文本信息，文本消息可以是多种字符集和或者多种格式的；
Multipart：用于连接消息体的多个部分构成一个消息，这些部分可以是不同类型的数据；
Application：用于传输应用程序数据或者二进制数据；
Message：用于包装一个E-mail消息；
Image：用于传输静态图片数据；
Audio：用于传输音频或者音声数据；
Video：用于传输动态影像数据，可以是与音频编辑在一起的视频数据格式。

subtype 用于指定 type 的详细形式。“type/subtype”配对的集合和与此相关的参数。下面是最经常用到的一些 MIME 类型：

text/html（HTML 文档）；
text/plain（纯文本）；
text/css（CSS 样式表）；
image/gif（GIF 图像）；
image/jpeg（JPG 图像）；
application/x-javascript（JavaScript 脚本）；
application/x-shockwave-flash（Flash）；
application/x- www-form-urlencoded（使用 HTTP 的 POST 方法提交的表单）；
multipart/form-data（同上，但主要用于表单提交时伴随文件上传的场合）。

关于 content-type 的详细信息，请参考 HTML4.01 规范 6.7 Content types (MIME types) 中的内容。

关于 MIME 的相信信息，请参考 IETF 的 [RFC2045] 及 [RFC2046] 规范。

更多的 MIME 类型参见：

问题描述

Content-Type 报头字符串代表着服务器端发送给客户端浏览器的具体数据类型，浏览器将根据这个信息决定如何处理得到的数据内容。比如：'Content-Type:text/html' 表示着这是个 HTML 文件，需要渲染引擎解释内容后输出；'Content-Type: application/octet-stream' 表示这是个二进制流，需要下载到本地后由用户端环境决定如何使用。每个浏览器内置支持的 Content-Type 类型表各不相同，这导致了某些类型字符串在某些浏览器下不被识别；另外，如果出现错误的 Content-Type 类型，各个浏览器又会以不同的方式处理。

造成的影响

未知的或者是错误的 Content-Type 类型，在各个浏览器中处理方式不一致，草率对待将有可能使得同一文件在各种浏览器中展现方式完全不同。

受影响的浏览器

所有浏览器

问题分析

创建一个 Web 服务器，如 Apache。在服务器上编写一段动态代码，如：ct_test.php

<?php $contentTypeList = array( '0'=>'Content-Type: text/plain', '1'=>'Content-Type: application/octet-stream', '2'=>'Content-Type: application/x-rar-compressed', '3'=>'Content-Type: application/zip', '4'=>'Content-Type: application/x-shockwave-flash', '5'=>'Content-Type: video/quicktime', '6'=>'Content-Type: video/mp4', '7'=>'Content-Type: audio/mpeg', '8'=>'Content-Type: image/jpeg', '9'=>'Content-Type: image/gif', '10'=>'Content-Type: image/png', '11'=>'Content-Type: application', '12'=>'Content-Type: audio', '13'=>'Content-Type: video', '14'=>'Content-Type: image', '15'=>'Content-Type: helloworld' ); header($contentTypeList[$_GET["type"]]."; charset=UTF-8"); ?>

PHP 的文件中建立了 16 种 Content-Type 类型，根据 URL 中 GET 参数值选取其中一种文件类型 HTTP 报头发向客户端浏览器。其中 11 种常用类型，4 种故意写错的类型，1 种完全自定义类型：

	文件类型	Content-Type 类型
常见类型	文本	text/plain
	二进制流	application/octet-stream
	RAR 压缩包	application/x-rar-compressed
	Zip 压缩包	application/zip
	Flash 文件	application/x-shockwave-flash
	QuickTime 视频	video/quicktime
	MP4 视频	video/mp4
	MP3 音频	audio/mpeg
	JPEG 图片	image/jpeg
	GIF 图片	image/gif
	PNG 图片	image/png
书写有误类型	数据	application
	音频	audio
	视频	video
	图像	image
浏览器不可识别类型	自定义类型	helloworld

分别以不同 HTTP Content-Type 报头类型运行此段代码，在不同的浏览器环境中的表现如下：

	IE6 IE7 IE8	Firefox	Chrome	Safari	Opera
text/plain	显示文件内容	显示文件内容	显示文件内容	显示文件内容	显示文件内容
application/octet-stream	显示文件内容	下载文件	下载文件	下载文件	显示文件内容
application/x-rar-compressed	下载文件¹	下载文件	下载文件	下载文件	下载文件
application/zip	下载文件¹	下载文件	下载文件	下载文件	下载文件
application/x-shockwave-flash	试图显示 Flash	试图显示 Flash	试图显示 Flash	试图显示 Flash	试图显示 Flash
video/quicktime	下载文件	下载文件	下载文件	下载文件	下载文件
video/mp4	下载文件	下载文件	试图播放视频³	下载文件	下载文件
audio/mpeg	下载文件	下载文件	试图播放视频³	下载文件	下载文件
image/jpeg	显示文件内容	试图显示图片²	试图显示图片	试图显示图片	试图显示图片
image/gif	显示文件内容	试图显示图片²	试图显示图片	试图显示图片	试图显示图片
image/png	显示文件内容	试图显示图片²	试图显示图片	试图显示图片	试图显示图片
application	下载文件¹	显示文件内容	显示文件内容	下载文件	显示文件内容
audio	下载文件¹	显示文件内容	显示文件内容	下载文件	显示文件内容
video	下载文件¹	显示文件内容	显示文件内容	下载文件	显示文件内容
image	下载文件¹	显示文件内容	显示文件内容	下载文件	显示文件内容
helloworld	下载文件¹	显示文件内容	显示文件内容	下载文件	显示文件内容

【注1】：这几种 Content-Type 类型在测试环境中的 IE6 IE7 IE8 浏览器弹出的下载对话框提示中，均显示“不可识别类型”。

【注2】：Firefox 会将 URL 和一些错误信息输出在图片格式中显示。

【注3】：Chrome 试图使用 VIDEO 标记直接显示这两种格式的视频。

由表可见：

IE6 IE7 IE8 对于可以识别的非视频、音频流内容均会嗅探其内容，并且根据内容是否正常再决定如何输出显示；

（关于嗅探的扩展阅读：CH9002: IE6 IE7 IE8 未按预期方式处理 content-type 为 text/plain 的内容）
Firefox Chrome 对于未知 Content-Type 的内容均直接显示其内容，其他类型则以直接以最合适的方式处理；
Opera 对于可以识别的视频、音频流内容会直接提示下载，图片类型和 Flash 类型会试图显示他们，未知 Content-Type 的内容均直接显示其内容则直接显示其内容，但在显示内容前不会嗅探其中的 HTML 标记。

解决方案

这个问题比较复杂，如需避免出现显示异常，建议不要使用非法的 Content-Type 头字符串；并且文件实际内容和数据格式应与 Content-Type 头字符串内类型声明一致。

参见

知识库

操作系统版本:	Windows 7 Ultimate build 7600
浏览器版本:	IE6 IE7 IE8 Firefox 3.6.9 Chrome 7.0.517.0 dev Safari 5.0.1 Opera 10.51
测试页面:	ct_test.php
本文更新时间:	2010-09-09

ASP学习笔记