Microsoft Edge で HLS (HEVC/H.265, fMP4) をネイティブ再生する件

スポンサーリンク
HTTP Live Streaming

Atom な Windows 10 の Microsoft Edge で、HEVC/H.265 で fMP4 な HLS (HTTP Live Streaming) のストリームをネイティブ再生できました、という話です。

ということで、HLS 界ではやや最先端っぽい HEVC/H.265, fMP4 でも、macOS, iOS, Windows 10 で、同じストリームとプレイリストと HTML を共用できるということがわかりました。

Linux と Android はどうしようかな、というのはまた別途。

HLS ネイティブ再生環境

  • Intel Atom x5-Z8350 CPU @ 1.44GHz
  • RAM 2GB
  • Windows 10 Home 1803 (64bit)
  • Microsoft Edge 42.17134.1.0

ストリーム作成環境

NVIDIA GeForce GTX 10 シリーズのグラフィックスカードと FFmpeg で、NVENC を使用して HEVC/H.265, fMP4 な HLS 用のストリームとプレイリストを作成します。

  • GeForce GTX 1050
  • NVIDIA ドライバー 390.48
  • FFmpeg 4.0
  • Ubuntu 18.04

NVENC を使用できる FFmpeg のインストールは、例えば下記の通り。

[highlight_bash]cd /tmp && \
git clone https://git.videolan.org/git/ffmpeg/nv-codec-headers && \
cd nv-codec-headers && \
make && \
sudo make install

cd /tmp && \
wget http://ffmpeg.org/releases/ffmpeg-4.0.tar.bz2 && \
tar jxvf ffmpeg-4.0.tar.bz2 && \
cd ffmpeg-4.0 && \
./configure –disable-shared –enable-static && \
make -j$(nproc) && \
sudo make install[/highlight_bash]

ビデオカードが無くても、x265 でソフトウェアエンコードが可能だと思います。

ストリーム、プレイリスト作成

FFmpeg で、実際にストリームとプレイリストを作成してみます。例えば、下記の通り。

[highlight_bash]ffmpeg -i sintel_trailer-1080p.mp4 -acodec aac -ab 192k -ar 48000 -ac 2 -s 1920×1080 -vcodec hevc_nvenc -tag:v hvc1 -vf yadif -g 10 -b:v 6000k -f hls -hls_segment_type fmp4 -hls_time 3 -hls_fmp4_init_filename init.mp4 -hls_playlist_type vod mokyu.m3u8[/highlight_bash]

mokyu.m3u8, init.mp4, そしてセグメント化されたストリーム (m4s) が生成されます。

なお、このストリームは、iOS, macOS でもネイティブ再生できます。

HTML 作成

video タグを入れた html を作成します。例えば、下記の通り。

[highlight_markup]




[/highlight_markup]

再生

HTML、ストリーム、プレイリストをウェブサーバーにアップロードし、Edge で HTML に接続します。Edge の組み込みプレイヤーで再生されれば OK です。