如何在不使用流密碼的情況下使用php和ajax使用shoutcast中的元數據來使html保持最新狀態？

Question

首先讓我解釋一下我來自哪里。 我對javascript，html和css和客戶端方面有很好的了解。 服務器端代碼（例如php）和服務器客戶端代碼（例如ajax）不是我的強項。 從每一篇文章的大部分中，我都讀到了有關從流點提取元數據的信息。 http://www.smackfu.com/stuff/programming/shoutcast.html然后有人說，只需使用php和ajax！ 這不是非常有幫助或直接的，因為我只是兼而有之。 我還沒有真正了解任何有關標頭和使用get請求的知識，因此我對這種方法不知所措。

我還找到了一篇文章，查找了shoutcast類php，這是到目前為止我發現最有用的東西，這也是我現在正在使用的東西。 這個假設我知道我要查找的流的密碼（不理想），但是幸運的是我知道。 https://github.com/MaThGo/shoutcast-class/blob/master/shoutcast.class.php

我理解的這兩種都是不同的，第一個是用於獲取流中流過的元數據的偽代碼，第二個是從網絡服務器中提取具有相同元數據的xml。

我假設稍微改變一下類以從7.html提取相同的信息將是一個容易的開關，而不需要密碼。

我最初遇到的地方：在修改了上面的shoutcast類腳本之后，我最終在一個變量中獲得了歌曲和流標題。 我已經將它保存（並測試了它，所以我知道它確實使用echo可以輸出正確的信息）作為getInfo.php與我的index.html文件位於同一文件夾中。

<?php //shoutcast class script from above link followed by

$stream = shoutcast("ip","port","pass"); //constructing the class
$streamData = stream.getShoutcastData(); //getting array of shoutcast metadata
$streamTitle = streamData["SERVERTITLE"]; //gets the server's title
$streamSong = streamData["SONGTITLE"]; //gets the current song playing artist and track
$playerText = "You're listening to {$streamTitle} <br> Song: {$streamSong}"
echo $streamTitle;
?>

如果我有一個音頻元素和一個ID為“ info”的歌曲信息的div，如何運行此腳本，讓它每隔幾秒鍾僅修改該div的內容？ 顯然，我不想吃大量的帶寬來請求/或獲取與以前沒有不同的元數據。 這就是我所假設的php和ajax組合的用途。 弄清楚了，下面進一步看，這是一個可怕的示例腳本：

<!DOCTYPE HTML>
<html>
<head>
   <script>
       //perhaps something like this?
       function update()
       {
          document.getElementById("info").innerHTML= //not sure what do do here
       }
       //or a function which uses setTimeout()?
   </script>
</head>
<body onload="getThingsStarted()">

   <!--Where the magic should happen-->
   <div id="info">Somewhere in here</div>

   <div id="audio">
      <audio autoplay="true" controls="controls" src="http://ip:port/;">
   </div>

</body>
</html>

修復：我的原始代碼語法錯誤，因此我的ajax代碼中的XMLHttpRequest從未執行，因此沒有返回任何結果（數字）。 這就是它起作用的原因。

<!DOCTYPE HTML>
<html>
   <head>
   <script>
       //php ajax sample code w/ one slight modification from w3schools.com
       function loadXMLDoc()
       {
          var xmlhttp;
          if (window.XMLHttpRequest)
          {//IE7, Firefox, Chrome, Opera, Safari
             xmlhttp=new XMLHtppRequest();
          }
          else
          {//IE6, IE5 wow these are old
             xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
          }
          xmlhttp.onreadystatechange=function()
          {
             if(xmlhttp.readyState==4 && xmlhttp.status==200)
             {
                document.getElementById("info").innerHTML=xmlhttp.responseText;
             }
          }
          xmlhttp.open("GET","stream.php?q=1",true);
          xmlhttp.send();
       }
    </script>
    </head>
    <body>
       <div id="info">Stream info</div>
       <audio autoplay controls="controls" src="http://ip:port/;" ontimeupdate="loadXMLDoc()">
    </body>
</html>

第二個問題：我想知道是否有人可以指出一個很好的示例，該示例使用第一個鏈接中的方法提取元數據 ，或者對shoutcast類進行了修改，因此不需要密碼 ？ 非常感激。

由於來自服務器的元數據比數據流提前了幾秒鍾（合理地說，廣播使用了緩沖區，因此音頻位於網絡服務器不斷變化的元數據后面），我很好奇是否可以比較結果（也許檢查一下服務器和客戶端內容之間的時間延遲？）。 只是一些想法...

Answer 1

您正在運行什么版本的DNAS？ 在2.0+中，您應該能夠從http://ip:port/statistics提取所有公共流統計信息的XML輸出。 這是一個（希望）您嘗試使用JS完成的實時示例： http : //subfocus.fm 。

為了解決XMLHttpRequest中的跨域/端口限制（在這種情況下，通常為80 vs 8000），我有一個本地服務器腳本，每分鍾運行一次wget，以將ShoutCAST XML文件下載到Web服務器的根路徑（公開： http://ip/stats.xml ）。 在您的情況下，這可能不可行，但我想我會分享我的拼湊解決方案。

只要您的Web服務器上具有XML，就應該能夠對單個流站使用類似的東西：

<head>
<script>
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest()
} else {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP")
}
function scMetaData() {
xmlhttp.open("GET", "stats.xml", false);
xmlhttp.send();
xmlDoc = xmlhttp.responseXML;
document.getElementById("info").innerHTML = "<b>Now Playing:</b> " + xmlDoc.getElementsByTagName("STREAM")[0].getElementsByTagName("SONGTITLE")[0].childNodes[0].nodeValue
}
setInterval(scMetaData, 10000);
</script>
</head>

<body onload="scMetaData();">
<span id="info"></span>
</body>

創建XMLHttpRequest對象后，其余的信息將存儲在一個函數中，該函數將以setInterval(scMetaData, 10000);在指定的毫秒間隔內調用setInterval(scMetaData, 10000); 在腳本末尾，以及在加載<body onload="scMetaData();"> 。 我鏈接的實時示例添加了一個FOR循環來解析2個ShoutCAST流的XML軌道ID。

如何在不使用流密碼的情況下使用php和ajax使用shoutcast中的元數據來使html保持最新狀態？

問題描述

1 個解決方案

解決方案1
1 已采納 2013-12-02 21:19:34

如何在不使用流密碼的情況下使用php和ajax使用shoutcast中的元數據來使html保持最新狀態？

問題描述

1 個解決方案

解決方案1 1 已采納 2013-12-02 21:19:34

解決方案1
1 已采納 2013-12-02 21:19:34