错误值X-UA-与元素meta上的属性http-equiv兼容


110

我已经使用了与metaHTML5 Boilerplate 相同的方式,并且W3C HTML验证程序抱怨:

值X-UA-与元素meta上的属性http-equiv兼容。

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

这个meta标签有什么问题?


6
下面是关于它的一个很好的博客文章(它也是第一个搜索结果我得到了):blog.yjl.im/2011/01/...
ComFreek

Answers:


67

X-UA-Compatible不是“标准” HTML(涉及出现在规范所引用的可公开编辑的Wiki页面上的“ FSVO”“标准” ),或者验证器不是该Wiki的最新状态。

在撰写本文时(20130326)X-UA兼容出现在Wiki页面上的以下部分:“以下建议的扩展名尚未符合HTML规范中的所有注册要求,因此尚未被允许使用有效的扩展名。文件。” 因此,验证器拒绝该值是正确的。


8
维基页面错误。您链接的是<meta name= ...。对于<meta http-equiv=...该页面wiki.whatwg.org/wiki/PragmaExtensions
Alohci

6
正确的Wiki页面确实包含X-UA-Compatible,因此适用“验证器不是最新的”选择。在这方面,甚至是validateator.nu(据说通常更新)。
Jukka K. Korpela 2013年

感谢您的更正。我还没有意识到meta属性的值分为两页。
昆汀

1
请参阅我的答案,以获取有关如何对验证程​​序进行修补以使其支持的示例X-UA-Compatiblestackoverflow.com/a/21048010/1006963
darcyparker 2014年

所以我该如何解决w3c验证程序的问题。我可以删除标签吗?
Krish 2014年

42

如果您希望使其在技术上有效(每个人都喜欢看到绿色的图标),并且不影响任何功能,则应该可以将其包装在“ if IE”标签中。

<!--[if IE]><meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'><![endif]-->

22
这将有效地禁用您浏览器内嵌框架为Chrome Frame的IE忽略条件注释,见jeffreybarke.net/2010/08/...
碧玉Moelker

5
@JasperMoelker:可能值得一提的是,您提供的链接中的文章实际上也包含适用于Chrome Frame的变通方法,这非常棒:验证+ Chrome Frame支持!
路加福音

5
不不不,这破坏了X-UA兼容。xn--mlform-iua.no/blog/...
brentonstrine

30

一种可能的解决方案是在标头中实现修复服务器端,如Aaron Layton 在这篇不错的文章中所建议的那样。(所有功劳都应该归功于他,我将释述而不是窃...)

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

“当Internet Explorer碰到这一行时,它将首先使用的引擎更改为Chrome Frame(如果已安装插件),然后更改为Edge(浏览器支持的最高文档模式)。”

步骤

  • 修复页面验证–这可以通过简单地删除标签来实现
  • 渲染速度–我们将等待发送正确的模式作为响应头,而不是等待浏览器查看标签然后更改模式
  • 确保仅显示Internet Explorer的修复程序–我们将仅使用某些服务器端浏览器检测并将其仅发送到IE

要在PHP中添加标头,我们可以将其添加到页面中:

if (isset($_SERVER['HTTP_USER_AGENT']) &&
    (strpos($_SERVER['HTTP_USER_AGENT'], 'MSIE') !== false))
        header('X-UA-Compatible: IE=edge,chrome=1');


或者您可以将其添加到您的.htaccess文件中,如下所示:

<FilesMatch "\.(htm|html|php)$">
    <IfModule mod_headers.c>
        BrowserMatch MSIE ie
        Header set X-UA-Compatible "IE=Edge,chrome=1" env=ie
    </IfModule>
</FilesMatch>


链接到原始文章,查看可能的警告注释。还包括C#的实现。

永久修复与X-UA兼容的错误值

希望这可以帮助!


1
在撰写本文时,此解决方案已在HTML5BP .htaccess文件中实现。因此,只要您的Apache服务器启用了mod_headers,就可以安全地<meta>从html文件中删除。
帕特里克·詹姆斯·麦克杜格

如果像我一样使用Spring MVC,那么它仍然很容易实现。您正在寻找:response.addHeader("X-UA-Compatible", "IE=edge,chrome=1");,但是这里有完整的github gist
Paul Nelson Baker

1
@PatrickJamesMcDougle我必须在Apache服务器上同时启用headerssetenvifmods才能使其正常工作。
iglvzx 2014年

这在哪里添加有关系吗?应该是第一件事吗?
停留

1
W3C HTML验证程序的维护者在这里。如果您在值中输入“ chrome = 1”,则此答案中的解决方案将不再起作用,因为我们此后还添加了对标头的检查(以及对meta元素的检查),并且根据HTML规范,在任一位置(meta元素或标头),唯一允许的值为“ IE = Edge”。
sideshowbarker



1

如果下载/构建验证器src代码,则可以自己添加支持。

将以下内容添加到一个文件中,例如html5-meta-X-UA-Compatible.rnc),然后将其包含在中html5full.rnc

我做到了,它很好地用于验证。

meta.http-equiv.X-UA-Compatible.elem =
  element meta { meta.inner & meta.http-equiv.X-UA-Compatible.attrs }
  meta.http-equiv.X-UA-Compatible.attrs =
    ( common.attrs.basic
      & common.attrs.i18n
      & common.attrs.present
      & common.attrs.other
      & meta.http-equiv.attrs.http-equiv.X-UA-Compatible
      & meta.http-equiv.attrs.content.X-UA-Compatible
      & ( common.attrs.aria.role.presentation
        | common.attrs.aria.role.menuitem
        )?
    )
    meta.http-equiv.attrs.http-equiv.X-UA-Compatible = attribute http-equiv {
      xsd:string {
        pattern = "X-UA-Compatible"
      }
    }
    meta.http-equiv.attrs.content.X-UA-Compatible = attribute content {
      xsd:string {
        pattern = "IE=((edge)|(EmulateIE(7|8|9|10))|7|8|9|10|11)(,chrome=(1|0))?"
      }
    }

common.elem.metadata |= meta.http-equiv.X-UA-Compatible.elem

0

,chrome=1从meta标签中删除它会正常工作。使用验证器:

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

-1

我遇到了同样的问题,并且在整个生产线中添加并围绕该问题进行了补救。

<!--[if IE]><meta http-equiv="x-ua-compatible" content="IE=9" /><![endif]-->

1
有人知道为什么被否决吗?它实际上使验证器正常工作。
Maciej Paprocki 2014年

2
可能是因为它实际上并没有取得任何成就。1.条件注释在IE10及更高版本中不起作用。2. X-UA兼容用于使较新的浏览器模仿较旧的浏览器。因此,这行代码有效地说明了:1. IE 10和11使用默认模式呈现(因为它们不再解析条件注释)2. IE 9呈现为IE 9(即在大多数情况下为默认模式)。3. IE <9,使用默认模式进行渲染(因为它们无法模拟比他们新的浏览器)
Aleayr 2014年

我还要补充一点,因为它位于注释内(因此,验证器将其忽略),这使验证器“正确”地工作。
aleayr 2014年
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.