1

我正在尝试创建一个 twitch.tv 流列表,该列表每 60 秒拉一次在线/离线状态,并根据该响应返回一个图像。我用来提取此信息并返回图像的 php 代码如下:

<?php
    header('content-type: image/png');

    $stream = $_GET['stream'];

    $json_file = @file_get_contents("http://api.justin.tv/api/stream/list.json?channel={$stream}");
    $json_array = json_decode($json_file, true);

    if (strtolower($json_array[0]['name']) == strtolower("live_user_{$stream}")) {
        echo file_get_contents("online.png");
    }else{
        echo file_get_contents("offline.png");
    }
?>

这部分工作正常。我这样称呼这段代码(image.php):

<img src="image.php?stream=nameofstreamgoeshere" />

这一切都有效,但它不是现场的。我已经尝试了几件事来让它刷新并确定 jQuery 可能是最好的选择。我认为我需要做的是发送标题信息的某种组合,强制浏览器不缓存图像,并可能将其放入 jQuery 每 60 秒刷新一次的 div 中,但这是我遇到砖墙的地方。关于如何做到这一点的任何建议?我对 jQuery 比较陌生,在这里摸索了一下,所以任何帮助都将不胜感激。

我发现的许多避免缓存图像的潜在解决方案包括将内容附加到图像 url,例如日期或时间,但由于这已经是一个动态图像 url,我不确定如何使其工作。

提前感谢您的帮助。

4

1 回答 1

0

好的,所以回答我自己的问题可能很奇怪,但是我找到了我最初提出的问题的部分解决方案:

我想到了使用 jquery 来自动刷新一个保持 twitch 状态的 div,如下所示:

首先,在我的文档的标题中调用 jquery:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js">

然后,在文件正文部分的底部:

<script>
$.ajaxSetup ({
    // Disable caching of AJAX responses */
    cache: false
});

var auto_refresh = setInterval(
function()
{
$('#twitchStatus').fadeOut(0).load('reload.php').fadeIn(0);
}, 60000);
</script>

最后,围绕其中包含图像的代码:

<div id="twitchStatus">
nameofstreamgoeshere is <img style="margin-bottom: 0px;" alt="" src="image.php?stream=nameofstreamgoeshere" />
</div>

所以我现在的问题?它在 chrome 中完美运行,但在 IE 或 Firefox 中却不行……有人有线索吗?我认为它可能正在缓存页面 - 因为它似乎根本没有刷新,因此脚本的第一部分位于正文的末尾,但这并没有做任何事情。再次,任何帮助将不胜感激。

于 2013-06-21T02:37:15.177 回答