轉載:http://www.w3cfuns.com/notes/18271/df9ecd8f0ca5e523ae75745a3996c47c.htmljavascript
JSONP的優缺點
1.優勢
1.1它不像XMLHttpRequest對象實現的Ajax請求那樣受到同源策略的限制,JSONP能夠跨越同源策略;
1.2它的兼容性更好,在更加古老的瀏覽器中均可以運行,不須要XMLHttpRequest或ActiveX的支持
1.3在請求完畢後能夠經過調用callback的方式回傳結果。將回調方法的權限給了調用方。這個就至關於將controller層和view層終於分開了。我提供的jsonp服務只提供純服務的數據,至於提供服務以 後的頁面渲染和後續view操做都由調用者來本身定義就行了。若是有兩個頁面須要渲染同一份數據,大家只須要有不一樣的渲染邏輯就能夠了,邏輯均可以使用同 一個jsonp服務。
2.缺點
2.1它只支持GET請求而不支持POST等其它類型的HTTP請求
2.2它只支持跨域HTTP請求這種狀況,不能解決不一樣域的兩個頁面之間如何進行JavaScript調用的問題。
2.3 jsonp在調用失敗的時候不會返回各類HTTP狀態碼。
2.4缺點是安全性。萬一假如提供jsonp的服務存在頁面注入漏洞,即它返回的javascript的內容被人控制的。那麼結果是什麼?全部調用這個 jsonp的網站都會存在漏洞。因而沒法把危險控制在一個域名下…因此在使用jsonp的時候必需要保證使用的jsonp服務必須是安全可信的。html
================================================java
jquery的$.get $.post $.ajax $.getJSON.jquery
轉載:http://www.cnblogs.com/ranzige/p/jquery_get_ajax.htmlajax
轉載:http://www.jb51.net/article/77470.htmjson
$.getJSON 的本質是$.get+一個json的參數,get請求才能夠跨域。跨域
$.ajax對原聲 ajax的一個封裝,支持get和post,也能夠跨域瀏覽器
================================================安全
咱們一般用的getJSON的用法。dom
getJSON: function(param) { var url = param.url, data = param.data, success = param.success, fail = param.fail, callback = param.callback || 'callback', timeout = param.timeout || 5000, maxCount = param.maxCount || 2; var jsonpCallback, count = -1, delayID = 0, s, self = this, head = document.head || document.getElementsByTagName('head')[0] || document.documentElement; var tmp = []; if(data) for(var k in data) tmp.push(k + '=' + data[k]); if(!/\?/.test(url)){ url += '?' + tmp.join('&'); }else{ url += '&' + tmp.join('&'); } var addCb = function(){ var time = self.now(), jsonpCallback = 'vjs_' + time + Math.floor(Math.random()*100); window[jsonpCallback] = function(response) { destroy(); success.call(this, response,{responseTime: self.now()-time, retryCount: count}); window[jsonpCallback] = null; }; return jsonpCallback; }; var destroy = function(){ if(window[jsonpCallback]) window[jsonpCallback] = emptyFn; clearTimeout(delayID); if (s && s.parentNode) { head.removeChild(s); s.onload = s.onreadystatechange = null; s = undefined; } }; var load = function() { destroy(); count++; if (count >= maxCount){ fail && fail.call(this); return; } jsonpCallback = addCb(); var jsonpUrl = url; if(/(\=)\?(&|$)/i.test(jsonpUrl)){ jsonpUrl = jsonpUrl.replace(/(\=)\?(&|$)/i,'$1' + jsonpCallback + '$2'); }else{ jsonpUrl += '&' + callback + '=' + jsonpCallback; } if(param.log) param.log.pushLog('lib getJSON===' + jsonpUrl + '===' + jsonpCallback + '====' + count); s = document.createElement('script'); s.setAttribute('type', 'text/javascript'); s.setAttribute('src', jsonpUrl); head.insertBefore(s, head.firstChild); delayID = setTimeout(load, timeout); }; load(); return { destroy : destroy } }