如何設置JSONP？

Question

我需要在服務器端允許某人使用JSONP從該服務器獲取數據。 我還需要在用戶方面做些什么呢？ 我想使用JSONP作為XMLHttpRequest的替代。

由於同源策略，它不會在我的Firefox擴展中運行。 所以，人們推薦JSON，但在互聯網上搜索教程和指南之后，我很遺憾。

謝謝您的幫助！

Answer 1

假設您的服務器正在運行PHP，您只需要添加“回調”GET請求。

<?php header('content-type: application/json; charset=utf-8');
$data = array ('a'=>1,'b'=>2,'c'=>3,'d'=>4,'e'=>5); 
echo $_GET['callback'] . '('.json_encode($data).')';

在客戶端（使用jQuery）：

$.ajax({url: 'http://site.com/data.php', dataType:'jsonp'});

上面的PHP代碼僅用於演示，不要忘記清理 $ _GET ['callback']

也就是說，如果您的問題只是相同的原始策略，您可能只需要允許來自服務器端的跨源 ，並且一切都應該有效。

Answer 2

在服務器端，您需要設置的只是一個Web資源（例如，頁面），它接受GET請求並使用JSON-P約定返回數據，即：

callback({"data": "here"});

...其中函數名稱（在該示例中為“回調”）通常取自查詢字符串參數之一（按照慣例，參數“回調”），數據是JSON文本（雖然從技術上講它可能是任何東西）在JavaScript對象中有效，JSON-P的約定是限制自己在JSON中的有效性。 例如，假設請求看起來像這樣：

http://example.com/foo.php?callback=bar

它調用頁面foo.php （不必是PHP，可以是任何動態服務器端系統），告訴它我們希望它調用的函數是“bar”。 我們的回應是：

bar({"data": "here"});

在客戶端，您必須動態地向頁面添加script元素，並添加將由JSON-P響應觸發的回調函數。 通常，您希望為該函數提供一些隨機名稱，並在完成后將其刪除。

這是一個完整的例子，作為Stack Overflow上另一個問題的答案。 您可能需要稍微調整它以用於Firefox附加組件，但概念是相同的。

Answer 3

jsonp是帶有包裝器的json，所以你可以通過動態插入新的<script>標簽來偽造ajax請求到另一台服務器，src指向另一台服務器。 包裝器本質上使jsonp返回的東西是一個有效的javascript函數調用，可以執行該調用以提取其中的標准json數據。

一般來說，在一個不安全的“只是演示”版本中，你會有這樣的東西：

function unwrap_jsonp(data) {
    eval(data);
}

遠程服務器將返回以下文字文本：

unwrap_json("{'this':'is','sparta':'!'}");

請注意，這是文字Javascript純文本代碼，它執行並將嵌入的JSON字符串“解包”回原生javascript數據結構。

大多數JSONP服務允許通過查詢字符串指定一個額外的參數來命名你想要包裝響應的處理函數，例如

http://example.com/getjsonp.php?callback=unwrap_json