Video Streaming Berbasis Web dengan XAMPP

Video Streaming Berbasis Web dengan XAMPP

1. Landasan Teori

1.1 Pengertian Video Streaming

    Video streaming adalah istilah yang sering kita gunakan saat melihat video diinternet melalui browser dimana kita tidak perlu men-download file video tersebut untuk dapat memutarnya. Istilah ini tersebut terdiri dari dua suku kata yaitu video dan streaming, secara istilah video berarti teknologi untuk menangkap, merekam, memproses, mentransmisikan dan menata ulang gambar bergerak, sedangkan streaming berarti proses penghantaran data dalam aliran berkelanjutan dan tetap yang memungkinkan pengguna mengakses dan menggunakan file sebelum data dihantar sepenuhnya.
   Jadi video streaming dapat diartikan transmisi file video secara bekelanjutan yang memungkinkan video tersebut diputar tanpa menunggu file video tersebut tersampaikan secara keseluruhan.
    Video streaming banyak diimplementasikan pada dunia pertelevisian untuk melakukan siaran dari website atau mengirimkan gambar siaran langsung melalui website atau disebut juga live streming. Jadi gambar yang didapatkan dari siaran langsung, sesegera mungkin ditransmisikan dan dapat diputar melalui internet.

(dikutip dari riccoroviandy.blogspot.com/2013/01/pengertian-video-streaming.html))

1.2 Pengenalan XAMPP 

    XAMPP  adalah perangkat lunak bebas, yang mendukung banyak sistem operasi, merupakan kompilasi dari beberapa program.Fungsinya adalah sebagai server yang berdiri sendiri (localhost), yang terdiri atas program Apache HTTP Server, MySQL database, dan penerjemah bahasa yang ditulis dengan bahasa pemrograman PHP dan Perl. Nama XAMPP merupakan singkatan dari X (empat sistem operasi apapun), Apache, MySQL, PHP dan Perl. Program ini tersedia dalam GNU General Public License dan bebas, merupakan web server yang mudah digunakan yang dapat melayani tampilan halaman web yang dinamis. Untuk mendapatkanya dapat mendownload langsung dari web resminya.Software yang merupakan software web server apache yang di dalamnya sudah terdapat database seperti mysql, php dan masih banyak lagi. Kelebihan software web server XAMPP ini di banding dengan software web server lain adalah dalam satu kali install software ini telah sekaligus terinstall Apache Web Server, MySQL Database Server, PHP Support.

Apache
Software ini bisa kita dapatkan secara gratis, dan bersifat open source. Atau dalam artian 

kita dapat menggunakan dan mengubah script secara gratis. Fungsi dari Apache adalah menampilkan halaman web sesuai dengan script php yang telah di buat sebelumnya.

PHP
Merupakan bahasa pemograman yang sering di gunakan untuk web server. PHP memungkinkan pengguna atau user untuk membuat web dinamis (dapat di ubah). PHP dapat berkerja di berbagai macam Operating System seperti, windows, linux, mac os, dan lainnya. Sama halnya dengan Apache, software ini juga bisa di dapatkan secara gratis.

MySQL
SQL atau Structured Query Language merupakan software yang khusus di gunakan untuk mengolah database. Hal ini memungkinkan SQL untuk dapat menambah, mengubah, menghapus data yang terdapat dalam database. SQL merupakan software yang bersifat rational atau dalam artian program ini menggunakan tabel data untuk memisahkan beberapa data yang memungkinkan untuk menghindari duplicate data.

PHPmyAdmin
Dengan fitur PHPmyAdmin ini, kita akan dapat dengan mudah membuat baris data ataupun database tanpa harus mengingat perintah-perintahnya. 

(dikutip dari http://id.wikipedia.org/wiki/XAMPP)
(dikutip dari http://grajaganseo.blogspot.com/2013/12/pengertian-xampp-dan-manfaatnya.html)

2. Langkah-Langkah Kerja
 Langkah awal yang kita lakukan dalam mengkonfigurasi video streaming berbasis web dengan xampp yaitu memastikan pada komputer yang digunakan telah terinstall aplikasi XAMPP. jika ternyata pc yang kita gunakan belum terinstal aplikasi xampp,maka kita dapat melakukan pengistalan seperti gambar berikut ini : 

 

                                          

 

Selanjutnya melalui menu Start buka aplikasi XAMPP Control Panel yang telah selesai diinstall, sehingga akan muncul tampilan seperti gambar di bawah ini :

 

                                          

 

Pada konfigurasi kali ini kita akan menggunakan Apache untuk web server, maka pada baris Apache klik Start, lalu tunggu sampai apache ready yang ditandakan dengan berubahnya warna pada modul apache menjadi hijau. Seperti yang terlihat pada gambar di bawah ini :

Pada gambar diatas terlihat nomor PID dan Port yang masing-masingnya 2 buah, yaitu nomor standart dan nomor secure nya. Seperti port 80 merupakan port yang standart digunakan dan port 443 adalah port secure yang pada port ini terdapat berbagai macam keamanan pada portnya.

Untuk memastikan Apache telah kita install sudah dapat digunakan, dapat dilihat dari web browser dengan memasukkan "localhost" pada alamat pencarian. Jika Apache telah berjalan maka akan muncul tampilan seperti gambar di bawah ini :

Selanjutnya membuat Folder dimana video yang akan kita stream di letakkan, yaitu didalam folder htdocs dimana XAMPP terinstall, pada kesempatan kali ini penulis membuat folder dengan nama " share ".

Isi folder tersebut dapat kita lihat melalui web browser dengan mengetikkan ( ip komputer/ nama folder ) " 172.16.30.8/share " pada alamat pencarian. Maka akan muncul tampilan sebagai berikut :

Untuk tampilan web video yang kita stream dapat diubah dengan coding-coding html. Pada kesempatan kali ini penulis menggunakan tampilan standart dengan format coding HTML nya seperti yang terlihat pada gambar di bawah ini :

file html nya di simpan dalam folder yang sama dengan menyimpan video, saya gunakan nama tes untuk file tersebut. Jadi untuk membuka halaman tersebut dari web browser, dapat diketikkan pada alamat web dengan format " alamat ip/nama folder/nama file.html ".

        >> 172.16.30.8/share/tes.html
atau
        >> localhost/share/tes.html
Sehingga akan muncul tampilan web sebagai berikut :

Kita juga bisa membuka video yang di stream oleh teman dengan mengetikkan pada alamat web browser dengan format seperti diatas. sesuaikan ip/nama folder/dan nama file.html yang digunakan oleh teman kita. Seperti yang terlihat pada gambar di bawah ini :

Selanjutnya dengan melakukan beberapa perubahan pada coding html, kita dapat membuat tampilan web dengan bentuk list video, dimana apabila kita memilih salah satu video, maka akan ada hyperlink yang menghubungkan kita dengan alamat dimana video tersebut tersimpan. berikut tampilan format html dan tampilan halam web nya.

Berikut ini tampilan 1 video yang dibuka pada new tab dan 1 nya lagi di buka dalam new window, dapat dijalankan seperti yang terlihat pada gambar di bawah ini :