原生javascript實現jsonp的封裝

JSONP即JSON with Padding。因爲同源策略的限制，XmlHttpRequest只容許請求當前源（域名、協議、端口）的資源。若是要進行跨域請求， 咱們能夠經過使用html的script標記來進行跨域請求，並在響應中返回要執行的script代碼，其中能夠直接使用JSON傳遞javascript對象。 這種跨域的通信方式稱爲JSONP。

咱們能夠動態的去建立一個script標籤，利用他的src屬性沒有跨域的限制來實現的，至關於咱們引入一個js文件

附上源碼：

jsonp: function (json){
　　json = json || {};
　　if(!json.url)return;
　　json.cbName = json.cbName||'cb';
　　json.data = json.data||{};

　　json.data[json.cbName] = 'show'+Math.random();
　　json.data[json.cbName] = json.data[json.cbName].replace('.','');

　　var arr = [];
　　for(var i in json.data){
　　　　arr.push(i+'='+encodeURIComponent(json.data[i]));
　　}
　　var str = arr.join('&');

　　window[json.data[json.cbName]]=function(result){
　　　　json.success&&json.success(result);
　　　　oH.removeChild(oS);
　　　　window[json.data[json.cbName]]=null;
　　};
　　var oH = document.getElementsByTagName('head')[0];
　　var oS = document.createElement('script');
　　oS.src=json.url+'?'+str;
　　oH.appendChild(oS);
　　oS.onerror = function(){
　　　　window[json.data[json.cbName]]=null;
　　　　oH.removeChild(oS);
　　　　json.error&&json.error();
　　}
}

具體用法：

jsonp({
　　url: '----',
　　success: function (json) {

　　.................
　　},
　　error: function(){
　　..................
　　}
});

必定要注意若是咱們後端返回的是json對象的話，是沒法跨域返給咱們的，咱們的請求的時候給後端傳了一個用於回調function(){}，後端必須把要返回的json對象放到這個function(){}裏面，而後把這個方法返回給咱們，咱們才能夠解析適用

java返回示例：

return request.getParameter("jsonpcallback")+"("+s+")";