[Tips]LIFFアプリで動画再生をしてみる #LINE_API

2019.10.28

この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。

はじめに

こんにちは、中村です。
完全にTipsですが、Webで一般的な動画再生がLIFFアプリ上で展開できるか調べてみます。

LIFFアプリで動画再生

LIFFはWebアプリですのでHTML5やCSS、JavaScriptを利用できます。動画再生には、HTML5のvideoタグで再生が可能です。video.jsなどのライブラリを利用して実現するのも良いでしょう。

サンプルコード

HTML5のvideoタグで実現する場合は、このコードだけでプレイヤーと共に動画プレイヤーを表示できます。 今回は.mp4をvideoタグで再生します。

<video id="video" width="300" height="200" src="https://xxxxxxxx.cloudfront.net/assets/movie.mp4" poster="https://xxxxxxxx.cloudfront.net/assets/poster.png" controls></video>

LIFFによるテスト

.mp4での再生が確認できました。HLS(ストリーミング)再生は確認したところLIFFでは非対応です。

まとめ

LIFFはWebアプリですので通常の公式アカウントに比べ柔軟な体験を作成することが可能ですが、動画再生の点ではHLSへのサポートが未対応です。

今後LIFFのアップデートによってサポートがされると、サービス提供者専用のストリーミングサービスやTVerのようなVODプラットフォームなどを展開できるようになるのではないかと思います。