PHP を介して XML ファイルから解析された、現在再生中の曲を表示するクライアントの Web サイトに領域を構築しました。ただし、私のクライアントは、ページを手動で更新するのではなく、曲自体を自動更新することを望んでいます。
jQuery.get() と .ajax() を使用してファイルを解析してみましたが、XML ファイルの構造が原因で、アーティストと名前を 1 つの文字列にまとめて取得することしかできないようです。具体的にしようとすると、[object Object] のみが返されます。
曲の長さを計算して、その長さに基づいてフィードを更新することにも取り組んでいません。これは明らかに私にとってそのような問題であるため、表示されない場合があります。
ヘルプまたは一般的なガイダンスをいただければ幸いです。
動作する PHP コードの例 (明らかに非 AJAX):
<?php
$recentlyPlayed = simplexml_load_file('http://publicapi.streamtheworld.com/public/nowplaying?mountName=ABCDFM&numberToFetch=1&eventType=track');
$trackTitle = $recentlyPlayed->{'nowplaying-info'}[0]->property[1];
$trackArtist = $recentlyPlayed->{'nowplaying-info'}[0]->property[0];
echo "<h6>" . $trackArtist . "<span class=\"song-title\">" . $trackTitle . "</span></h6>";
?>
これを機能させるためにいくつかの異なることを試みましたが、最初の障害は、ノード名ではなく属性を使用して XML ファイル内のデータを参照しようとしているようです。ノードはすべて同じ名前が付けられており、それらを区別するのは属性です。したがって、アーティスト/曲のタイトルが空白でない限り、このコードは正しくレンダリングされ、暗号化された名前の「cue_time_start」のような 3 番目のフィールドがレンダリングされます。
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" ></script>
<script type="text/javascript">
$(document).ready(function() {
setInterval("songPull()",1000);
});
function songPull() {
$.get(
"http://publicapi.streamtheworld.com/public/nowplaying?mountName=ABCDFM&numberToFetch=1&eventType=track",
"xml",
function(data) {
$(data).find("nowplaying-info").each(function(){
var artist = $(this).find("property").eq(0).text();
var title = $(this).find("property").eq(1).text();
$('body').html("<h1>" + artist + "<small class=\"song-title\">" + title + "</small></h1>");
console.log (artist);
console.log (title);
});
}
);
}
</script>
<body>
</body>
この種のことをしようとするときのガイダンス、アドバイス、またはベストプラクティスの例は、非常に高く評価されます。