使用JSON格式的Twitter REST API和AJAX

Question

我正在尝试在Twitter REST API(JSON格式)上进行AJAX.我做了下面的事情,但是,没有任何反应.

没有从服务器(Twitter)得到任何响应.我错过了什么？

function getRecentTweet(){

        twitterUsername = document.getElementById("twitterUsername").value;

        if(window.XMLHttpRequest){
            xhr = new XMLHttpRequest();
        }
        else{
            xhr = new ActiveXObject("Microsoft.XMLHTTP");
        }

        xhr.open("GET", "http://api.twitter.com/1/statuses/user_timeline/" + twitterUsername + ".json", true);
        xhr.send(null);

        xhr.onreadystatechange = function(){
            if (xhr.readyState == 4) {
                if(xhr.status == 200) {
                    var jsonObj = eval(responseJSON);
                    document.getElementById("twitterStream").innerHTML = jsonObj[0].text;
                }
            }
        } 
    }

谢谢!

Answer 1

是的,不允许跨域AJAX调用.您需要使用JSONP.

向Twitter的API发出请求并附加callback参数.这是一个示例网址:

http://api.twitter.com/1/statuses/user_timeline/hulu.json?callback=myFunction

然后来自Twitter的响应将包含可执行JavaScript代码,其中包含您指定为回调参数的函数的名称.所以推特的反应如下:

myFunction(<JSON here>);

由于跨域是一个问题,您需要向页面添加脚本标记,并将src属性设置为上述URL.这可以使用JavaScript动态创建并注入页面.

<script src=" ... hulu.json?callback=myFunction"></script>

然后myFunction在页面上定义一个全局函数,只要Twitter的响应返回,它就会被调用.这也可以预定义或动态生成.

<script>
function myFunction(data) {
    console.log(data);
}
</script>