Fatal编程技术网
  • javascript/
  • Javascript 解析JSON http请求时遇到问题

Javascript 解析JSON http请求时遇到问题

javascript php html ajax json

Javascript 解析JSON http请求时遇到问题,javascript,php,html,ajax,json,Javascript,Php,Html,Ajax,Json,我引用了w3schools.com上教程中的代码。我不知道我可能做错了什么，但是当我测试站点时，我没有得到任何输出。一点也没有。我将在下面发布代码 <!DOCTYPE html> <html> <body> <p id="par1"></p> <script> var xmlhttp = new XMLHttpRequest(); var

我引用了w3schools.com上教程中的代码。我不知道我可能做错了什么，但是当我测试站点时，我没有得到任何输出。一点也没有。我将在下面发布代码

<!DOCTYPE html>
<html>
    <body>
        <p id="par1"></p>
        <script>
            var xmlhttp = new XMLHttpRequest();
            var url = "http://xproshowcasex.api.channel.livestream.com/2.0/livestatus.json?callback=status";

            xmlhttp.onreadystatechange=function() {
                //readyState 4: request finished and response is ready
                //status 200: "OK"
                if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                    myFunction(xmlhttp.responseText);
                }
            }
            //var 'url' is defined above
            xmlhttp.open("GET", url, true);
            xmlhttp.send();

            function status(response) {
                var arr = JSON.parse(response);

                if (arr.isLive = true) {
                    document.getElementById("par1").innerHTML = "live"; 
                } else {
                    document.getElementById("par1").innerHTML = "offline";
                }
            }
        </script>
    </body>
</html>
我已经在livestream论坛以及其他地方看过了，没有人能给我提供一个可靠的解决方案。希望这里有人能。谢谢你的帮助

-编辑-

我已经搜索了这个网站，还没有找到解决我问题的方法。如果有人知道哪里有解决方案，请发一个链接，但据我所知，没有。我们都知道，不同的代码有不同的问题，所以我希望得到答案，而不是重复的标记

<!DOCTYPE html>
<html>
<head>
<meat charset="utf-8">
<title>test</title>


<script src="https://code.jquery.com/jquery-1.11.1.min.js" type="text/javascript"></script>

<!--Livestream status script-->
<!-- CAN BE PLACED IN BODY -->
<script type="text/javascript">
$(document).ready(function () {

function getCrossDomainJson(url, callback) {
    $.ajax({
        url: "http://query.yahooapis.com/v1/public/yql?callback=?",
        data: {
            q: 'select * from xml where url="' + url + '"',
            format: "json"
        },
        dataType: "jsonp",
        success: callback
    });
}

/*INSERT STREAM NAME INBETWEEN 'x' eg. http://xSTREAMNAMEx.channel-api.livestream-api.com/2.0/getstream*/
getCrossDomainJson("http://xhellgateospreyx.channel-api.livestream-api.com/2.0/getstream", function(data) {
    console.dir(data);

    if (data && data.query && data.query.results && data.query.results.channel) {
        var statusTest = data.query.results.channel.isLive;


        if (statusTest == "true") {
            document.getElementById("par1").innerHTML = "online";
        }

        else {
            document.getElementById("par2").innerHTML = "offline";
        }

    }
});

});
</script>

<!-- end of script -->

<body>

//par1 will change to online if stream is online; par2 will remain as unaffected
//par2 will change to offline if stream is offline; par1 will remain as unaffected
//I separated the p tags for testing purposes, but they can be combined
//if you do so, change the id in the if/else statements
<p id="par1">unaffected</p>
<p id="par2">unaffected</p>




</body>
</html>
如果需要多个流状态，请选择从“getCrossDomainJson”到第一个“}；”的代码并粘贴在两个'}'之间并替换“getElementById”中的流名称和标记。感谢所有帮助我解决这个问题的人！希望这对其他人有所帮助。

您遇到了AJAX同源策略。不能使用AJAX访问其他域中的网站。这里有许多问题可以回答如何处理这个问题。您是否尝试过添加xmlhttp.setRequestHeaderAccept，application/json；？将其添加到：xmlhttp.onreadystatechange之前。再看看这个,；它可能会派上用场：我刚刚尝试过，但在控制台中出现了以下错误：Uncaught InvalidStateError:未能在“XMLHttpRequest”上执行“setRequestHeader”：对象的状态必须打开。@Danny:下面的示例可以工作。我使用jQuery作为简单的因素@Polywhill nevermind先生，到目前为止，我已经成功了。我甚至为多个流设置了它。我将编辑我的问题以显示答案。谢谢你的帮助！ 
<!DOCTYPE html>
<html>
<head>
<meat charset="utf-8">
<title>test</title>


<script src="https://code.jquery.com/jquery-1.11.1.min.js" type="text/javascript"></script>

<!--Livestream status script-->
<!-- CAN BE PLACED IN BODY -->
<script type="text/javascript">
$(document).ready(function () {

function getCrossDomainJson(url, callback) {
    $.ajax({
        url: "http://query.yahooapis.com/v1/public/yql?callback=?",
        data: {
            q: 'select * from xml where url="' + url + '"',
            format: "json"
        },
        dataType: "jsonp",
        success: callback
    });
}

/*INSERT STREAM NAME INBETWEEN 'x' eg. http://xSTREAMNAMEx.channel-api.livestream-api.com/2.0/getstream*/
getCrossDomainJson("http://xhellgateospreyx.channel-api.livestream-api.com/2.0/getstream", function(data) {
    console.dir(data);

    if (data && data.query && data.query.results && data.query.results.channel) {
        var statusTest = data.query.results.channel.isLive;


        if (statusTest == "true") {
            document.getElementById("par1").innerHTML = "online";
        }

        else {
            document.getElementById("par2").innerHTML = "offline";
        }

    }
});

});
</script>

<!-- end of script -->

<body>

//par1 will change to online if stream is online; par2 will remain as unaffected
//par2 will change to offline if stream is offline; par1 will remain as unaffected
//I separated the p tags for testing purposes, but they can be combined
//if you do so, change the id in the if/else statements
<p id="par1">unaffected</p>
<p id="par2">unaffected</p>




</body>
</html>