Nieprawidłowa wartość Zgodność z X-UA dla atrybutu http-equiv w meta elementu

110

Użyłem tego samego, metaktórego używa Boilerplate HTML5, a walidator HTML W3C narzeka:

Nieprawidłowa wartość Zgodność z X-UA dla atrybutu http-equiv w meta elementu.

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

Co jest nie tak z tym metatagiem?

Randomblue
źródło
6
Oto fajny wpis na blogu na ten temat (był to również pierwszy wynik wyszukiwania, jaki otrzymałem): blog.yjl.im/2011/01/…
ComFreek

Odpowiedzi:

67

Albo X-UA-Compatible nie jest „standardowym” HTMLem („standard” FSVO, który obejmuje wyświetlanie na publicznie edytowalnej stronie wiki, do której odwołuje się specyfikacja), albo Validator nie jest na bieżąco z aktualnym stanem tej wiki.

W chwili pisania tego tekstu (20130326) X-UA-Compatible pojawia się na stronie wiki w sekcji, która stwierdza: „Następujące proponowane rozszerzenia nie są jeszcze zgodne ze wszystkimi wymogami rejestracyjnymi w specyfikacji HTML i dlatego nie są jeszcze dozwolone dokumenty. ” Więc walidator ma rację, odrzucając tę ​​wartość.

Quentin
źródło
8
Niewłaściwa strona wiki. Ten, z którym łączysz się, jest przeznaczony <meta name= .... Dla <meta http-equiv=...strony jest wiki.whatwg.org/wiki/PragmaExtensions
Alohci
6
Prawidłowa strona wiki zawiera X-UA-Compatible, więc obowiązuje alternatywa „Walidator nie jest aktualny”. Nawet validator.nu (o którym ogólnie mówi się, że jest bardziej aktualny) jest pod tym względem nieaktualny.
Jukka K. Korpela
Dzięki za poprawki. Nie zdawałem sobie sprawy, że wartości meta atrybutów zostały podzielone na dwie strony.
Quentin
1
Zobacz moją odpowiedź, aby zobaczyć przykład, jak zaktualizować walidator do obsługi X-UA-Compatible. stackoverflow.com/a/21048010/1006963
darcyparker
więc jak mogę rozwiązać problem z walidatora W3c ... czy mogę usunąć tag?
Krish
42

Jeśli chcesz, aby była poprawna pod względem technicznym (każdy lubi widzieć zieloną ikonę ulubionych) bez wpływu na jakąkolwiek funkcjonalność, powinieneś być w stanie po prostu umieścić ją w tagu „if IE”.

<!--[if IE]><meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'><![endif]-->
Matthew Haeck
źródło
22
To skutecznie wyłącza obsługę Chrome Frame, ponieważ Chrome Frame ignoruje warunkowe komentarze IE, patrz jeffreybarke.net/2010/08/…
Jasper Moelker
5
@JasperMoelker: prawdopodobnie warto wspomnieć, że artykuł, do którego podałeś link, zawiera również obejście dla Chrome Frame, co jest fantastyczne: Walidacja + obsługa Chrome Frame!
Luke
5
Nie, nie, nie, to łamie kompatybilność z X-UA. xn--mlform-iua.no/blog/…
brentonstrine
30

Jednym z możliwych rozwiązań jest wprowadzenie poprawek po stronie serwera w nagłówku, jak zasugerowano w ten miły write-up przez Aaron Layton. (Cała zasługa należy mu się, a ja sparafrazuję, a nie plagiatuję ...)

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

„Gdy Internet Explorer napotka tę linię, zmieni silnik, który jest używany najpierw w Chrome Frame, jeśli wtyczka jest zainstalowana, a następnie na Edge (najwyższy obsługiwany tryb dokumentu w przeglądarce)”.

