這次帶給大家json與jsonp使用小結,json與jsonp使用的注意事項有哪些,下面就是實戰案例,一起來看一下。
json
1. json 的值可以是以下這些型別:
① 數字(整數或浮點數) ,例如123,1.23
② 字串(在雙引號中)
③ 邏輯值(true 或false)
④ 陣列(在方括號中)
⑤ 物件(在花括號中)
⑥ null
2. json解析方法
#① eval('(' jsondata ')' ); 使用時永遠是不安全的,程式碼注入
② JSON.parse(jsondata);
JSONLint json:字串校驗工具
3. jQuery 實作ajax
jQuery.ajax([settings])
type :類型
url :發送請求的位址
data :是一個對象,連同請求傳送到伺服器的資料
dataType :預期伺服器傳回的資料類型,如果沒有指定,jQuery 會自動根據HTTP套件MIME資訊來智慧判斷,一般我們採用json 格式,可以設定為”json”
success :是一個方法,請求成功後的的回呼函數,傳入返回後的數據,以及包含成功程式碼的字串
error :是一個方法,請求失敗時呼叫此函數。傳入XMLHttpRequest 物件
jsonp
#跨網域
一個網域位址的組成:
http://www .abc.com :8080 / scripts/jquery.js
協定://子網域.主網域:連接埠號碼/ 要求資源位址
#當協定、子網域、主網域、連接埠號碼中任一個不行同時,都算是不同域
不同網域之間互相請求資源,就算是「跨域」
javascript 出於安全性方面的考慮,不允許跨域呼叫其他頁面的物件。
什麼是跨域呢?簡單的解釋就是因為javascript同源策略的限制,a.com 網域下的js無法操作b.com 或是c.a.com網域下的物件
處理跨域方法:
—— 代理(屬於後台技術)例如在北京的web伺服器的後台來呼叫上海伺服器的服務,看然後再把回應結果回傳給前端,這樣前端呼叫北京同網域的伺服器就和呼叫上海的服務效果相同了。
——JSONP
a網域去聲明,b網域去呼叫
注意:JSONP只能用於GET 請求,不支援POST請求 (限制)
—— XHR2
HTML5 提供的XMLHttpRequest Level2 已經實現了跨域存取以及其他的一些新功能
IE10 以下的版本都不支援
在服務端做一些小小的改造即可:
header("Access-Control-Allow-Origin:"); 表示所有的伺服器都可以訪問,也可以替換成特定的域名,比如說:伺服器在上海,*換成北京伺服器的域名,這樣只有從北京的域名才可以存取
header("Access-Control-Allow-Methods:POST,GET");
下面說下jsonp 的優缺點。
同源策略 :即JavaScript只能存取與包含它的文件在同一網域下的內容。 jsonp可以跨越同源策略,當我們使用了jsonp,將會是另外一種協定通訊了。
JSONP的優點是:它不像XMLHttpRequest物件實現的Ajax請求那樣受到同源策略的限制;它的兼容性更好,在更古老的瀏覽器中都可以運行,不需要XMLHttpRequest或ActiveX的支持;並且在請求完畢後可以透過呼叫callback的方式回傳結果。
JSONP的缺點則是:它只支援GET請求而不支援POST等其它類型的HTTP請求;它只支援跨域HTTP請求這種情況,不能解決不同域的兩個頁面之間如何進行JavaScript呼叫的問題。
相信看了本文案例你已經掌握了方法,更多精彩請關注php中文網其它相關文章!
推薦閱讀:
#以上是json與jsonp使用小結的詳細內容。更多資訊請關注PHP中文網其他相關文章!