JSONP幫助（沒有jQuery）

Question

我在這里努力想弄清楚如何做一個JSONP請求，但我尋找參考資料的地方都是jQuery的例子。 我可以閱讀jQuery源代碼，但我想要一個簡潔明了的例子。 我正在為某些東西構建一個庫，我不想包含jQuery，所以請不要使用jQuery $.getJSON 。 我知道如何使用它。

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

因此，如果我放入一個腳本標簽（使用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庫來做到這一點，但對於這個項目，我需要自己編寫代碼:)

Answer 1

如果你設置“callback = test”，那么在你的客戶端代碼中你需要有一個名為“test”的函數，它從服務器獲取json值並為你處理它。

JQuery就是這樣做的，它具有動態生成的函數名稱。

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

Answer 2

一個簡單的腳本包含應該做的工作：

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);
};

這是一個現場演示 。

顯然你不應該忘記瀏覽器可能會緩存靜態資源，比如腳本，所以如果你想確保新的信息，你可以調整一些時間戳到網址。