• 各浏览器对常用或者错误的 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 IE8FirefoxChromeSafariOpera
    text/plain 显示文件内容 显示文件内容 显示文件内容 显示文件内容 显示文件内容
    application/octet-stream 显示文件内容 下载文件 下载文件 下载文件 显示文件内容
    application/x-rar-compressed 下载文件1 下载文件 下载文件 下载文件 下载文件
    application/zip 下载文件1 下载文件 下载文件 下载文件 下载文件
    application/x-shockwave-flash 试图显示 Flash 试图显示 Flash 试图显示 Flash 试图显示 Flash 试图显示 Flash
    video/quicktime 下载文件 下载文件 下载文件 下载文件 下载文件
    video/mp4 下载文件 下载文件 试图播放视频3 下载文件 下载文件
    audio/mpeg 下载文件 下载文件 试图播放视频3 下载文件 下载文件
    image/jpeg 显示文件内容 试图显示图片2 试图显示图片 试图显示图片 试图显示图片
    image/gif 显示文件内容 试图显示图片2 试图显示图片 试图显示图片 试图显示图片
    image/png 显示文件内容 试图显示图片2 试图显示图片 试图显示图片 试图显示图片
    application 下载文件1 显示文件内容 显示文件内容 下载文件 显示文件内容
    audio 下载文件1 显示文件内容 显示文件内容 下载文件 显示文件内容
    video 下载文件1 显示文件内容 显示文件内容 下载文件 显示文件内容
    image 下载文件1 显示文件内容 显示文件内容 下载文件 显示文件内容
    helloworld 下载文件1 显示文件内容 显示文件内容 下载文件 显示文件内容

    【注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 头字符串内类型声明一致





    ps: 今天碰到一个问题,firefox 输出shtml 文本输出,找半天发现apache 没设置  AddType text/html .shtml 默认的.shtml被当成纯文本输出了
  • 相关阅读:
    iOS开发_当一个控件被添加到父控件中会调用
    iOS_判断应用在前台还是后台
    iOS开发_ SDWebImage先下载图片保存起来,需要时再调用
    WARNING ITMS90901: "Missing fullscreen support for the latest iPad mini display.
    iOS开发_显示带HTML标签的富文本
    iOS开发_WKWebView隐藏滚动条
    iOS_获取应用当前定位授权状态
    iOS开发_判断字符串是否为空的处理
    UIAlertController和UIActivityViewController在ipad中的兼容性问题
    npm run serve报错提示js堆内存不足
  • 原文地址:https://www.cnblogs.com/xiaoleiel/p/8324144.html
Copyright © 2020-2023  润新知