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

247

Я досить розгублений. Я повинен мати можливість встановити

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

а IE8 і IE9 повинні відображати сторінку за допомогою останнього механізму візуалізації. Однак я лише перевірив це, і якщо Режим сумісності буде включено в іншому місці на нашому веб-сайті, він залишатиметься на нашій сторінці , навіть якщо ми повинні змушувати цього не робити.

Як ви повинні переконатися, що IE не використовує режим сумісності (навіть в інтрамережі)?

FWIW, я використовую декларацію DocType HTML5 ( <!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" />

EDIT: Я щойно дізнався, що за замовчуванням на IE8 використовується режим сумісності IE7 для сайтів інтранет. Чи може це замінити метатег, сумісний з X-UA?

internet-explorer ie8-compatibility-mode x-ua-compatible

— Керрік
джерело

У мене є проблема і з деякими моїми користувачами, ви коли-небудь це з'ясовували? Моє додаток не є інтранет. І тільки як 20% користувачів отримують це, як не дивно.

— Кевін

2

Це може бути результатом вашої смішної <html> розмітки тегів (тему <! - [якщо lt IE 7]>). Спробуйте вийняти його і побачити, чи працює він. Дивіться це питання SO stackoverflow.com/questions/10682827 / ...

— неділя Ironfoot

13

@SundayIronfoot FYI, смішна <html> розмітка тегів, на яку ви посилаєтесь, - це умовні коментарі IE, які використовуються для додавання класу CSS до елемента <html> для відповідної версії IE (якщо застосовується), щоб ви могли стилювати речі по-різному для версій IE, просто додавши декларацію стилю до ".ie7", наприклад: .ie7 p {width: 200px; } ... це більш чітка робота щодо рендерингу проблем у старих версіях IE, ніж використання деяких хаків CSS, таких як * width або _width. Браузери, окрім IE, проігнорують його та просто використають основний.

— Тім Франклін

261

Якщо вам потрібно змінити параметри перегляду сумісності IE для сайтів інтрамережі, ви можете зробити це на веб-сайті web.config (IIS7) або через спеціальні заголовки HTTP у властивостях веб-сайту (IIS6) та встановити там X-UA-Compatible. Метатег не переорієнтовує налаштування інтрамережі IE в Налаштуваннях перегляду сумісності, але якщо встановити його на сервері хостингу, він замінить сумісність.

Приклад для web.config в IIS7:

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

Редагувати : я видалив clearкод безпосередньо перед add; це було зайвим наглядом від копіювання та вставки. Гарний улов, коментатори!

— Тім Франклін
джерело

5

Хоча лише зауваження ... Якщо ви розробляєте за допомогою вбудованого веб-сервера розробки Visual Studio (він же Cassini), це не працюватиме, оскільки Cassini не шанує розділ <system.webServer> в Інтернеті. конфігурація. Тож для розробки замість цього використовуйте IIS Express.

— Джеймс Мессінгер

1

У чому причина <clear />? Які власні заголовки очищуються цим?

— M4N

Ясна здається, що <urlCompression...>принаймні для мене усуне правило. Це правило робить gzipping, чого я хочу, тому я прокоментував зрозуміле. Будь-яка додаткова інформація була б чудовою.

— Ненотлеп

Я видалив "чіткий" - хороший улов, це було зайвим рядком від копіювання та вставлення з моєї реалізації.

— Тім Франклін

14

PHP:<?php header('X-UA-Compatible: IE=edge'); ?>

— Nux

183

Рішення на стороні сервера є рекомендованим, як @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="https://stackoverflow.com/apple-touch-icon.png" />
    <link rel="shortcut icon" href="https://stackoverflow.com/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 У них є кілька рішень.

Щодо перегляду Інтранета та сумісності, то тут ви можете налаштувати перехід до інструментів> Параметри подання сумісності.

Налаштування подання сумісності

— neoswf
джерело

1

Я спробував 4 або 5 інших відповідей на Stack Overflow, і тільки ця конкретна комбінація працювала на мене. Для всіх, хто використовує WordPress та плагін SEO, будьте обережні, щоб плагін переписав <title> в інше місце. Редагувати: Додано коментар WordPress

— Майк Еберт

6

X-UA-Compatibleповинні з’являтися якомога раніше, можливо, післяcharset . Я не думаю, що це правда, що вона "повинна з'являтися відразу після заголовка".

— сам

Ця рекомендація є результатом страждань при ІЕ. Був здобутий кров’ю. Хто каже, що IE дотримується вказівок?

— neoswf

4

Нічого собі, це спрацювало для мене, а мої метатеги відразу після тега заголовка - це те, що зробило трюк. Хочете, щоб це було не так архаїчно, щоб зробити цю роботу ...

— theerm

X-UA-CompatibleМета - тег може з'явитися після того, як title, baseі будь-які інші мета - теги , не втрачаючи при цьому свій ефект. Це те, що я перевірив в IE8. Проте жодних умовних коментарів не можна ставити перед цим.

— Rockallite

37

Зауважте, що якщо ви обслуговуєте його з PHP, ви можете використовувати наступний код, щоб виправити його.

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

— TJ L
джерело

4

Це працює краще, ніж додавання метатега, оскільки він проходить перевірку W3C, використовуючи цей метод, і набагато простіше, ніж хак .htaccess.

— Талві Ватія

2

Я спробував все інше, і це, нарешті, спрацювало. Дякую.

— Джейсон

2

Для тих, хто на WordPress, це може допомогти: codex.wordpress.org/Plugin_API/Action_Reference/send_headers

— неоднозначно

Це працює набагато краще і тоді, коли величезний сайт будується залежно від <!--[if lt IE 7 ]> <html>...! СПАСИБІ! Тебе бог послав !!

— OZZIE

2

@sunskin - Будь-який заголовок, надісланий PHP, ОБОВ'ЯЗКОВО відбудеться до надсилання будь-якого виводу на сторінку, тобто перед тим, як PHP виводить будь-який HTML або дані.

— TJ L

25

Як виявляється, це пов'язане з "розумним" вибором Microsoft, щоб змусити всі сайти інтрамережі змусити працювати в режимі сумісності, навіть якщо X-UA-Compatibleце встановлено IE=edge.

— Керрік
джерело

32

Це не правда. X-UA-Compatible замінить налаштування режиму сумісності. Однак іноді використовувати метатег не працює, оскільки режим уже встановлений до моменту, коли він стикається з ним. Ось чому я використовую версію заголовка HTML, щоб браузер міг включити стандартний режим на початку процесу.

— Ерік Функенбуш

3

Додавши до коментаря Mystere Man, ви можете змінити його з хостинг-сервера, використовуючи web.config або користувацькі заголовки http у IIS. Докладніше див. У моєму дописі вище.

— Тім Франклін

7

Я пробував це кілька разів, і він не перекриває всі сайти інтрамережі, вимушені в режимі порівняння.

— Maess

@Mystere Man: Визначайте іноді так, як завжди, коли сторінка знаходиться в рамці iframe, де батьківський документ не визначає XUA-COMPAT, а режим документа успадковується з батьківської сторінки (інший дуже інтелектуальний вибір MS).

— Стефан Штайгер

1

@ Керрік: Це не правильна відповідь. Правильну відповідь див. Нижче, на яку відповів tj111.

— вироджений

9

Я також отримав той самий випуск візуалізації IE9 у стандартах IE7 Document для місцевого хоста. Я спробував багато умовних тегів коментарів, але безуспішно. Врешті-решт я просто видалив усі умовні теги і просто додав метатег негайно за головою, як нижче, і це спрацювало як шарм.

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

Сподіваюся, це допомагає

— Прамод
джерело

7

Навіть якщо ви зняли прапорець "Відображати сайти інтрамережі в режимі сумісності" і маєте заголовки X-UA-сумісність у заголовках відповідей, є ще одна причина, чому ваш веб-переглядач у будь-якому разі може бути за замовчуванням "Перегляд сумісності" - ваша групова політика. Подивіться на консоль наступного повідомлення:

HTML1203: xxx.xxx був налаштований для запуску в представленні сумісності за допомогою групової політики.

Де xxx.xxx - домен для вашого сайту (тобто test.com). Якщо ви бачите це, то групова політика для вашого домену встановлюється таким чином, що будь-який сайт, який закінчується на test.com, автоматично відображатиметься в режимі сумісності незалежно від типу, заголовків тощо.

Для отримання додаткової інформації перейдіть за наступним посиланням (пояснює html-коди): http://msdn.microsoft.com/en-us/library/ie/hh180764(v=vs.85).aspx

— ршадман
джерело

5

Як NEOSWF зазначає вище, умовні коментарі Пола Ірландії зупиняють метатег, який має будь-який вплив.

Тут є кілька виправлень ( http://nicolasgallagher.com/better-conditional-classnames-for-hack-free-css/ )

До них належать:

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

На своєму останньому проекті я вирішив видалити умовні коментарі до Пола Ірландії. Мені не сподобалася ідея додавати що-небудь перед html, не роблячи ЛОТС тестування спочатку, і приємно бачити, що було встановлено, просто переглянувши HTML.

Врешті-решт я оточив діва прямо за тілом і використав умовні коментарі, наприклад

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

Я міг би зробити це по всьому тілу, але це складніше з такими CMS, як Wordpress.

Очевидно, його ще один DIV всередині розмітки, але лише для старих браузерів.

Я думаю, що це може бути рішення на основі кожного проекту.

Я також прочитав щось про метатег charset, який потрібно прийти в перші 1024 байти, щоб це гарантувало.

Іноді найпростіші, найпростіші для читання ідеї - найкращі, і їх, безумовно, варто подумати! Дякуємо 6-му коментарю за посиланням вище, що вказали на це.

— користувач1010892
джерело

5

X-UA-Compatibleбуде замінено лише режим «Документ», а не «Режим перегляду» і не працюватиме на всіх сайтах внутрішньої мережі; якщо це у вашому випадку, найкращим рішенням буде відключити "Відображення сайтів інтрамережі в режимі сумісності" та встановити групову політику, щоб вказати, яким сайтам інтранет потрібен режим сумісності.

— Тоні
джерело

5

Я додав у свій файл htaccess таке, що зробив трюк:

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

— Мецед
джерело

1

це працює, коли інтранет встановлений на сумісність. мені знадобилося багато часу, щоб знайти щось, що спрацює. спеціально, коли ви шукаєте, і все пов'язане з цим

— shorif2000

Це круто. Я не знав, що ви можете надсилати заголовки з .htaccess

— Alex W

3

Крім того, X-UA-сумісний повинен бути першим метатегом у розділі голови

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

Сюди

ми встановлюємо движок візуалізації для використання до того, як IExplorer почне обробляти
документ, тоді ми встановлюємо кодування, яке слід використовувати для всіх браузерів
тоді ми друкуємо заголовок, який буде оброблено за допомогою вже визначеного кодування.

— Леонардо Моліна
джерело

2

Насправді, CHARSET повинен передувати X-UA-сумісному. Дивіться blogs.msdn.com/b/ieinternals/archive/2011/07/18/…

— EricLaw

1

Це не обов'язково має бути першим, але потрібно бути біля вершини. Це може слідувати заголовку (і шаблону, як зауважив Ерік), але це про це.

— Ленс Леонард

у моєму випадку на nginx він працюватиме лише в тому випадку, якщо тег X-UA-Compatible є першим у розділі голови

— Марко Рот

2

Тіммі Франкс мав це як на мене. Сьогодні у нас просто виникло питання про те, де клієнт мав IE8 по всій компанії, і він змушував сайт, який ми написали для їх інтрамережі, в режим сумісності. Налаштування "IE-Edge", здавалося, виправляло це.

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

— SouthShoreAK
джерело

2

Для Nginx,

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

ref: https://github.com/h5bp/server-configs/commit/a5b0a8f736d68f7de27cdcb202e32975a74bd2c5

— z2z
джерело

1

IE 11 не дозволяє більше змінювати параметри подання сумісності браузера, надсилаючи заголовок ...

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

Здається, єдиний спосіб змусити браузер не використовувати перегляд сумісності - це дозволити користувачу відключити його у своєму браузері. Наш сайт - Інтранет, і за замовчуванням IE - це використання перегляду сумісності для Інтранет-сайтів. Який біль!

Нам вдалося запобігти необхідності змінити налаштування свого веб-переглядача для користувачів IE 9 та 10, але це більше не працює в IE 11. Наші користувачі IE переходять на Chrome, де це не проблема, і ніколи не має були.

— EricP
джерело

Це не те, що це не дозволяє, IE11не підтримує інші способи сумісності, крім edge. Посилання на офіційну документацію . Це означає, що нам більше не потрібно використовувати цей метатег, щоб приховувати кнопку CM на адресному рядку.

— Уоллес Сідрее

4

Неправда: IE11 все ще підтримує всі застарілі режими сумісності.

— EricLaw

@EricLaw, чи правильна відповідь EricP (що IE11 змінює поведінку для заголовка HTTP-сумісного з X-UA)?

— Метью Флашен

@EricP, ви спробували заголовок HTTP або лише версію тегу <meta>?

— Метью Флашен

2

@MatthewFlaschen: Ні, EricP невірний, як і Уоллес Сідрі (хоча, щоб справедливо ставитися до Уоллеса, MSDN не пояснює, що вони означають під "застарілим"). Що змінилося в IE11, це те, що взагалі немає видимої кнопки "Перегляд сумісності" ( technet.microsoft.com/en-us/library/dn321449.aspx ), але декларації, сумісні з X-UA, все ще дотримуються.

— EricLaw

1

Мені вдалося обійти це завантаження заголовків перед HTML із php, і це спрацювало дуже добре.

<?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 - це вміст, який я хотів завантажити після надсилання заголовків.

— користувач3071843
джерело

1

У мене виникло те саме питання в IE11. Жодна з цих відповідей не вирішила мого питання. Трохи перекопавши, я помітив, що браузер працює в режимі Enterprise . .

Мені вдалося змінити профіль на Desktop після видалення CurrentVersion із наступного ключа реєстру:

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

Після зміни режиму на робочий стіл відповіді на це повідомлення запрацюють.

— jfatal
джерело

1

Коли ваш веб-переглядач відкриється за допомогою режимів сумісності, навіть якщо ви вилучите та вимкнете всі конфігурації режимів сумісності зі свого веб-браузера та редактора локальної групової політики, ви можете спробувати відключити його від ключа реєстрації.

Це також трапляється зі мною щодо використання домену та субдомену для підключення до сервера. Машина забороняється відкривати в режимі сумісності для всіх субдоменів.

РЕЖИМ СПІВРОБІТНОСТІ ДЛЯ ІНТРАНЕТУ

HKEY_LOCAL_MACHINE - ПРОГРАМНЕ ЗАБЕЗПЕЧЕННЯ - Політика - Microsoft - Internet Explorer - BrowserEmulation -> IntranetCompalityMode Значення має бути 0 (нуль) . А також видаліть існуюче доменне ім’я з PolicyList.

В іншому випадку ви можете додати нове значення (DWORD), що містить 0 (нульове) значення значення.

— ayciceksamet
джерело

0

У мене виникло те саме питання після спроби багатьох комбінацій. У мене була ця робоча записка. Я перевірив сумісність на інтранет

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

— кападлеман
джерело

0

Якщо ви використовуєте стек LAMP, додайте це у свій файл .htaccess у вашій веб-кореневій папці. Не потрібно додавати його до кожного PHP-файлу.

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

— Кевін Сміт
джерело