Internet Explorer 11 で HTML5 video タグで動画を埋め込んだ同じページを見ているのに、Windows 8.1 の IE 11 では再生されて、Windows 7 の IE 11 では動画が再生されないという現象に悩まされていたのだけど、解決しそうなのでメモ。
細かい検証は出来ていないので、話半分で。
Win7 IE11 で「無効なソース」って言われる
「無効なソース」って言われましても、Win8.1 の IE11 では普通に再生されてる。
一体何をもって無効なのかを教えて欲しい次第。
- docutype 宣言が無い
- MIME Types 書いた？
とかとか、その類の話はわりとすぐ検索で引っかかってきていると思うのだけど、その辺りを設定しても動画は再生できない。
IE(Internet Explorer) 11のHTML5プレイヤーにおいて、Windows 8.1のShuttleではYouTubeの1080p HD動画が再生できるのに、Windows 7ノートPCのIE 11では1080p HD動画の項目がなく720Pまでしか選択できない。今までは、Flash Playerを使っていたため気が付かなかった。Flash Playerでは、1080pも再生可能。
技術メモ： MSEは、Windows 7のInternet Explorer 11ではサポートされない | 沖縄通販生活 – 楽天ブログ
というエントリを見つけ、YouTube の話だよな・・・とは思いつつ、
そんなにいくつも試したわけではないけれども、画面サイズ横 1080px の動画と 720px の動画（.H264）を作成し、Win7 IE11 でページを表示してみると、驚いたことに 720px は再生された。
このことから、映像エンコード時のコーデック等に関係なく、サイズだけが問題になるっぽいと予測された。もうちょっと深く検証してみたいところだけど時間が無い。
＃ 映像の配信には AWS Cloud Front が使われています。
＃ 映像のサイズは定石と言われているサイズではないものを扱っています。
OS による Internet Explorer 11 の違い
先に引用したエントリに記載されていたのだけど、YouTube HTML5 動画プレーヤーを訪れてみると
- win8.1 IE11 は Media Source Extensions がサポートされている
- win7 IE11 は Media Source Extensions がサポートされていない
という違いがあった。Media Source Extensions とは？
Internet Explorer 11 では、HTML5 の Media Source Extensions (MSE) を使った MPEG-DASH メディア ストリーミングのサポートが導入されています。 MSE は、プラグインを使わずにメディア ストリームを動的に変更できる video 要素や audio 要素を拡張します。これにより、アダプティブ メディア ストリーミング、ライブ ストリーミング、動画のスプライス、動画編集などの処理ができるようになります。
Microsoft Edge では、MSE のサポートが強化されており、最新の W3C Media Source Extensions 仕様に沿ったものになっています。
重要 Windows 7 の Internet Explorer 11 では、この機能はサポートされていません。
ということで殆ど理解できないし、MSE のサポート有無が、動画の画面サイズの大きい物を読み込めるかどうかに繋がっているようにも読み取れないけど、とにかく違いがあるということだけははっきりした。