javascript - JSONP 跨源错误 'No Access-Control-Allow-Origin header is present'

Question

我正在使用 Ajax 使用他们的 API 从 Twitter 获取数据。我正在尝试使用 jsonp，从我所看到和理解的情况来看，我认为我做的一切都是正确的(虽然显然不是)。

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">  </script>
<script>
    $(document).ready(function () {
        $.ajax( {
            type: 'GET',
            datatype: 'jsonp',
            data: {},
            crossDomain: 'true',
            url: "http://twitter.com/status/user_timeline/padraicb.json?count=10&callback=?",
            error: function(textStatus, errorThrown) {
                alert("error");
            },
            success: function(msg) {
                console.log(msg);
            }
        });
    });
</script>

以上代码在 Chrome 和 Firefox 中均产生错误 XMLHttpRequest 无法加载 http://twitter.com/status/user_timeline/padraicb.json?count=10&callback= ？。请求的资源上不存在“Access-Control-Allow-Origin” header 。因此不允许访问 Origin 'null'。

根据我的理解，我认为拥有 &callback=? 并将类型设置为 jsonp 将允许此操作成功。更重要的是，我可以看到 JSON 对象在 fiddler 中返回，它只是没有被脚本处理。我尝试了多个 API，但都出现了同样的问题。

当输入地址栏时，其中一个这样的 API 也可以工作。

因此，经过大量搜索和查看后，我是否需要了解如何将原点设置为 *？我认为这更多是服务器端问题？

我也尝试过 ?callback? 但无济于事。

任何想法都会很棒，谢谢。

Answer 1

上述资源支持jsonp，所以不需要CORS...问题是datatype: 'jsonp' 应该是dataType: 'jsonp'

$(document).ready(function () {
    $.ajax({
        type: 'GET',
        dataType: 'jsonp',
        data: {},
        url: "http://twitter.com/status/user_timeline/padraicb.json?count=10&callback=?",
        error: function (jqXHR, textStatus, errorThrown) {
            console.log(jqXHR)
        },
        success: function (msg) {
            console.log(msg);
        }
    });
});

演示:Fiddle