X-UA-Compatible 设置为 IE=edge，但仍不停止兼容模式

Posted 2023-02-21

技术标签:

【中文标题】X-UA-Compatible 设置为 IE=edge，但仍不停止兼容模式【英文标题】：X-UA-Compatible is set to IE=edge, but it still doesn't stop Compatibility Mode 【发布时间】：2011-09-03 15:21:07 【问题描述】：

我很困惑。我应该可以设置

<meta http-equiv="X-UA-Compatible" content="IE=edge" />

IE8 和 IE9 应该使用最新的渲染引擎来渲染页面。但是，我刚刚对其进行了测试，如果在我们网站的其他地方打开了兼容模式，它将保持our page 的状态，即使我们应该强制它不要这样做。

您应该如何确保 IE不使用兼容模式（即使在 Intranet 中）？

FWIW，我正在使用 html5 DocType 声明 (<!doctype html>)。

这是页面的前几行：

<!doctype html> 
<!--[if lt IE 7 ]> <html lang="en" class="innerpage no-js ie6"> <![endif]--> 
<!--[if IE 7 ]>    <html lang="en" class="innerpage no-js ie7"> <![endif]--> 
<!--[if IE 8 ]>    <html lang="en" class="innerpage no-js ie8"> <![endif]--> 
<!--[if (gte IE 9)|!(IE)]><!--> 
<html lang="en" class="innerpage no-js"> 
<!--<![endif]--> 
    <head> 
        <meta charset="ISO-8859-1" /> 
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />

编辑：I just learned IE8 上的默认设置是对 Intranet 站点使用 IE7 兼容模式。这会覆盖 X-UA-Compatible 元标记吗？

【问题讨论】：

我的一些用户也遇到了这个问题，你有没有想过这个问题？我的应用程序不是 Intranet。奇怪的是，只有 20% 的用户得到了它。这可能是你有趣的标签标记的结果（ 【参考方案1】：

事实证明，这与 Microsoft's "intelligent" choice 有关，以使所有 Intranet 站点强制进入兼容模式，即使 X-UA-Compatible 设置为 IE=edge。

【讨论】：

这不是真的。 X-UA-Compatible 将覆盖兼容模式设置。但是，有时使用元标记不起作用，因为模式在遇到它时已经设置。这就是我使用 HTML 标头版本的原因，因此浏览器可以在此过程的早期启用标准模式。添加到 Mystere Man 的评论中，您可以使用 web.config 或 IIS 中的自定义 http 标头从托管服务器覆盖它。有关详细信息，请参阅我上面的帖子。我已经尝试了很多次，它并没有覆盖所有强制进入可比模式的 Intranet 站点。 @Mystere Man：有时定义为页面在iframe中，父文档没有定义XUA-COMPAT，文档模式继承自父页面（另一个非常智能的MS选择）。 @Kerrick：这不是正确的答案。正确答案请参见下面由 tj111 回答的问题。【参考方案2】：

如果您需要覆盖 IE 的 Intranet 站点的兼容性视图设置，您可以在 web.config (IIS7) 中或通过网站属性 (IIS6) 中的custom HTTP headers 执行此操作，并在那里设置 X-UA-Compatible。元标记不会覆盖 IE 在兼容性视图设置中的内网设置，但如果您在托管服务器上设置它，它将覆盖兼容性。

IIS7 中的 web.config 示例：

<system.webServer>
    <httpProtocol>
      <customHeaders>
        <add name="X-UA-Compatible" value="IE=EmulateIE8" />
      </customHeaders>
    </httpProtocol>
</system.webServer>

编辑：我从add 之前删除了clear 代码；复制和粘贴是不必要的疏忽。好消息，评论者！

【讨论】：

