从数据库连续流式传输随机音频 [英] Continuously streaming random audio from database

问题描述

我正在计划一个非常简单的音频流媒体程序的项目，该程序将获取本地服务器上托管的mysql数据库歌曲列表，然后全天不断从列表中随机播放歌曲.这将附加到一个非常简单的前端页面，该页面将显示当前正在播放的歌曲的名称.

I'm planning out a project for a very simple audio streamer that would take a mysql database list of songs hosted on my local server, and then randomly stream a song from the list constantly throughout the day. This would be attached to a very simple frontend page that would display the name of the currently playing song.

我知道如何从数据库中获取随机文件并使用Javascript/HTML前端对其进行流传输，但是我迷失在如何检测歌曲结束时如何加载-然后加载下一首歌曲的迷上了.有没有简单的方法可以做到这一点?有人可以指出我正确的方向吗?

I know how to get a random file from the database and stream it using a Javascript/HTML front end, but I'm getting lost on how to detect when a song is over - and then load the next song. Is there a simple way to do this? Can someone point me in the right direction?

要详细说明前端，我很可能会通过PHP将文件名/位置提供给HTML5音频标签(同样，我希望此操作尽可能简单).我在想最简单的方法是播放音频文件，然后刷新页面并使用相同的音频标签和新文件名播放下一个文件-我只是不知道如何导致该事件在这首歌.另外，如果需要，我可以使用基于Javascript的播放器，例如JPlayer(http://www.jplayer.org/).

To elaborate on the frontend, I'd most likely be serving up the filename/location via PHP into the HTML5 audio tag (again I want this as simple as possible). I'm thinking the simplest way would be to play the audio file and then refresh the page and play the next file using the same audio tag and new filename - I just don't know how to cause that event to happen at the end of the song. Alternatively I could use a Javascript based player like JPlayer (http://www.jplayer.org/) if I need to.

我猜想我可以将某种回调函数与JQuery结合使用吗?

I'm guessing there's a callback function of some kind I can use in conjunction with JQuery?

推荐答案

HTML5音频标签具有事件"onended"，该事件在媒体播放结束时运行，但是由于您希望继续播放，因此应使用"onwaiting"事件，当媒体到达末尾时也会触发该事件，但会随时准备接受新的曲目/数据.

HTML5 audio tag has an event "onended" which is run when the media reaches its end, but since you wish to keep playing you should use the "onwaiting" event, which also fires when the media reaches its end, but keeps itself ready to accept a new track/data.

然后，您可以使用XMLHttpRequest对象查询要播放的下一首曲目，例如.

You can then use the XMLHttpRequest object to query for the next track to play, eg.

<script type="text/javascript">
  function getNextTrack(e) {
    var xhttp = new XMLHttpRequest();
    xhttp.open("GET", "next_track.php", false);
    xhttp.send("");

    var playback = xhttp.responseXML.childNodes[0];
    for(i = 0; i < playback.childNodes.length; ++i) {
      if (playback.childNodes[i].nodeName != 'track') continue;
      var value = playback.childNodes[i].childNodes[0].nodeValue;
      e.currentTarget.src = value;
      break;
    }
  }
</script>
<audio id="player" onwaiting="javascript: getNextTrack(e)" src="first_track.ogg"></audio>

xml的格式为:

<?xml version="1.0" encoding="UTF-8" ?> 
<playback> 
    <track>next_song.ogg</track>
</playback>

这篇关于从数据库连续流式传输随机音频的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！