javascript - 每隔几秒从 HTTP 源获取和更新文本到 HTTPS 网站

Question

所以，我有一个广播电台，我的主机提供商没有 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_contents，但我真的不想花更多的时间，因为我尝试了前两种方法，只是发现它不起作用。我需要关于该怎么做的建议。

此外，如果有更好的方法从 ShoutCast 服务器获取轨道名称，我也同意。

附带说明一下，我真的不知道为什么我的主机提供商不使用 OpenSSL...它是免费的。

编辑:我想到的另一个想法是从实际的 .mp3 流媒体源中获取轨道标题元数据。但该来源来自不安全的 HTTP，同样，我不确定它是否有效。

Answer 1

为此找到了解决方法。 这可能对大多数拥有广播电台的人都有帮助。

我在 Internet-Radio 上注册了我的广播电台。我不会派你去那里注册你的 radio 台。您可能想对任何您想要的网站执行此操作，但要确保它们通过 HTTPS 显示所有数据才能正常工作。

很可能他们有一个代理来从不安全的 HTTP 到 HTTPS 获取数据，并且他们的整个网站都是安全的。添加您的广播电台后，在顶部搜索栏中搜索它，并确保您只显示搜索中的广播电台。这有助于 file_get_contents 获取更少的 HTML，从而加快加载速度。获取最少数量的关键字以仅显示您的广播电台，就像我所做的那样: https://www.internet-radio.com/search/?radio=Riddim+Dubstep+-+Keep

检查元素并找到带有轨道名称的标签。右键单击它并复制 -> 在 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;
?>

使用您刚刚复制的 XPath 修改 $xpath->query，并将 URL 修改为您从该页面获得 XPath 的 URL。

将此文件另存为

trackid.php

您将添加到主页的以下代码。

<script src="jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
function trackid() {
$.get('trackid.php', function(data) {
$(".TrackTitle").text(data);
}); 
}
trackid()
setInterval(trackid, 5000);
</script>
<div class="TrackTitle">Loading...</div>

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

注意:不要忘记从 Google 的 API 下载最新的 jquery.min.js 并更新指向它的链接。我在我的虚拟主机上下载了它以加快加载速度，但您可以毫无问题地使用指向它的直接链接。