JSONP Help (No jQuery)

JSONP Help (No jQuery)

本文关键字：jQuery No Help JSONP      更新时间：2023-09-26

我在这里努力弄清楚如何做一个JSONP请求，但是我到处寻找参考资料都是jQuery示例。我可以阅读jQuery源代码，但我想要一个干净简单的例子。我正在为某些东西构建一个库，我不想包含 jQuery，所以请不要使用 jQuery $.getJSON。我知道如何使用它。

我的服务器用content-type: application/json; charset=utf-8 MIME 吐出正常的callback({"foo":"bar"})响应。

因此，如果我输入一个脚本标签，例如（使用Twitter，因为我知道他们的API有效）： 

<script src="http://twitter.com/users/oscargodson.json?callback=test"></script>

或动态。两者都有效，我得到了 JSON，这是我无法弄清楚的下一步。

如果我只是在脚本加载后console.log(test)，我会得到：Uncaught ReferenceError: test is not defined

为什么？在我从服务器获得响应后，我如何将其传递给自己？在我自己的服务器上，如果我这样做callback = {"foo":"bar"}回调工作并返回一个对象，但不是上面的方式。怎么来了？我只使用 AJAX 库来做到这一点，但对于这个项目，我需要自己编码:)

如果设置了"callback=test"，那么在客户端代码中，您需要有一个名为"test"的函数，该函数从服务器获取json值并为您处理。

JQuery 就是这样做的，它有一个动态生成的函数名称。

function test(data) { console.log(data) }
get_jsonp("http://www.example.com/?callback=test")

一个简单的脚本包含应该可以完成这项工作：

function test(res) {
    // TODO: manipulate the results here like for example showing
    // the created_at property
    alert(res.created_at);    
}
window.onload = function() {
    var script = document.createElement("script");
    script.src = 'http://twitter.com/users/oscargodson.json?callback=test';
    document.body.appendChild(script);
};

这是一个现场演示。

显然，您不应该忘记浏览器可能会缓存静态资源，例如脚本，因此，如果您想确保新鲜信息，则可以根据URL调整一些时间戳。

相关文章：