広告

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

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 のインストールは、例えば下記の通り。

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

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

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

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

ffmpeg -i sintel_trailer-1080p.mp4 -acodec aac -ab 192k -ar 48000 -ac 2 -s 1920x1080 -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

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

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

HTML 作成

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

<!doctype html>
<html>

<head>
    <title></title>
</head>

<body>

<video src="http://x.x.x.x/mokyu.m3u8"
               controls="controls"
               autoplay="autoplay"
               type="application/x-mpegURL">
</video>

</body>
</html>

再生

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

広告