Question

我有需要显示代码文件的iframe。代码文件具有.txt扩展名，应该只将代码显示为文本。这适用于除IE8之外的所有浏览器。 IE8不断将代码文件呈现为HTML。

    <iframe id="codeFile222" 
    width="100%" height="200px"
    marginheight="0" frameborder="0" 
    src="http://mrsbos.wikispaces.com/file/view/guessNumber.txt"
    name="codeFile222" 
    onload="autoResize('codeFile222');changeColor('codeFile222')"
    >

知道我能做些什么，也能让它在IE8中运行

Answer 1

您提供的链接（mrsbos.wikispaces.com/file/view/guessNumber.txt）将text / plain作为内容类型，这样就可以了。

要找出哪种内容类型，您可以使用Fiddler或只需右键单击该页面，然后选择页面信息或类似内容（取决于浏览器）。

我的猜测是，IE会尝试自动检测内容，看到<script>标记并假设它是html。

在这些情况下，您必须对内容进行编码，可选地，如果可能，则显示html页面，而不是源代码位于<pre> - 标签的服务器。

Answer 2

这个问题已经存在了一段时间，遗憾的是没有真正适当的修复。可能有用的一件事是使用Javascript将iframe内的所有内容与<pre>标记包装在一起，但这有点像黑客。

www.howtocreate.co.uk上有关于此问题的更多信息，我将在此重现文章正文：

虽然我们讨论的是Content-type HTTP标头，但XHTML却是   不是IE出错的唯一一个。它甚至会处理纯文本   不正确。如果您发送一个标题表明您正在使用plain   文本，但它包含IE认为是HTML的东西，它会忽略   您的标题，并将其呈现为HTML。所以你的文本文件就是你   精心准备的转换成了一个磨合段   几乎不可读，缺少位和格式丢失。

他们为什么要这样做？因为偶尔HTML页面不正确   由Web服务器作为纯文本。如果发生这种情况，这将会发生   使IE呈现为HTML。这听起来是个好主意，但这是什么   意味着制作这些页面的作者没有意识到他们的   页面被错误地作为文本提供，因为当他们检查它时   在IE中，它看起来像是在工作。正确遵守的浏览器   使用页面指定的内容类型将查看页面源   而不是其内容。而且，这意味着许多文本文件都是   因为IE认为它们是HTML而错误地被破坏了。

无论哪种方式，有人失败了。但如果IE没有忽略该文本   内容类型标题，作者会意识到存在问题，并且   改为修复服务器。该页面适用于所有浏览器和IE   不会搞砸文本文件。

Answer 3

Content-Type HTTP标头指示资源的MIME type（网页，图像或下载）。对于HTML页面，MIME类型通常为text/html，对于文本文件，通常为text/plain。

服务器会为您的文本文件发送text/plain;charset=utf-8（例如，当使用 Ctrl 执行文件的硬重载时，显示在Firebug的Net面板中+ F5 ）。但是，与其他Web浏览器不同，Internet Explorer会在文件中看到HTML并猜测服务器（Microsoft documentation）。

因为这会产生安全隐患，但微软并不想冒险破坏与旧网站的向后兼容性（通过使IE的行为与其他浏览器的行为一致），Internet Explorer 8和更新版本支持X-Content-Type-Options: nosniff标题在这种情况下禁用HTML检测。但是，在诸如Wikispaces这样的站点上，您可能没有选择发送标题，并且在任何情况下，标题在Internet Explorer 6和7中都不起作用。

在Wikispaces上，使用提供的源代码格式化功能（参见wikitext help page）可能是有意义的：

[[code format="javascript"]]
alert('hello, world');
[[code]]

如果您想将代码存储在单独的页面上，您可以从人们实际应该阅读的页面中包含它（Wikispaces include help page）。这称为transclusion：

[[include page="PAGENAME"]]

如果不这样做，一个好的选择可能是HTML-escape代码（使用一些文本替换）并将其插入<pre></pre>之间。然后，您将上传HTML文件（文件扩展名为.htm或.html）。出于解释的目的，这是一个简单的JavaScript函数，用于执行HTML转义：

function htmlEscape(text) {
    // Absolutely necessary
    text = text.replace(/&/g, '&amp;'); // Has to go first
    text = text.replace(/</g, '&lt;');

    // Not needed for your specific case, yet would be good to include
    text = text.replace(/>/g, '&gt;');
    text = text.replace(/"/g, '&quot;');
    text = text.replace(/'/g, '&#39;'); // '&apos;' is only OK in XHTML and in HTML5
    return text;
}

Answer 4

我现在使用了你建议的turnToText函数。首先，结果只会以纯文本显示HTML标记，而不是脚本。显然，浏览器已将脚本标记及其内容放在head标记中。所以我可以把它们拉出来并将它们添加到其余的代码中。我的功能现在看起来像这样。我只需要通过添加非白色的休息空间换行符等来为结果提供更好的布局。

    turnToText2=function(id){
    if(window.XMLHttpRequest && document.all){

    var text=null;
    var obj=document.getElementById(id);
    var y=null;

     y=(obj.contentDocument|| obj.contentWindow);


    var head =y.getElementsByTagName('head')[0];
    var texth=head.innerHTML;

    text=y.body.innerHTML;
    text=texth+text;

    while(text.indexOf("<")!=-1){
    text=text.replace("<","&lt;");
    }
    while(text.indexOf(">")!=-1){
        text=text.replace(">","&gt;");
    } 

    if(y!=null){
   y.body.innerHTML=text;
   }

   } else{
    console.log("NOT IE:");
    }
    }

非常感谢

顺便说一句，我还将使用wikispaces中的代码标签，因为它确实提高了不同颜色的清晰度。所以，谢谢你。我也喜欢切换效果，我可以用我自己的超链接和iframe创建，所以我希望它也可以在所有浏览器上使用。

IE8 iframe将简单的文本文件呈现为HTML，我需要原始代码

4 个答案: