Javascript 每隔几秒钟从HTTP源获取并更新文本到HTTPS网站

因此，我有一个广播电台，我的主机提供商没有SSL证书，我有一个带有SSL证书的网站，我想在其中显示当前正在广播电台播放的曲目名称（再次提及，只有曲目名称，而不是艺术家）。可在此处找到曲目名称：

http://91.121.139.194:8157/currentsong?sid=1

上面链接的输出显示：X-X-Y

X-艺术家， Y轨道名称。 我不希望显示第一个X，因此它不会显示两次艺术家（一次来自艺术家元数据，另一次来自曲目名称元数据）

问题是我无法从HTTP获取文本到HTTPS。 我尝试了Ajax和Javascript。他们每个人都被封锁了

我知道显示来自不安全HTTP的数据会对我拥有的HTTPS造成风险，这就是为什么我会在用户单击播放之前隐藏曲目名称。播放音频也会带来风险，因为它是从HTTP发送的

我的主机提供程序也提供了一个API，但它附带的javascript也从HTTP请求数据，被阻止

有什么解决办法吗？我认为使用Ajax和Javascript是没有意义的，因为这两种方法都不起作用。我也听说过使用curl或file_get_内容，但我真的不想像前两种方法那样花更多的时间，我只是想发现它不起作用。我需要一个做什么的建议

另外，如果有更好的方法从ShoutCast服务器获取曲目名称，我也同意

另一方面，我真的不知道为什么我的主机提供商不使用OpenSSL。。。它是免费的

---

编辑：我想的另一个想法是从实际的.mp3流媒体源获取曲目标题元数据。但它来自一个不安全的HTTP，我也不确定它是否能工作。

找到了解决方法。 这对大多数拥有广播电台的人来说都是有帮助的

我在网上电台注册了我的电台。我不是要你在那里注册你的电台。您可能希望对任何您想要的网站执行此操作，但请确保它们通过HTTPS显示每个数据，以使其正常工作

最有可能的是，他们有一个代理从不安全的HTTP到HTTPS获取数据，并且他们的整个网站都是安全的。添加电台后，请在顶部搜索栏中搜索，并确保仅显示搜索中的电台。这有助于

文件获取内容
获取更少的HTML，从而更快地加载。获取仅显示您的电台的最小关键字数，如我所做的：

检查元素并找到带有轨迹名称的标记。右键单击它，然后在Chrome上复制->复制XPath，在其他浏览器上不确定。实际上，我花了一些时间才发现我可以从右键单击->检查复制XPath

<?php
libxml_use_internal_errors(false);
$html = file_get_contents('https://www.internet-radio.com/search/?radio=Riddim+Dubstep+-+Keep');
$doc = new DOMDocument;
$doc->loadHTML($html);
$xpath = new DOMXpath($doc);
$node = $xpath->query('/html/body/div[1]/div[1]/div[1]/table/tbody/tr/td[3]/b')->item(0);
echo $node->textContent;
?>

DIV
TrackTitle
将放置在您希望显示当前歌曲的位置。您可能需要在其中添加一些CSS，以将文本格式化为更适合的页面

注意：别忘了从谷歌的API下载最新的
jquery.min.js
，并更新链接。我在我的网络主机上下载了它，以便更快地加载，但您可以使用到它的直接链接，而不会出现任何问题。
如果您的网络主机提供商打开了您用于Shoutcast站点的端口，请按照我下面的说明操作。如果没有，请检查下面的其他答案

方法1

在
index.php
附近创建一个名为
trackid.php
的文件，并放置以下代码：

<?php
$server = "http://91.121.139.194:8157/stats?sid=1";
$srv_url = urlencode($server);
$sc_stats = simplexml_load_file($srv_url);
echo $sc_stats->SONGTITLE
?>

这种方法的缺点是，它会在服务器上为每个用户创建一个后台进程，因为javascript会为每个用户请求PHP文件的输出

方法2

您还可以设置
trackid.php
每隔6秒将输出（曲目名称）保存在FTP上的文本文件中：

