pty 方法 www 三方庫 .get 設定 部分 nbsp blog

什麽是JSONP？

javascript高級程序設計中是這樣介紹jsonp的:

jsonp是JSON with padding(填充式JSON或參數式JSON )的簡寫，是應用JSON的一種新方法，在後來的Web服務中非常流。jsonp看起來與json差不多，只不過是被包含在函數調用中的json。jsonp由回調函數和數據兩部分組成。

簡單點說，jsonp是一種跨域通信的手段，它的原理其實很簡單：

1. 首先是利用script標簽的src屬性來實現跨域。
2. 通過將前端方法作為參數傳遞到服務端，然後由服務的註入參數之後再返回，實現服務器向客戶端通信。
3. 由於使用script標簽的src屬性，因此只支持get方法。

下面詳細講解如何實現jsonp。

一.實現流程

1.設定一個script標簽

 <script src="http://jsonp.js?callback=xxx"></script>

2.callback定義了一個函數名，而遠程服務端通過調用指定的函數並參數參數來實現傳遞參數，將fn(response)傳遞回客戶端。

$callback = !empty($_GET[‘callback‘]) ? $_GET[‘callback‘] : ‘callback‘;
echo $callback.‘(.json_encode($data).)‘;

3.客戶端接收到返回的js腳本，開始解析和執行fn(response) 二.jsonp簡單實現 1.在瀏覽器端: 首先全局註冊一個callback回調函數，記住這個函數名字(比如:result)，這個函數接收一個參數，參數是服務端返回的數據，函數的具體內容時處理這個數據。 然後動態生成一個script標簽，src為：請求資源的地址 + 獲取函數的字段名 + 回調函數名，這裏 獲取函數字段名是要和服務端約定好的，是為了讓服務端拿到回調函數名稱。（比如：www.example.com?callbackName = result）

function result (data) {
  console.log(data.name)
}
var jsonp = document.createElement(‘script‘)
jsonp.src = ‘www.example.com?callbackName=result‘
document.getElementsByTagName(‘head‘)[0].appendChild(jsonp)
 

2.服務端 在接收到瀏覽器端script的請求之後，從url的query的callbackName獲取到回調函數的名字，例子中是 result。 然後動態生成一段js片段去給這個函數傳入參數執行這個函數。比如：

result({name:‘Joy‘})

3.執行 服務端返回這個script之後，瀏覽器端獲取到script資源，然後會立即執行這個js，也就是上面那個片段，這樣就能根據之前寫好的回調函數處理這些數據了。 在一些第三方庫往往都會封裝jsonp的操作，比如jquery的$.getJSON

jsonp的原理和實現