I try to play an mp3 file. This works if I change the path to the file on my local webserver, but if I run this on an Android device the sound is not played and no error is
Did you try removing the /android_asset/www/
part in your code? Your app acts like a website and it thinks its root is the www folder itself.
Edit: I'll edit comment. Code not showing somehow.
The play method which the HTML5 API provides is useful for playing media files available on the web. Phonegap provides the media plugin to play local media files. I checked out your code and played the sound successfully by making the following changes. Please check at your end.
1.Add the following line to config.xml
<gap:plugin name="org.apache.cordova.media" />
2.Replace the lines in index.html
<button onclick="document.getElementById('successSound').play()">Play successSound local</button>
<button onclick="document.getElementById('errorSound').play()">Play errorSound local</button>
with these lines
<button onclick="playAudio('successSound')">Play successSound local</button>
<button onclick="playAudio('errorSound')">Play errorSoundlocal</button>
3.Add the following function to js/index.js
function playAudio(id) {
var audioElement = document.getElementById(id);
var url = audioElement.getAttribute('src');
var my_media = new Media(url,
// success callback
function () { console.log("playAudio():Audio Success"); },
// error callback
function (err) { console.log("playAudio():Audio Error: " + err); }
);
// Play audio
my_media.play();
}
Use this code
<body>
<audio id="successSound" src="file:///android_asset/www/sound/successSound.mp3" type="audio/mpeg" ></audio>
<audio id="errorSound" src="file///android_asset/www/sound/errorSound.mp3" type="audio/mpeg" ></audio>
<!-- some more UI -->
</body>
If you are using local files, try to reference them with src="file:///yourpath/sayHello.mp3"
I had the same problem and finally got it working, with me the problem lied with the scope of my media variable. I got it working as follows:
(function () {
"use strict";
var media;
document.addEventListener('deviceready', onDeviceReady.bind(this), false);
function onDeviceReady() {
media = new Media("/android_asset/www/sounds/wat is je wens.mp3", null, function (e) {
alert('Media Error');
alert(JSON.stringify(e));
});
alert('deviceready')
};
function onStart() {
media.play();
alert('yay')
}
};
Essentially I made sure that the scope of my media variable was sort of global by declaring it outside of onDeviceReady, but that Media wasn't called before the deviceready event.
`` // Audio player
//
var my_media = null;
var mediaTimer = null;
// Play audio
//
function playAudio(src) {
// Create Media object from src
my_media = new Media(src, onSuccess, onError);
// Play audio
my_media.play();
// Update my_media position every second
if (mediaTimer == null) {
mediaTimer = setInterval(function() {
// get my_media position
my_media.getCurrentPosition(
// success callback
function(position) {
if (position > -1) {
setAudioPosition((position) + " sec");
}
},
// error callback
function(e) {
console.log("Error getting pos=" + e);
setAudioPosition("Error: " + e);
}
);
}, 1000);
}
}
// onSuccess Callback
//
function onSuccess() {
console.log("playAudio():Audio Success");
}
function stopAudio() {
if (my_media) {
my_media.stop();
}
clearInterval(mediaTimer);
mediaTimer = null;
}
// onError Callback
//
function onError(error) {
}
// Set audio position
//
function setAudioPosition(position) {
document.getElementById('audio_position').innerHTML = position;
}