Для X-UA-Compatible задано значение IE = edge, но он по-прежнему не останавливает режим совместимости - PullRequest
Новая
       81

Для X-UA-Compatible задано значение IE = edge, но он по-прежнему не останавливает режим совместимости

245 голосов
/ 27 мая 2011

Я совсем запутался. Я должен быть в состоянии установить 

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

и IE8 и IE9 должны визуализировать страницу с использованием новейшего движка рендеринга. Тем не менее, я только что проверил его, и если режим совместимости включен в другом месте на нашем сайте, он останется включенным для нашей страницы , даже при том, что мы должны заставить его этого не делать.

Как вы должны убедиться, что IE не использует режим совместимости (даже в интрасети)?

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" />

РЕДАКТИРОВАТЬ: Я только что узнал , что по умолчанию в IE8 используется режим совместимости IE7 для сайтов интрасети. Будет ли это переопределять метатег X-UA-Compatible?

Ответы [ 18 ]

259 голосов
/ 18 февраля 2012

Если вам необходимо переопределить параметры просмотра совместимости IE для сайтов интрасети, вы можете сделать это в файле web.config (IIS7) или через настраиваемые заголовки HTTP в свойствах веб-сайта (IIS6) и установить X-UA-совместим там.Метатег не переопределяет настройки внутренней сети IE в настройках представления совместимости, но если вы установите его на хост-сервере, он переопределит совместимость.

Пример для файла web.config в IIS7: 

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

Редактировать : Я удалил код clear непосредственно перед add;это было ненужное упущение при копировании и вставке.Хороший улов, комментаторы!

182 голосов
/ 09 марта 2012

Рекомендуется решение на стороне сервера, как @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>

Если на странице есть условные комментарии (скажем, расположенные в <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 У них есть несколько решений.

Относительно Интранета иПредставление совместимости, есть настройки, когда вы идете в инструменты> Настройки представления совместимости.

Compatibility view settings

38 голосов
/ 09 апреля 2012

Обратите внимание, что если вы обслуживаете его из PHP, вы также можете использовать следующий код, чтобы исправить это. 

header("X-UA-Compatible: IE=Edge");
25 голосов
/ 18 июля 2011

Как оказалось, это связано с "интеллектуальным" выбором Microsoft , чтобы заставить все сайты интрасети перевести в режим совместимости, даже если для X-UA-Compatible установлено значение IE=edge.

9 голосов
/ 30 августа 2013

Я также получил ту же проблему рендеринга IE9 в стандартах IE7 Document для локального хоста. Я перепробовал много условных комментариев, но безуспешно. В конце я просто удалил все условные теги и сразу же добавил метатег после заголовка, как показано ниже, и это сработало как шарм. 

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

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

7 голосов
/ 24 июля 2013

Даже если вы сняли флажок «Отображать сайты интрасети в представлении совместимости» и в заголовках ответов указали 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

5 голосов
/ 10 сентября 2013

Я добавил в файл htaccess следующее, что и помогло: 

BrowserMatch MSIE ie
Header set X-UA-Compatible "IE=Edge,chrome=1" env=ie
5 голосов
/ 09 сентября 2013

X-UA-Compatible будет переопределять только режим документа, но не режим браузера, и не будет работать для всех сайтов интрасети;в этом случае лучше всего отключить «Отображать сайты интрасети в представлении совместимости» и установить параметр групповой политики , чтобы указать, каким сайтам интрасети требуется режим совместимости.

5 голосов
/ 16 января 2013

Как указывает NEOSWF выше, условные комментарии Пола ирландца прекращают действие метатега.

Здесь есть несколько исправлений (http://nicolasgallagher.com/better-conditional-classnames-for-hack-free-css/)

К ним относятся:

Добавление двух классов HTML, использование заголовков сервера и добавление условного комментария над типом документа.

В моем последнем проекте я решил удалить условные комментарии Пола Айриша. Мне не понравилась идея добавить что-либо до html, не выполняя МНОГО тестов в первую очередь, и приятно видеть, что было установлено, просто посмотрев HTML.

В конце я окружил div сразу после тела и использовал условные комментарии, например 

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

Я мог бы сделать это по всему телу, но это сложнее с CMS, такими как Wordpress.

Очевидно, это еще один DIV внутри разметки, но только для старых браузеров.

Я думаю, что это может быть решение для каждого проекта.

Я также прочитал кое-что о метатеге charset, который должен присутствовать в первых 1024 байтах, так что это гарантирует.

Иногда самые простые и легкие для чтения идеи являются лучшими, и о них определенно стоит подумать! Спасибо за 6-й комментарий по ссылке выше за указание на это.

3 голосов
/ 06 марта 2014

Кроме того, X-UA-Compatible должен быть первым метатегом в разделе head 

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

Кстати, правильный порядок или основные метки головы: 

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

Так

  1. мы установили механизм рендеринга для использования до того, как IExplorer начнет обрабатывать
  2. документ, затем мы устанавливаем кодировку для использования для всех браузеров
  3. затем мы печатаем заголовок, который будет обработан с уже определенной кодировкой.
Страница:
...