<?php
$server = "http://91.121.139.194:8157/stats?sid=1";
$LoopMaximum = 10;
$LoopInitial = 0;
Loop: {
    if ($GLOBALS["LoopInitial"] < $GLOBALS["LoopMaximum"]) {
        $srv_url = urlencode($GLOBALS["server"]);
        $sc_stats = simplexml_load_file($srv_url);
        $node = $sc_stats->SONGTITLE;
        $location = fopen("playing.txt","w+");
        fwrite ($location, $node);
        fclose($location);
        $GLOBALS["LoopInitial"]++;
        sleep(6);
        goto LoopFollow;} else if ($GLOBALS["LoopInitial"] == $GLOBALS["LoopMaximum"]){
        exit();}
}
LoopFollow: {
    if ($GLOBALS["LoopInitial"] < $GLOBALS["LoopMaximum"]) {
        $srv_url = urlencode($GLOBALS["server"]);
        $sc_stats = simplexml_load_file($srv_url);
        $node = $sc_stats->SONGTITLE;
        $location = fopen("playing.txt","w+");
        fwrite ($location, $node);
        fclose($location);
        $GLOBALS["LoopInitial"]++;
        sleep(6);
        goto Loop;} else if ($GLOBALS["LoopInitial"] == $GLOBALS["LoopMaximum"]){
        exit();}
}
?>

注意：每个Web主机的PHP路径可能不同

现在，每隔5秒从文本文件中读取曲目：

<script type="text/javascript">
function trackid() {
var client = new XMLHttpRequest();
client.open('GET', '/playing.txt');
client.onreadystatechange = function() {
var trackName = client.responseText;
$(".TrackTitle").text(trackName);
}
client.send();
}
trackid()
</script>
setInterval(trackid, 5000);
<div class="TrackTitle">Loading...</div>


函数trackid（）{
var client=new XMLHttpRequest（）；
open（'GET'，'/playing.txt'）；
client.onreadystatechange=函数（）{
var trackName=client.responseText；
$（“.TrackTitle”）.text（trackName）；
}
client.send（）；
}
trackid（）
设置间隔（trackid，5000）；
加载。。。

这种方法没有缺点，但您需要访问CronJobs，并且至少允许5个后台进程。
曲目名称将作为DIV元素上的文本。您可以使用CSS对其进行格式化。
我认为您需要在服务器上创建一个代理端点，该端点将调用该http源，因为正如您所说的，如果您使用plain，我将被浏览器阻止JS@AlonEitan我希望有人会建议。。。。但这是我想我做不到的……好吧，看看其他用户是否有更好的建议/替代方案会很有趣，因为这是我能想到的唯一解决方案of@AlonEitan找到了一个解决办法。@SumutiuMarius谢谢你让我保持联系。所以我看到您毕竟创建了一个代理：）
<?php
$server = "http://91.121.139.194:8157/stats?sid=1";
$LoopMaximum = 10;
$LoopInitial = 0;
Loop: {
    if ($GLOBALS["LoopInitial"] < $GLOBALS["LoopMaximum"]) {
        $srv_url = urlencode($GLOBALS["server"]);
        $sc_stats = simplexml_load_file($srv_url);
        $node = $sc_stats->SONGTITLE;
        $location = fopen("playing.txt","w+");
        fwrite ($location, $node);
        fclose($location);
        $GLOBALS["LoopInitial"]++;
        sleep(6);
        goto LoopFollow;} else if ($GLOBALS["LoopInitial"] == $GLOBALS["LoopMaximum"]){
        exit();}
}
LoopFollow: {
    if ($GLOBALS["LoopInitial"] < $GLOBALS["LoopMaximum"]) {
        $srv_url = urlencode($GLOBALS["server"]);
        $sc_stats = simplexml_load_file($srv_url);
        $node = $sc_stats->SONGTITLE;
        $location = fopen("playing.txt","w+");
        fwrite ($location, $node);
        fclose($location);
        $GLOBALS["LoopInitial"]++;
        sleep(6);
        goto Loop;} else if ($GLOBALS["LoopInitial"] == $GLOBALS["LoopMaximum"]){
        exit();}
}
?>

php /home/user/public_html/trackid.php >/dev/null 2>&1

<script type="text/javascript">
function trackid() {
var client = new XMLHttpRequest();
client.open('GET', '/playing.txt');
client.onreadystatechange = function() {
var trackName = client.responseText;
$(".TrackTitle").text(trackName);
}
client.send();
}
trackid()
</script>
setInterval(trackid, 5000);
<div class="TrackTitle">Loading...</div>