Internet Explorer11へアップデートされてから1ヶ月。多くのWebアプリが動作不良を起こし、混乱が生じているようです。
IEは11から、「User Agent スニッフィング」と呼ばれる手段で、Webブラウザに依存した作り込みが行われることを防ぐため大胆な仕様変更を行いました。これまでWebブラウザ/バージョンの特定の手段として広く利用されていたユーザエージェント文字列から、重要な項目が削除されたのです。
ネット上では断片的な情報が散らばっているようですが、不十分な対策も多く見受けられます。そこで今回、対策の方法について体系的かつ網羅的に理解できるよう、4つの観点から整理してみました。
本稿が、読者の方が運用しているシステムへ万全の対策を行えることを、そして開発者がWebの正しい指針に従い開発を進める助けになれば幸いです。
対策一覧
IE11の設計指針「User Agent スニッフィング」の防止とは？
今回のIEの仕様変更は、少々強引とはいえ、Web技術にポジティブなインパクトを与えるきっかけになるでしょう。
IEは近年のWeb開発のお作法である「機能の有無によるクロスブラウザ型のWeb開発」という思想を広めるため、現在悪とされている「ユーザエージェント特定によるマルチブラウザ型のWeb開発」、つまりWebブラウザごとに個別の作りこみを行いにくい仕様へ徐々に移行を進めてきました。バージョンを上げるごとにユーザエージェントに含まれる.NETフレームワークのバージョンなどIE固有の情報を減らし続け、そしてバージョン10からは「条件付きコメント」の廃止という思い切った仕様変更を行っています。
サーバ側でIE/バージョンの特定を行うための実用的な情報は廃止しなかったため、サーバ側のミドルウェアへのインパクトはほぼ皆無でした。IEそのものがWeb標準への準拠が高くなったため、十分なマルチブラウザ対策が行われているサービスであれば、クライアント側でも問題は小さかったようです。
しかし今回、11へのアップデートでは、サーバ・クライアントの双方でWebブラウザの種類を判別するためにもっとも広く利用されている、ユーザエージェントの内容を大きく変更しました。この変更は、Webブラウザでの動作切り替えを行わないと現実的な開発が行えなかった3-5年以上前の古いWebアプリ・サイトで、動作不良を起こす原因となっています。また、JavaScriptのAPI経由でユーザエージェント情報を収集し動作を切り替えていたサービスでも、同様に問題となっているようです。
理想を言えば、このタイミングでIEに依存しない作り込みをサーバ側でも行うべきです。しかし実態としては、既存資産の維持へは最小のコストで対策し、次の更改まで維持し続けることが現場として求められることでしょう。本稿で紹介した4つの対策は、あくまで既存資産を延命させるための対策であるものと考えて下さい。新規開発であれば、これからご紹介する「クロスブラウザ対策」を参考に開発することが推奨されます。
正しい解決、クロスブラウザ対策
現在Webでは、Webブラウザの持つ機能の有無に応じて動作を変えるという手法が推奨されています。Microsoftが公開しているドキュメントからも、その思想が読み取れるはずです。
▼ 機能検出と動作検出の使用
http://msdn.microsoft.com/ja-jp/library/ie/ff986088(v=vs.85).aspx
MicrosoftのドキュメントではjQuery.supportを推奨していますが、より高度な機能を有したModernizrも有用です。その利用方法と思想については、本ブログでも記事としてまとめています。
▼ クロスブラウザ対応を助けるJSライブラリ"Modernizr"
http://furoshiki.hatenadiary.jp/entry/2013/06/29/220621
最後に、Microsoftが公開しているIE11の互換性/変更点に関するドキュメントを紹介します。
▼ ブラウザーの機能と互換性の変更点
http://msdn.microsoft.com/ja-jp/library/ie/dn467848(v=vs.85).aspx
IE11のユーザエクスペリエンスの改善の多くは、マルチデバイス時代への対応を意識したものが多いようです。今後のIEのアップデートでも、この傾向はより強くなるものと予想されます。
JSライブラリを利用した開発は高いユーザエクスペリエンスと相互運用性を確保できますが、デスクトップUIへ特化しているケースも多いように思えます。IEのバージョンだけでなくマルチデバイスへの対応もトータルに考えて、Web標準技術の利用ついて、考える必要があるでしょう。
