Currently I am working on a html5/js music player application. I have many users on mobile devices that have problems with playing the music. According to many websites you need to have user interaction before you can play audio.
Currently this is how I have programmed my music player. I have used the onclick attribute to detect taps/clicks on a play button.
<button onclick = "playaudio('song name');">Play</button>
Then I have code for js to resolve a play url.
var http = new XMLHttpRequest();
var url = '/getsong';
var params = 'name='+songname;
http.open('POST', url, true);
http.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
http.onreadystatechange = function() {
if(http.readyState == 4 && http.status == 200) {
var snd=document.getElementsByTagName("audio")[0];
snd.src = http.responseText;
snd.load();
snd.play();
}
}
http.send(params);
This works fine on a computer but on mobile users have to click the pause/play button to start the music. Is there any workaround for the user interaction requirement, because I want to implement a remote play system like Google Cast/Spotify Connect.
Currently I don't have access to the complete code so this is just the core part of the music player.
Also I need to make a playlist feature but due to this, it seems quite impossible to play the next track in the playlist without user interaction.
