web-dev-qa-db-ja.com

要素メタの属性http-equivの値X-UA-Compatibleが無効です

HTML5ボイラープレートが使用しているのと同じmetaを使用しましたが、W3C HTMLバリデーターは不平を言っています:

要素メタの属性http-equivの値X-UA-Compatibleが正しくありません。

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

このmetaタグの何が問題になっていますか?

108
Randomblue

X-UA-Compatibleが「標準」HTML(FSVO「標準」 公開編集可能なWikiページ 仕様で参照)に表示されていないか、Validatorが最新のものではありませんそのwikiのステータス。

執筆時点(20130326)で、X-UA-Compatibleがwikiページのセクションの下に表示されます:「以下の提案された拡張機能は、まだHTML仕様のすべての登録要件に準拠していないため、まだ有効ではありませんドキュメント。」したがって、バリデータはこの値を拒否するのに適しています。

66
Quentin

機能的に影響を与えずに技術的に有効にする(誰もが緑のファビコンを見るのが好きな)ようにしたい場合は、「if IE」タグでラップするだけでよいはずです。

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

可能な解決策の1つは、Aaron Laytonによる this Nice write-up で提案されているように、ヘッダーに修正サーバー側を実装することです。 (すべてのクレジットは彼に行くべきであり、私は盗用するのではなく言い換える...)

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

「Internet Explorerがこの行に出くわすと、プラグインがインストールされている場合、最初にChromeフレームに使用されているエンジンを変更し、次に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を修正する

お役に立てれば!

30
D.Alexander

..これは良い答えでしょうか?

PHPでHTTPヘッダーを設定します。

これは私自身の仕事ではありませんが、他の人にも役立つことを願っています。

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

可能な修正についてはこの記事を参照

2
Faysal Haque

正常に動作するメタタグから,chrome=1を削除してください。バリデーター付き:

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

バリデーターの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
1
darcyparker