Kroki :

  • Napraw weryfikację strony - uzyskuje się to po prostu usuwając tag
  • Szybkość renderowania - zamiast czekać, aż przeglądarka zobaczy tag, a następnie zmienić tryby, wyślemy odpowiedni tryb z góry jako nagłówek odpowiedzi
  • Upewnij się, że pokazujemy tylko poprawkę dla Internet Explorera - po prostu użyjemy wykrywania przeglądarki po stronie serwera i wyślemy ją tylko do IE

Aby dodać nagłówek w PHP, możemy po prostu dodać to do naszej strony:

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


Lub możesz dodać go do swojego pliku .htaccess w następujący sposób:

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


Link do oryginalnego artykułu, sprawdź komentarze pod kątem ewentualnych zastrzeżeń. Zawiera również implementację dla języka C #.

Napraw raz na zawsze złą wartość Zgodność z X-UA

Mam nadzieję że to pomoże!

D.Alexander
źródło
1
W chwili pisania tego rozwiązania to rozwiązanie jest zaimplementowane w pliku HTML5BP .htaccess. Tak więc, zakładając, że twój serwer Apache ma włączone mod_headers, możesz bezpiecznie usunąć <meta>z pliku html.
Patrick James McDougle
Jeśli używasz Spring MVC, tak jak ja, nadal jest to dość łatwe. Szukasz :,response.addHeader("X-UA-Compatible", "IE=edge,chrome=1"); ale tutaj jest pełna treść github .
Paul Nelson Baker
1
@PatrickJamesMcDougle Musiałem włączyć oba mody headersi setenvifna moim serwerze Apache, aby to zadziałało.
iglvzx
Czy to ma znaczenie, gdzie to jest dodane? Czy to powinna być pierwsza rzecz?
Staysee
1
Opiekun walidatora HTML W3C tutaj. Jeśli umieścisz „chrome = 1” w wartości, rozwiązanie w tej odpowiedzi nie będzie już działać, ponieważ od tego czasu dodaliśmy również sprawdzenie nagłówka (razem ze sprawdzaniem elementu meta) i zgodnie ze specyfikacją HTML, w każdym miejscu (elemencie meta lub nagłówku) jedyną dozwoloną wartością jest „IE = Edge”.
sideshowbarker
1

Jeśli pobierzesz / zbudujesz kod źródłowy walidatora, możesz samodzielnie dodać wsparcie.

Dodaj następujące elementy do pliku, na przykład html5-meta-X-UA-Compatible.rnc), a następnie uwzględnij go whtml5full.rnc .

Zrobiłem to i działa to dobrze w przypadku walidacji.

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
źródło
0

Usuń ,chrome=1z metatagu, będzie działać poprawnie. Z walidatorem:

<meta http-equiv="X-UA-Compatible" content="IE=edge" />
bharat
źródło
-1

Miałem ten sam problem i dodawanie i otaczanie całej linii rozwiązało sytuację.

<!--[if IE]><meta http-equiv="x-ua-compatible" content="IE=9" /><![endif]-->
cinemafunk
źródło
1
Czy ktoś wie, dlaczego jest dyskutowany? To faktycznie sprawia, że ​​walidator działa poprawnie.
Maciej Paprocki
2
Prawdopodobnie dlatego, że tak naprawdę niczego nie osiąga. 1. Komentarze warunkowe nie działają w IE10 i nowszych. 2. X-UA-Compatible służy do tworzenia nowych przeglądarek naśladujących starsze. W efekcie ta linia mówi tak: 1. IE 10 i 11, renderowanie w trybie domyślnym (ponieważ nie analizują już komentarzy warunkowych) 2. IE 9, renderowanie jako IE 9 (tj. W większości przypadków jest to tryb domyślny). 3. IE <9, renderowanie w trybie domyślnym (ponieważ nie mogą emulować przeglądarki nowszej niż są)
aleayr
Dodam również, że sprawia, że ​​walidator działa „poprawnie”, ponieważ znajduje się w komentarzu (więc walidator go ignoruje).
aleayr