请注意...如果您使用内置的 Visual Studio 开发 Web 服务器（又名 Cassini）进行开发，那么这将不起作用，因为 Cassini 不支持部分。因此，对于开发，请改用 IIS Express。 <clear /> 的原因是什么？这会清除哪些自定义标头？至少对我来说，清除似乎删除了<urlCompression...> 规则。该规则执行 gzipping，我确实想要，所以我将其注释掉。任何进一步的信息都会很可爱。我删除了“清除” - 很好，这是从我的实现中复制和粘贴的不必要的行。 php：<?php header('X-UA-Compatible: IE=edge'); ?>【参考方案3】：

推荐服务器端解决方案，正如@TimmyFranks 在他的回答中提出的那样，但是如果需要在页面级别实现X-UA-Compatible 规则，请阅读以下提示，以受益于经验已经被烧死的人

X-UA-Compatible 元标记必须直接出现在 <head> 元素中的标题之后。不能在其前面放置其他元标记、css 链接和 js 脚本调用。

<head>
    <title>Site Title</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta charset="utf-8">
    <script type="text/javascript" src="/jsFile.js"></script>
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link rel="shortcut icon" href="/apple-touch-icon.png" />
</head>

如果页面中有任何条件cmets（假设位于<html>），它们必须放在<head>之后。

// DON'T: place class inside the HTML tag 
<!--[if gt IE 8]><!--> 
    <html class="aboveIe8"> 
<!--<![endif]-->

// DO: place the class inside the BODY tag
<!--[if gt IE 8]><!--> 
    <body class="aboveIe8"> 
<!--<![endif]-->

Html5BoilerPlate 的团队写了关于这个错误 - http://h5bp.com/i/378 他们有几种解决方案。

关于Intranet & Compatibility view，进入工具> 兼容性视图设置有设置。

【讨论】：

我在 Stack Overflow 上尝试了 4 或 5 个其他答案，只有这个特定的组合对我有用。对于使用 WordPress 和 SEO 插件的任何人，请注意插件在另一个位置重写。编辑：添加 WordPress 评论 X-UA-Compatible 应该尽早出现，probably after charset。我不认为它“必须直接出现在标题之后”。这个推荐是在IE下受苦的结果。被血得了。谁说 IE 遵循指南？哇，这对我有用，并且在标题标签之后有我的元标签就是诀窍。希望这项工作不要那么陈旧...... 在 IE11 上无法使用：【参考方案4】：

Timmy Franks 很适合我。我们今天遇到的问题是客户在公司范围内使用 IE8，这迫使我们为他们的 Intranet 编写的网站进入兼容模式。设置“IE-Edge”似乎可以解决它。

<httpProtocol>
  <customHeaders>
    <clear />
    <add name="X-UA-Compatible" value="IE=Edge" />
  </customHeaders>
</httpProtocol>

【讨论】：

【参考方案5】：

请注意，如果您使用 PHP 提供服务，您也可以使用以下代码来修复它。

header("X-UA-Compatible: IE=Edge");

【讨论】：

这比添加元标记效果更好，因为它使用这种方法通过了 W3C 验证，并且比 .htaccess hack 容易得多。我尝试了其他所有方法，这就是最终奏效的方法。谢谢。对于那些使用 WordPress 的人，这可能会有所帮助：codex.wordpress.org/Plugin_API/Action_Reference/send_headers 当基于<!--[if lt IE 7 ]> <html>... 构建一个巨大的站点时，这也能更好地工作！谢谢！你是上帝派来的！！ @sunskin - PHP 发送的任何标头必须发生在向页面发送任何输出之前，即在 PHP 输出任何 HTML 或数据之前。【参考方案6】：

正如 NEOSWF 上面指出的那样，Paul Irish 条件 cmets 会阻止元标记产生任何影响。

