No audio from Media plugin using Phonegap Build on Android
I am trying to build an app that includes reliable audio playback across our target platforms, and have been directed to use the Media plugin for this task. I was previously using the Javascript Audio native object, which seemed to work well on some Android devices, but did not work at all on others. I have implemented the Media plugin into my project but so far have yet to have it successfully play back any audio on any of my test devices and am trying to identify what I am doing wrong.
My app should hopefully also work on a desktop browser, so I have a 'phonegap sniffer' in my javascript. From there, we either launch the app on deviceready events on mobile devices or document.ready on desktop devices, which seems to be working well.
var is_phonegap = navigator.userAgent.match( /(iPhone|iPod|iPad|Android|BlackBerry|IEMobile)/ ); // USE USERAGENT DATA TO GUESS AT WHETHER THIS IS A PHONEGAP APP OR A DESKTOP BROWSER
// SET UP CALLERS TO THE DEVICE_READY FUNCTION: ADD EVENT LISTENER FOR PHONEGAP AND ADD DOCUMENT.READY FOR DESKTOP
if ( is_phonegap) document.addEventListener( 'deviceready', device_ready, false );
else $( document ).ready( device_ready );
function device_ready() {
console.log( 'is phonegap? ' + ( is_phonegap )? 'true' : 'false' );
...
}
All audio within the app is being called by a play_sound function:
function play_sound( audio_file ){
var path = 'audio/' + audio_file;
if( is_phonegap ) var audio = new Media( path, null, media_error ); // IF THIS IS AN APP, USE THE MEDIA OBJECT PROVIDED BY THE PHONEGAP PLUGIN
else var audio = new Audio( 'audio/' + audio_file ); // IF THIS IS ON THE DESKTOP, USE THE AUDIO OBJECT PROVIDED BY CORE JAVASCRIPT
console.log( 'audio: ' + JSON.stringify( audio ) ); // INSPECT THE AUDIO OBJECT TO SEE WHAT IT LOOKS LIKE
audio.play(); // PLAY THE SOUND
}
Since the Media constructor allows for an onError callback, I have set that up as well:
function media_error( e ){
console.log( 'media error: ' + JSON.stringify( e ) );// INSPECT THE ERROR TO SEE WHAT IT LOOKS LIKE
}
I am testing by running Phonegap Dev on an android device hooked up to Phonegap Desktop so I can make use of the console.log debugging messages. When I run the app and attempt to play a sound I get the following output:
is phonegap? true
attempting to play audio file: audio/shuffle.mp3 // THIS FILE IS LOCATED IN THE PROJECT AT /WWW/AUDIO/SHUFFLE.MP3
media error: {"code":1} // THIS IS THE OUTPUT OF THE MEDIA ERROR HANDLER
I have ready several discussions about extra pathing requirements needed by the Media plugin on Android, and believe I have implemented the recommended solution (per Audio Not Working for Android Build), but this does not seem to help things. I modified the above to:
function play_sound( audio_file ){
var path = platform_specific_audio_path( 'audio/' + audio_file ); // RUN PATH THROUGH PLATFORM FUNCTION
if( is_phonegap ) var audio = new Media( path, null, media_error );
else var audio = new Audio( 'audio/' + audio_file );
console.log( 'audio: ' + JSON.stringify( audio ) );
audio.play();
}
function platform_specific_audio_path( file ){
if( typeof device == 'undefined' ) return file;
return ( device.platform.toLowerCase() == "android" ) ?"/android_asset/www/" + file : file;
}
Running this version of the code outputs the following:
attempting to play audio file: /android_asset/www/audio/shuffle.mp3
media error: {"code":1}
It appears that I am getting the same error result from either of these paths. I assume this is a pathing issue but have yet to confirm this in any way. I am just not familiar with how file paths are being built within the app. Is there a solution for this or can anyone identify what I am doing wrong? Thanks very much for any assistance.
Apr 9, 2016 9:26 PM
