Rabu, 27 Juni 2012

Pemrograman Web : Membuat Video Streaming dengan Flash Video Web Player JWPlayer pada Halaman Web

Menambahkan Web Player ke Halaman Web

Jika video yang kita punyai belum dalam format FLV (Flash Video) maka langkah pertama download dan Install FLV Encoder dari http://www.videohelp.com/tools/Riva-FLV-Encoder  (gratis) atau Super dari URL http://www.videohelp.com/tools/SUPER
 (gratis) atau bisa memakai Flash Professional.

Kemudian konversi video anda ke format flash flv dengan Riva FLV Encoder atau Super atau Flash Professional. Berikut ini tampilan konversi video menggunakan Riva Encoder :



Sedangkan ini adalah tampilan program konversi video Super :



Jika anda ingin mengecek hasil konversi video ke format FLV, maka bisa dilakukan dengan  download dan install FLV Player dari http://www.videohelp.com/tools/FLV_Player.

Setelah semua siap, download Flash Streaming Player bernama JWPlayer dari URL berikut http://www.longtailvideo.com/players/jw-flv-player/ . Kemudian ekstrak (uncompress) dan gabungkan satu directory dengan video yang telah disiapkan. Kemudian letakkan (copy atau upload) video anda beserta file-file JWPlayer ke folder web lokal (htdocs/www) atau ke folder hosting online (www/public_html). 


Kemudian buka halaman web tempat anda ingin meletakkan Web Streaming Playernya, kemudian pada HTML nya tambahkan kode program berikut :


<!-- START OF THE PLAYER EMBEDDING TO COPY-PASTE -->

<object id="player" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" name="player" width="400" height="315">
<param name="movie" value="player.swf" />
<param name="allowfullscreen" value="true" />
<param name="allowscriptaccess" value="always" />
<param name="flashvars" value="file=video.flv&image=preview.jpg" />
<embed
type="application/x-shockwave-flash"
id="player2"
name="player2"
src="player.swf" 
width="400" 
height="315"
allowscriptaccess="always" 
allowfullscreen="true"
flashvars="file=video.flv&image=preview.jpg" 
/>
</object>

<!-- END OF THE PLAYER EMBEDDING -->

Kemudian pada script di atas ubahlah setting berikut :
Ganti myvideofile.flv dengan nama video flv anda 
Ganti http://www.myhomepage.com/ dengan alamat URL web anda. 
Ganti width and height dengan lebar dan tinggi resolusi video flv anda. 
Tambahkan &autostart=1 ke URL video jika anda ingin agar video tersebut langsung dimainkan (autoplay)

Contohnya: 

file=http://www.myhomepage.com/myvideofile.flv&autostart=1

Hasilnya



Di bawah ini adalah JWMedia Player versi lama (karena ringan), maaf khusus file ini private, hanya bisa didownload oleh penulis, silakan mendownload versi terbarunya  di link JWPlayer di atas :