这里有几个修复 (http://nicolasgallagher.com/better-conditional-classnames-for-hack-free-css/)

这些包括：

添加两个 HTML 类，使用服务器标头并在文档类型上方添加条件注释。

在我的最新项目中，我决定删除 Paul Irish 条件 cmets。我不喜欢在没有先进行大量测试的情况下在 html 之前添加任何内容的想法，而且很高兴仅通过查看 HTML 来了解已设置的内容。

最后我在 body 后面直接包围了一个 div 并使用了条件 cmets eg

  <!--[if IE 7]><div class="ie7"><!--<![endif]-->
  ... regular body stuff
  <!--[if IE 7]></div><!--<![endif]-->

我本可以在身体周围进行此操作，但使用 Wordpress 等 CMS 会更困难。

显然它是标记内的另一个 DIV，但它仅适用于旧版浏览器。

我认为这可能是基于每个项目的决定。

我还阅读了一些关于字符集元标记需要出现在前 1024 个字节中的内容，因此可以确保这一点。

有时最简单、最容易阅读的想法是最好的，它绝对值得思考！感谢上面链接上的第 6 条评论指出这一点。

【讨论】：

【参考方案7】：

在尝试了很多组合后我遇到了同样的问题我有这个工作注意我已经检查了 Intranet 的兼容性

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<head runat="server">

【讨论】：

【参考方案8】：

如果您使用的是 LAMP 堆栈，请将其添加到您的 Web 根文件夹中的 .htaccess 文件中。无需将其添加到每个 PHP 文件中。

<IfModule mod_headers.c>
    Header add X-UA-Compatible "IE=Edge"
</IfModule>

【讨论】：

【参考方案9】：

即使您已取消选中“在兼容性视图中显示 Intranet 站点”选项，并在响应标头中包含 X-UA-Compatible，您的浏览器仍可能默认为“兼容性视图”的另一个原因 - 您的组政策。查看您的控制台以获取以下消息：

HTML1203：xxx.xxx 已通过组策略配置为在兼容性视图中运行。

其中 xxx.xxx 是您网站的域（即 test.com）。如果您看到这一点，则您的域的组策略已设置，因此任何以 test.com 结尾的站点都将自动以兼容模式呈现，而不管文档类型、标题等如何。

欲了解更多信息，请参阅以下链接（解释 html 代码）：http://msdn.microsoft.com/en-us/library/ie/hh180764(v=vs.85).aspx

【讨论】：

【参考方案10】：

我在本地主机的 IE7 文档标准中也遇到了相同的 IE9 渲染问题。我尝试了许多条件 cmets 标签但不成功。最后，我只是删除了所有条件标签，并在 head 之后立即添加了元标签，如下所示，它就像魅力一样。

<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

希望对你有帮助

【讨论】：

【参考方案11】：

X-UA-Compatible 只会覆盖文档模式，不会覆盖浏览器模式，并且不适用于所有内网站点；如果是这种情况，最好的解决方案是禁用“在兼容性视图中显示 Intranet 站点”和 set a group policy setting 以指定哪些 Intranet 站点需要兼容模式。

【讨论】：

【参考方案12】：

我在我的 htaccess 文件中添加了以下内容，这成功了：

BrowserMatch MSIE ie
Header set X-UA-Compatible "IE=Edge,chrome=1" env=ie

【讨论】：

这在 Intranet 设置为兼容性时有效。我花了很长时间才找到可行的方法。特别是当您搜索并且一切都与 iis 相关时这太棒了。我不知道您可以使用 .htaccess 发送标头【参考方案13】：

IE 11 不再允许您通过发送标头来覆盖浏览器兼容性视图设置...

<meta http-equiv="X-UA-Compatible" content="IE=edge" />

似乎强制浏览器不使用兼容性视图的唯一方法是让用户在浏览器中禁用它。我们的是一个内网站点，默认的 IE 选项是使用内网站点的兼容性视图。好痛啊！

我们能够避免用户更改 IE 9 和 10 用户的浏览器设置，但它不再适用于 IE 11。我们的 IE 用户正在切换到 Chrome，这不是问题，而且从来没有。

【讨论】：

不是不允许，IE11不支持edge以外的其他兼容模式。 Link to official documentation。这意味着我们不必再使用那个元标记来隐藏地址栏上的 CM 按钮了。不正确：IE11 仍然支持所有旧版兼容模式。 @EricLaw，EricP 的回答是否正确（IE11 改变了 X-UA-Compatible HTTP 标头的行为）？ @EricP，您尝试了 HTTP 标头，还是仅尝试了标记版本？ @MatthewFlaschen：不，EricP 不正确，Wallace Sidhree 也是如此（尽管对 Wallace 公平，MSDN 没有解释“已弃用”的含义）。 IE11 中的变化是根本没有可见的“兼容性视图”按钮 (technet.microsoft.com/en-us/library/dn321449.aspx)，但 X-UA-Compatible 声明仍然受到尊重。【参考方案14】：

另外，X-UA-Compatible 必须是 head 部分的第一个元标记

<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
</head>

顺便说一下，正确的顺序还是主要的head标签是：

<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta charset="utf-8">
    <title>Site Title</title>
    <!-- other tags -->
</head>

这边

我们将渲染引擎设置为在 IExplorer 开始处理之前使用然后我们将文档设置为所有浏览器使用的编码然后我们打印标题，它将使用已经定义的编码进行处理。

【讨论】：

其实CHARSET应该在X-UA-Compatible之前。见blogs.msdn.com/b/ieinternals/archive/2011/07/18/… 它不一定是第一个，但它确实需要靠近顶部。它可以跟随标题（和字符集，正如 Eric 所说），但仅此而已。在我的 nginx 上，只有当 X-UA-Compatible-tag 是 head 部分的第一个时，它才会起作用【参考方案15】：

我能够在使用 php 加载 HTML 之前解决这个问题，并且效果很好。

<?php 
header( 'X-UA-Compatible: IE=edge,chrome=1' );
header( 'content: width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no' );
include('ix.html');
?>

ix.html 是我发送标头后要加载的内容。

【讨论】：

【参考方案16】：

对于 Nginx，

add_header "X-UA-Compatible" "IE=Edge,chrome=1";

参考：https://github.com/h5bp/server-configs/commit/a5b0a8f736d68f7de27cdcb202e32975a74bd2c5

【讨论】：

【参考方案17】：

我在 IE11 中遇到了同样的问题。这些答案都没有解决我的问题。经过一番挖掘，我注意到浏览器运行在 Enterprise 模式。（按 F12 验证并单击仿真选项卡，查找浏览器配置文件下拉菜单）设置已锁定，不允许我更改设置。

从以下注册表项中删除 CurrentVersion 后，我能够将配置文件更改为 Desktop：

HKEY_CURRENT_USER\Software\Policies\Microsoft\Internet Explorer\Main\EnterpriseMode

将模式更改为桌面后，此帖子中的答案将起作用。

【讨论】：

【参考方案18】：

当您的浏览器以兼容模式打开时，即使您从 Web 浏览器和本地组策略编辑器中删除并关闭所有兼容模式配置，您也可以尝试从注册密钥中禁用。

这也发生在我使用域和子域连接服务器端时。机器被限制在所有子域的兼容模式下打开。

禁用 Intranet 的兼容模式

HKEY_LOCAL_MACHINE - SOFTWARE - Policies - Microsoft - Internet Explorer - BrowserEmulation -> IntranetCompalityMode 值应为 0（零）。并从 PolicyList 中删除现有域名。

否则，您可以添加一个包含 0（零） 值数据的新值 (DWORD)。

【讨论】：

以上是关于X-UA-Compatible 设置为 IE=edge，但仍不停止兼容模式的主要内容，如果未能解决你的问题，请参考以下文章

IE的兼容性设置 X-UA-Compatible

使用X-UA-Compatible来设置IE浏览器兼容模式

HTMLMeta中添加X-UA-Compatible和IE=Edge，chrome=1有啥作用

使用“X-UA-Compatible”为 IE8 模拟 IE7，但不为 IE9 模拟

X-UA-Compatible in parent is IE=8, page in IFRAME IE=edge,chrome=1

HTML Meta中添加X-UA-Compatible和IE=Edge,chrome=1有什么作用？