Home / Android / Menjalankan Streaming Video/Audio Pada Cordova Untuk Android/iOS

Menjalankan Streaming Video/Audio Pada Cordova Untuk Android/iOS

Implementasi cordova pada pengembangan mobile memudahkan karena menggunakan HTML dan javascript sebagai dasarnya. Untuk menjalankan video/audio secara remote url atau streaming pada web, kita bisa mensiasati menggunakan fitur HTML5 tag video atau pluging javascript untuk video. Namun, bagi yang memerhatikan hasilnya tidak se-smooth jika dijalankan secara native.

Nah, bagi yang ingin mengimplementasikan video/audio streaming rasa native, dengan cordova bisa menggunakan plugin yang sudah tersedia. Cara instalasi dan implementasinya pun cukup mudah.

Nama pluginnya adalah Cordova Streaming Media, yang bisa diimplementasikan di iOS dan Android. Pluin ini dikembangkan oleh Nicholas Hutchind.

Untuk versi terbaru (1.1.0) minimal requirement menggunakan cordova >=4.0

Instalasi

cukup dengan menjalankan perintah ini pada direktori project cordova :

cordova plugin add cordova-plugin-streaming-media

Nah, selanjutnya untuk menjalankan video url, bisa menggunakan cara sederhana :

var videoUrl = STREAMING_VIDEO_URL;

  // Just play a video
window.plugins.streamingMedia.playVideo(videoUrl);

Jika anda hanya ingin mendengarkan audio :

var audioUrl = STREAMING_AUDIO_URL;

// Play an audio file (not recommended, since the screen will be plain black)
window.plugins.streamingMedia.playAudio(audioUrl);

Yup, dengan cara diatas, anda sudah menjalankan video/audio secara streaming.

Selain cara diatas, kita pun bisa menambahkan beberapa options/setting pada video/audio yang dijalankan. Seperi background color,background image, menentukan full screen atau tidak, scaling.

// Play an audio file with options (all options optional)
  var options = {
    bgColor: "#FFFFFF",
    bgImage: "<SWEET_BACKGROUND_IMAGE>",
    bgImageScale: "fit", // other valid values: "stretch"
    initFullscreen: false, // true(default)/false iOS only
    successCallback: function() {
      console.log("Player closed without error.");
    },
    errorCallback: function(errMsg) {
      console.log("Error! " + errMsg);
    }
  };
  window.plugins.streamingMedia.playAudio(audioUrl, options);

Beberapa fitur lain :

// Stop current audio
  window.plugins.streamingMedia.stopAudio();

  // Pause current audio (iOS only)
  window.plugins.streamingMedia.pauseAudio();

  // Resume current audio (iOS only)
  window.plugins.streamingMedia.resumeAudio();  

Untuk cari tahu lebih jauh bisa ke http://www.plugreg.com/plugin/nchutchind/Streaming-Media-Cordova-Plugin atau https://github.com/nchutchind/cordova-plugin-streaming-media

About alfach

Check Also

android

Implementasi Expandable Listview Pada Android

Adakalanya dalam aplikasi yang ingin kita kembangkan ingin mengimplementasikan kombinasi scrollview dan listview, karena biasanya ...

2 comments

  1. apakah ada contoh codingnya??
    soalnya udah dicoba, install plugin. Lalu copy var videourl……..
    tapi tidak ngeload apa-apa.

    Bolehkah ditunjukkan satu contoh codingan langsung??

    • Untuk contoh codingan sebenarnya sudah ada diatas. Setelah tambah plugin, maka di dalam javascript cukup seperti ini misalnya :

      var videoUrl = “http://alfach.com/video/video.mp4″;

      window.plugins.streamingMedia.playVideo(videoUrl);

      selain itu tidak ditambahkan apa-apa. Apa sudah dipastikan plugin streaming medianya sudah terinstall?dengan menjalankan :

      cordova plugin list

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>