1. Progressive Download
2. Streaming
3. Realtime streaming
Baca artikel ini untuk pengingat.
Berikut ini akan diberikan contoh coding untuk HTTP Progressive Download yang bisa diputar di Browser manapun termasuk di Handphone/Smartphone maupun Tablet:
Dalam konteks Player ada 2 opsi:
1. Menggunakan player tambahan spt JW Player
2. Menggunakan player built-in HTML5 Video Player
Note: sebenarnya player spt JW Player menggunakan player (rendering engine Flash Player), dan jika Flash Player tidak tersedia JW Player akan menggunakan rendering engine pakai HTML5 Video Player (Javascript).
Coding berikut adalah native coding HTML5 video tag. Dan karena masing-masing browser hanya support salah satu format container (mp4, webm, ogg), maka ke tiga macam container perlu di masukkan dalam coding html. Tujuannya, agar semua browser bisa play video nya.
File asli: Butterfly.mp4 akan di convert ke 2 container lain: Webm dan Ogg. Tentu saja karena WebM dan Ogg tidak menggunakan codec H264 dan AAC maka transcoding perlu di lakukan.
Convert MP4 ke Webm:
ffmpeg -i Butterfly.mp4 -vcodec libvpx -acodec libvorbis Butterfly.webm
Convert MP4 ke Ogg:
ffmpeg -i Butterfly.mp4 -vcodec libtheora -acodec libvorbis Butterfly.ogg |
Coding HTML5 dengan Video tag
<head>
<title> HTML5 Video by roger rough </title> <body> <video controls loop preload="auto">
<source src="Butterfly.mp4" type='video/mp4' />
<source src="Butterfly.webm" type='video/webm' />
<source src="Butterfly.ogg" type='video/ogg codec="theora, vorbis"' />
</video>
</body>
<html>
|
klik disini untuk melihat hasilnya.
No comments:
Post a Comment