Question

因此，我正在尝试构建此脚本，以便从抽搐中获取查看器数和跟随者数。我让观众算一个工作但不是跟随者计数。这是我需要的信息的api / json链接。 Link

这是javascript：

<script type="text/javascript">
 var twitchName = "tsm_wildturtle";
  function showFollowers(b){
   alert(b._total);}
    $.getJSON("https://api.twitch.tv/kraken/channels/"+ twitchName +"/follows.json", function(b){document.getElementById("follows").innerHTML += b._total;}); 
  </script>

当我在html中执行此操作时，它不会显示任何内容：Followers:<div id="follows"></div> 我的目标是错误的吗？有人可以请帮助。是的我正在使用$.getJSON

的当前版本的jquery

Answer 1

此处的问题是您的浏览器限制受跨源资源共享的限制。 Twitch没有Access-Control-Allow-Origin:*，因此您无权从浏览器中获取数据。

但是，您可以使用服务器端代码获取所需的数据并将其发回

$.ajax({
    url: '/get_twitch_user.php',
    data: {"twitchName" : twitchName},
    success: function(data){
        console.log(data);
    }
});

然后在服务器上，在你的get_twitch_user.php文件中

if(isset($_GET['twitchName'])):
    echo json_decode(file_get_contents('https://api.twitch.tv/kraken/users/'.$_GET['twitchName']));
endif;

这将免除您在CORS方面遇到的问题。

Answer 2

来自维基百科的定义“JSONP是一种在Web浏览器中运行的JavaScript程序中使用的通信技术，用于从不同域中的服务器请求数据，这是典型Web浏览器因相同的原始策略而禁止的。”

此处，因为它是一个跨域请求，您只需在末尾添加'callback=?'

即可

$.getJSON("https://api.twitch.tv/kraken/channels/tsm_wildturtle/follows.json?callback=?", 
    function(data){
        //document.getElementById("follows").innerHTML += b._total;
        alert(data._total);
    });

查看工作演示here

如何从json文件中获取内容

2 个答案: