web-dev-qa-db-fra.com

Valeur incorrecte X-UA-Compatible pour l'attribut http-equiv sur la méta de l'élément

J'ai utilisé le même meta que HTML5 Boilerplate, et le validateur HTML du W3C se plaint:

Valeur incorrecte X-UA-Compatible pour l'attribut http-equiv on meta de l'élément.

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

Quel est le problème avec cette balise meta?

108
Randomblue

La compatibilité X-UA n'est pas "standard" HTML (FSVO "standard" qui implique une apparence page de wiki modifiable publiquement référencée par la spécification) ou le validateur n'est pas à jour avec l'actuel statut de ce wiki.

Au moment de la rédaction de ce document (20130326), X-UA-Compatible apparaît sur la page du wiki dans une section indiquant: "Les extensions proposées suivantes ne sont pas encore conformes à toutes les exigences d'enregistrement de la spécification HTML et ne sont donc pas encore autorisées. documents. " Le validateur a donc raison de rejeter cette valeur.

66
Quentin

Si vous cherchez à le rendre techniquement valide (tout le monde aime voir le favicon vert) sans effectuer aucune fonctionnalité, vous devriez pouvoir l'envelopper simplement dans une balise "if IE".

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

Une solution possible consiste à implémenter un en-tête de serveur dans l'en-tête, comme suggéré dans cette écriture de Nice par Aaron Layton. (Tout le mérite devrait aller à lui, et je vais paraphraser plutôt que de plagier ...)

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

"Lorsque Internet Explorer rencontre cette ligne, le moteur utilisé sera d'abord Chrome Frame, si le plug-in est installé, puis Edge (le mode de prise en charge le plus élevé du navigateur) ). "

Étapes :

  • Correction de la validation de la page - Ceci est réalisé en supprimant simplement le tag
  • Vitesse de rendu - Au lieu d'attendre que le navigateur voie la balise, puis change de mode, nous enverrons le bon mode à l'avance comme en-tête de réponse.
  • Assurez-vous que nous ne montrons que le correctif pour Internet Explorer - Nous utiliserons simplement une détection de navigateur côté serveur et l'enverrons uniquement à IE.

Pour ajouter l'en-tête dans PHP nous pouvons simplement ajouter ceci à notre page:

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


Ou vous pouvez l'ajouter à votre fichier .htaccess comme ceci:

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


Lien vers l’article original, recherchez les mises en garde éventuelles dans les commentaires. Inclut également une implémentation pour C #.

Correction de la valeur incorrecte X-UA-Compatible une fois pour toutes

J'espère que cela t'aides!

30
D.Alexander

.. cela peut-il être une bonne réponse?

Définir l'en-tête HTTP avec PHP:

Ce n'est pas mon propre travail mais j'espère que cela sera utile à d'autres aussi.

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

Voir cet article pour une solution possible

2
Faysal Haque

S'il vous plaît retirer ,chrome=1 de méta tag cela fonctionnera bien. Avec validateur:

<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
1
bharat

Si vous téléchargez/construisez le code src du validateur, vous pouvez ajouter le support vous-même.

Ajoutez ce qui suit dans un fichier tel que html5-meta-X-UA-Compatible.rnc) Ensuite, incluez-le dans html5full.rnc.

Je l'ai fait et cela fonctionne bien pour valider.

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