ONLINE ON DEMAND DAN LIVE STREAMING RADIO DENGAN REAL TIME STREAMING PROTOCOL oleh Cerian Yuwono NIM : 612007005 Skripsi Untuk melengkapi salah satu syarat memperoleh Gelar Sarjana Teknik Program Studi Teknik Komputer Fakultas Teknik Elektronika dan Komputer Universitas Kristen Satya Wacana Salatiga Juli 2013 i i INTISARI On demand streaming radio merupakan salah satu upaya untuk menghasilkan kemudahan dalam penyebaran radio, serta dapat menanggulangi masalah pembajakan. Aplikasi ini dibangun berbasis website HTLM5 dan PHP yang dilengkapi dengan pemutar audio dengan format mp3, dan menggunakan bahasa pemprograman Java dengan Java media Framework. Dalam aplikasi On demand radio streaming terdapat dua kualitas codec audio yang biasa digunakan dalam standart telekomunikasi, yaitu GSM dan G711. Aplikasi website dilengkapi dengan fitur pemutaran data audio, berformat mp3 dengan dua kualitas yang berbeda, yaitu kualitas high dengan fitur stereo, dan low dengan fitur mono. Juga dilengkapi aplikasi on demand streaming radio dengan dua buah server yang berbeda. Server 1 menggunakan codec GSM dan server 2 menggunakan codec G.711. Pengujian telah dilakukan dan diuji oleh 16 client sekaligus yang terhubung dengan jaringan lokal, dari hasil pengujian didapat persentase keberhasilan sebesar 100%, dimana aplikasi dapat diakses oleh platform windows XP, windows 7 dan windows 8, dengan berbagai macam web browser yang telah di-dukung java applet plugin. Dari hasil pengujian juga didapatkan delay di-bawah 1 menit, sehingga user dapat menikmati radio secara real-time. i ABSTRACT On demand streaming radio is an efford to ease the radio deployment, as well as to reduce the piracy problem. This application was built in web form based with HTML5 and PHP that is equipped with mp3 audio player, and using Java programming language with Java Media Framework. In the streaming radio application, there are two quality of audio codec that commonly used in the telecommunication standarts, namely GSM and G711 audio codec. Website application is equipped with a mp3 data playback audio feature, with two different quality, which are High quality with stereo, and Low quality with mono. This application also included on demand streaming radio with two different servers. Server 1 using the GSM codec, and server 2 using G711 codec. Test has been done and tested by 16 clients at the same time, as long as they are connected to the local network, from the test resulted that the application has 100% success rate, where the application can be accessed by windows XP, windows 7 and windows 8 platform, with all website browser that has been supported with java applet. From the test results are obtained that this application have less than 1 minute delay, so users can enjoy this live and on demand radio in real-time. ii KATA PENGANTAR Puji syukur saya panjatkan kepada Tuhan Yesus Kristus karena berkat dan rahmat – Nya selama ini, sehingga saya mampu menyelesaikan skripsi sebagai tugas akhir perkuliahan ini. Tidak lupa pula saya ucapkan terima kasih kepada bapak Hartanto W, M.T selaku pembimbing pertama dan bapak Saptadi Nugroho, M.Sc selaku pembimbing kedua yang telah menyediakan waktu dan membantu saya dalam mengerjakan skripsi hingga selesai. Terselesaikannya skripsi ini juga tak lepas dari dukungan baik dalam dukungan doa maupun dukungan keuangan dan kasih sayang dari keluarga saya, saya ucapkan terimakasih kepada kedua orang tua saya papa Yuwono Suroso dan mama Ratna Indrawati yang telah mendukung dan membiayai kuliah selama ini. Dan juga tak lupa pula saya ucapkan terima kasih kepada keluarga kakak saya Arief Yuwono M.Kom dan Bevilia Indrati Yuwono M.Arch yang telah membantu dan memberi semangat untuk menyelesaikan skripsi ini. Selain itu, saya ucapkan terima kasih kepada Maharani Widjojo atas bantuan semangat, kasih sayang, serta dukungan yang dia berikan selama ini yang menjadi motivasi saya dalam menyelesaikan skripsi. Terima kasih pula atas dukungan dan semangat dari teman-teman Fakultas Teknik Elektro dan Elektronika, teman – teman kos Diponegoro 73, dan teman – teman lain yang tidak saya sebutkan satu per satu, atas inspirasi untuk terus belajar, berjuang dan berusaha. Apresiasi juga saya berikan kepada seluruh dosen dan para laboran (FTEK) Fakultas Teknik Elektronika dan Komputer yang telah membantu, mengajar, dan iii membimbing selama perkuliahan dan telah memberikan ilmu yang bermanfaat sebagai dasar pembuatan skripsi ini. Sebagai penutup, saya selaku sebagai penulis berharap tugas akhir ini dapat memberi manfaat dan menambah pengetahuan bagi para pembaca. Karena kekurangan dan keterbatasan yang saya miliki menjadikan skripsi ini jauh dari sempurna. Maka dari itu kritik dan saran yang membangun akan saya terima dengan berbesar hati. Salatiga, Juni 2013 Penulis Cerian Yuwono iv DAFTAR ISI HALAMAN INTISARI i ABSTRACT ii KATA PENGANTAR iii DAFTAR ISI v DAFTAR GAMBAR vii DAFTAR TABEL x DAFTAR KODE xi DAFTAR SINGKATAN xii BAB I PENDAHULUAN 1 1. 1. Tujuan 1 1. 2. Latar Belakang 1 1. 3. Gambaran Sistem 3 1. 4. Batasan Masalah 4 1. 5. Perincian Tugas 4 1. 6. Sistematika Penulisan 5 DASAR TEORI 6 2. 1. Streaming 6 BAB II 2. 1. 1. Arsitektur Streaming 7 2. 1. 2. Streaming dan Download 8 2. 1. 3. On demand streaming 8 2. 1. 4. Parameter dalam audio streaming 9 2. 1. 5. Delay 9 2. 1. 6. Jitter 10 2. 1. 7. Packet Loss 11 2. 2. Audio Encoding 11 2. 2. 1. Audio Capture 12 2. 2. 2. G.711 µlaw 13 2. 2. 3. GSM 13 2. 3. Internet dan Website 14 2. 3. 1. HTTP 15 2. 3. 2. HTML5 17 v 2. 3. 3. PHP 17 2. 3. 4. WAMP Server 18 2. 3. 5. MYSQL 18 2. 4. Protocol 19 2. 4. 1. TCP/IP 19 2. 4. 2. UDP 20 2. 4. 3. RealTime Transport Protocol (RTP) 21 2. 4. 4. RealTime Control Protocol (RTCP) 23 2. 4. 5. RealTime Streaming Protocol (RTSP) 23 2. 5. Java Media Framework 24 2. 6. Java Applet 27 2. 7. Wireshark 28 BAB III PERANCANGAN SISTEM 30 3. 1. Gambaran Sistem 30 3. 1. 1. Aplikasi Client Website Streaming 30 3. 1. 2. Aplikasi Administrator Komputer Server 32 3. 2. Desain Arsitektur Sistem 34 3. 3. Perancangan Database 35 3. 3. 1. Database Server 36 3. 4. Perancangan Aplikasi Website on demand Streaming Radio 3. 4. 1. Aplikasi Administrator Komputer Server 36 36 3. 4. 1. 1. Capturing Audio device 36 3. 4. 1. 2. Capturing Audio 37 3. 4. 1. 3. Encoding masukan Audio 38 3. 4. 1. 4. Transmisi data Audio 38 3. 4. 1. 5. Website 39 3. 4. 1. 6. Webserver 39 3. 4. 1. 7. Database Administrator 39 3. 4. 2. Aplikasi Website Streaming Radio 40 3. 4. 2. 1. User Interface 40 3. 4. 2. 2. HTML5 Player 43 3. 4. 2. 3. Applet Player 43 BAB IV PENGUJIAN DAN ANALISIS 45 vi 4. 1. Spesifikasi Alat 45 4. 2. Prosedur Pengujian 46 4. 2. 1. Prosedur Pengujian Kompatibilitas Aplikasi 47 4. 2. 2. Prosedur Pengujian berdasarkan skenario yang telah dibuat 49 4. 3. Hasil Pengujian BAB V 52 4. 3. 1. Hasil Pengujian Kompatibilitas 52 4. 3. 2. Hasil Pengujian berdasarkan skenario yang telah dibuat 55 KESIMPULAN DAN SARAN 68 5. 1. Kesimpulan 68 5. 2. Saran 68 DAFTAR PUSTAKA 69 vii DAFTAR GAMBAR HALAMAN Gambar 1.1. Arsitektur Sistem 3 Gambar 2.1. Arsitektur Streaming 7 Gambar 2.2. Perbedaan Download dan Streaming 8 Gambar 2.3. Delay yang terjadi dalam pengiriman data 10 Gambar 2.4. Proses terjadinya Jitter 11 Gambar 2.5. Proses Audio Encoding 12 Gambar 2.6. Proses Capture Audio 13 Gambar 2.7. Lapisan pada TCP/IP 19 Gambar 2.8. Arsitektur RTP 22 Gambar 2.9. Arsitektur JMF 24 Gambar 2.10. State Player 25 Gambar 2.11. RTP Transmitter dengan JMF 27 Gambar 2.12. Wireshark RTP Stream Analysis 29 Gambar 3.1. Use Case diagram Pengguna 30 Gambar 3.2. Diagram alir Client website streaming 32 Gambar 3.3. Use Case diagram Administrator 33 Gambar 3.4. Diagram Alir Aplikasi Administrator Komputer Server 34 Gambar 3.5. Arsitektur website streaming radio 35 Gambar 3.6. Diagram Alir Aplikasi Streaming Data Audio 42 Gambar 4.1. Player HTML5 pada web browser Google Chrome 53 Gambar 4.2. Player HTML5 pada web browser Mozila Firefox 54 Gambar 4.3. Player HTML5 pada web browser Internet Explorer 54 Gambar 4.4. Applet player on demand streaming radio 55 Gambar 4.5. Tampilan utama halaman Administrator 55 Gambar 4.6. Tampilan Form penambahan informasi data Audio kedalam Database 56 Gambar 4.7. Notifikasi penambahan data berhasil 56 Gambar 4.8. Tampilan Form pengubahan informasi data dalam Database 57 Gambar 4.9. Notifikasi pengubahan informasi data berhasil 57 Gambar 4.10. Notifikasi data berhasil dihapus dari Database 57 viii Gambar 4.11. Tampilan halaman Home pada Aplikasi Website On demand Streaming radio 58 Gambar 4.12. Halaman panduan ketika Pengguna menekan link “DOWNLOAD JRE PLUGIN” 59 Gambar 4.13. Tampilah Halaman “Music” 60 Gambar 4.14. Notifikasi Pemilihan Kualitas 60 Gambar 4.15. Hasil Capture Software Wireshark yang menangkap paket-paket RTP 61 Gambar 4.16. Hasil analisa RTP Streams Analysis yang ditangkap 61 Gambar 4.17. Hasil Analisa paket data RTP dari “Server1” 62 Gambar 4.18. Hasil Analisa paket data RTP dari “Server2” 63 Gambar 4.19. Tampilan Halaman “live stream” 64 Gambar 4.20. Permintaan pengaktifan Java Plugin pada web browser 64 Gambar 4.21. Pemutaran on demand Streaming Radio “Server1” 65 Gambar 4.22. Pemutaran on demand Streaming Radio “Server2 65 Gambar 4.23. Grafik Perbandingan Delay “Server1” dan “Server2” 66 ix DAFTAR TABEL HALAMAN Tabel 1.1. Perbandingan dengan yang sudah ada 2 Tabel 2.1. Perbandingan codec audio 14 Tabel 3.1. Atribute database 36 Tabel 4.1. Pengujian Kompatibilitas 49 Tabel 4.2. Identifikasi dan Pelaksanaan Pengujian Skenario 52 Tabel 4.3. Hasil Pengujian Kompatibilitas 53 Tabel 4.4. Hasil Pengujian Delay pada Aplikasi Website on demand Streaming Tabel 4.5. Radio 66 Hasil Pengujian Skenario 67 x DAFTAR KODE HALAMAN Kode 3.1. Daftar perangkat keras inputan 37 Kode 3.2. Media info sebagai data sumber 37 Kode 3.3. Lokasi media sebagai data sumber 38 Kode 3.4. Lokasi Output streaming radio server 1 38 Kode 3.5. Lokasi Output streaming radio server 2 38 Kode 3.6. Pengambilan dan Penampilan seluruh data dari Database 40 Kode 3.7. Penambahan data kedalam Database 40 Kode 3.8. Ubah data dari Database 40 Kode 3.9. Hapus data dari Database 40 Kode 3.10. Player Audio HTML5 43 Kode 3.11. Menggundang applet player 44 Kode 3.12. Pembuatan class StreamingApplet 44 xi DAFTAR SINGKATAN ARP Address Resolution Protocol CSS Cascading Style Sheet Codec Compression-Decompression DNS Domain Name Service FTP File Transfer Protocol HTML HyperText Markup Language HTTP HyperText Transfer Protocol ICMP Internet Control Message Protocol IGMP Internet Group Management Protocol IP Internet Protocol ITU International Telecommunication Union JMF Java Media Framework JVM Java Virtual Machine LAN Local Area Network PCM Pulse Code Modulation PHP PHP: Hypertext Preprocessor RAM Random Access Memory RPE-LTP RegularPulse Excitation LongTerm Predictor RTCP Real Time Control Protocol RTP RealTime Transport Protocol RTSP Real Time Streaming Protocol SGML Standard Generalized Markup Language SMPTP Simple Mail Transfer Protocol SQL Structure Query Language Telnet Telecommunication Network TCP/IP Transmission Control Protocol/Internet Protocol UDP User Datagram Protocol UI User Interface URL Uniform Resource Locator W3C World Wide Web Consortium WAMP Windows, Apache, MySQL, PHP WiFi Wireless Fidelity xii WHATWG Web Hypertext Application Technology Working Group WWW World Wide Web xiii