Неверное значение X-UA-Compatible для атрибута http-Equiv в метаэлементе

110

Я использовал то же самое, metaчто и HTML5 Boilerplate, и валидатор HTML W3C жалуется:

Неверное значение X-UA-Compatible для атрибута http-экв в метаэлементе.

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

Что не так с этим metaтегом?

Randomblue
источник
6
Вот хороший пост об этом в блоге (это был мой первый результат поиска): blog.yjl.im/2011/01/…
ComFreek

Ответы:

67

Либо X-UA-Compatible не является «стандартным» HTML («стандарт» FSVO, который включает отображение на общедоступной странице wiki, на которую ссылается спецификация), либо Validator не обновляет текущий статус этой wiki.

На момент написания (20130326) X-UA-Compatible отображается на вики-странице в разделе, который гласит: «Следующие предлагаемые расширения еще не соответствуют всем требованиям регистрации в спецификации HTML и, следовательно, еще не разрешены в действительных документы ". Таким образом, валидатор правильно отклоняет это значение.

Quentin
источник
8
Неправильная страница вики. Тот, на который вы ссылаетесь, предназначен <meta name= .... Для <meta http-equiv=...страницы является wiki.whatwg.org/wiki/PragmaExtensions
Alohci
6
Правильная страница вики содержит X-UA-Compatible, поэтому применяется альтернатива «Валидатор не обновлен». Даже validator.nu (который в целом считается более актуальным) в этом отношении устарел.
Юкка К. Корпела
Спасибо за исправления. Я не осознавал, что значения мета-атрибутов были разделены на две страницы.
Quentin
1
В моем ответе показан пример того, как исправить валидатор для поддержки X-UA-Compatible. stackoverflow.com/a/21048010/1006963
darcyparker
Итак, как я могу исправить проблему с помощью валидатора w3c .. могу ли я удалить тег?
Криш
42

Если вы хотите сделать его технически допустимым (всем нравится видеть зеленый значок), не влияя на какие-либо функции, вы можете просто заключить его в тег «if IE».

<!--[if IE]><meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'><![endif]-->
Мэтью Хэк
источник
22
Это фактически отключает поддержку Chrome Frame, поскольку Chrome Frame игнорирует условные комментарии IE, см. Jeffreybarke.net/2010/08/…
Джаспер Мёлкер
5
@JasperMoelker: вероятно, стоит упомянуть, что статья, на которую вы указали ссылку, на самом деле также содержит обходной путь для Chrome Frame, который фантастический: проверка + поддержка Chrome Frame!
Люк
5
Нет-нет-нет, это нарушает X-UA-Compatible. xn--mlform-iua.no/blog/…
brentonstrine
30

Одно из возможных решений - реализовать исправление на стороне сервера в заголовке, как это было предложено в этой красивой статье Аарона Лейтона. (Вся заслуга принадлежит ему, и я скорее перефразирую, чем плагиат ...)

<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-Compatible раз и навсегда

Надеюсь это поможет!

Д.Александр
источник
1
На момент написания это решение реализовано в файле HTML5BP .htaccess. Итак, при условии, что на вашем сервере Apache включен mod_headers, вы можете безопасно удалить <meta>из файла html.
Патрик Джеймс Макдугл,
Если вы, как и я, используете Spring MVC, это все равно довольно легко сделать. Вы ищете:, response.addHeader("X-UA-Compatible", "IE=edge,chrome=1");но вот полная суть github .
Пол Нельсон Бейкер
1
@PatrickJamesMcDougle мне пришлось включить оба headersи setenvifмоды на моем сервере Apache , чтобы получить эту работу.
iglvzx
Имеет ли значение, где это добавлено? Это должно быть в первую очередь?
Staysee
1
Сопровождение валидатора HTML W3C здесь. Если вы поместите "chrome = 1" в значение, решение в этом ответе больше не будет работать, потому что с тех пор мы добавили проверку заголовка (вместе с проверкой метаэлемента) и согласно спецификации HTML, в любом месте (метаэлемент или заголовок) единственное допустимое значение - "IE = Edge".
sideshowbarker
2

.. может это быть хорошим ответом?

Установите заголовок HTTP с помощью PHP:

Это не моя собственная работа, но я надеюсь, что она будет полезна и другим.

user1508429
источник
7
Обратите внимание, что ответы только по ссылкам не приветствуются (ссылки со временем устаревают). Пожалуйста, отредактируйте свой ответ и добавьте сюда синопсис.
bummi
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
darcyparker
источник
0

Удалите ,chrome=1из метатега, он будет работать нормально. С валидатором:

<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
2
Наверное, потому, что на самом деле ничего не дает. 1. Условные комментарии не работают в IE10 и выше. 2. X-UA-Compatible позволяет новым браузерам имитировать старые. Итак, что фактически говорит эта строка: 1. IE 10 и 11, визуализируются в режиме по умолчанию (поскольку они больше не анализируют условные комментарии) 2. IE 9, отображаются как IE 9 (то есть в большинстве случаев это режим по умолчанию). 3. IE <9, рендеринг в режиме по умолчанию (поскольку они не могут эмулировать браузер, который новее, чем они есть)
aleayr
Я также добавлю, что это заставляет валидатор работать «должным образом», потому что он находится внутри комментария (таким образом, валидатор игнорирует его).
aleayr