2012-01-30 38 views
1

我試圖加載遠程URL(或者更確切地說就是測試一下遠程頁面是否存在)。使用.ajax()加載遠程URL - 不起作用

這只是正常:

$(function() {  
    $.ajax({ 
     url:'localtest.html', 
     type: 'html', 
     success: function(content,code) { 
      alert(code); 
      $('body').html(content); 
     } 
    });   
}); 

但在遠程URL交換,我什麼也沒有:

$(function() {  
    $.ajax({ 
     url:'http://www.google.com/', 
     type: 'html', 
     success: function(content,code) { 
      alert(code); 
      $('body').html(content); 
     } 
    });   
}); 

有沒有辦法做到這一點?

+0

你得到的錯誤是什麼。你用Firebug來查看錯誤是什麼? – Steve 2012-01-30 09:12:27

回答

3

出於安全原因,AJAX不支持跨域調用。

周圍的傳統方法是使用jsonp

2

瀏覽器阻止阿賈克斯訪問資源跨域(SOP =同源策略)。它只會在服務器配置爲指向您的域(或*或類似)的「Access-Control-Allow-Origin」時起作用。

+0

Access-Control-Allow-Origin不適用於較舊的瀏覽器(例如IE),因此不能被視爲可靠。 – 2012-01-30 09:16:04

2

這是因爲瀏覽器不允許跨站點請求,除非遠程服務器通過發送Access-Control-Allow-Origin標頭明確允許它。如果您只想測試是否存在,則可以使用onload和onerror事件將URL加載到圖像標記中。您將無法訪問遠程URL的內容;這是爲了安全。否則,例如,您可以加載Facebook並在不知情的情況下閱讀某人的牆。

-1

這不是一個正確的阿賈克斯調用。假設您正在執行檢索操作,該類型應該是'GET'。 dataType屬性應該是'html'。

$.ajax({ 
     url:'http://www.google.com/', 
     type: 'GET' 
     dataType: 'html', 
     success:function(content,code) 
     { 
      alert(code); 
      $('body').html(content); 
     } 
     });   
    }); 

而且,因爲任何人都增加了,因爲你正在爲google.com一個電話,你必須提供,因爲相同的起源policy..hope幫助的JSONP回調。

+0

你可以有任何關於JSONP回調的例子。請分享 。 – 2012-01-31 07:35:40

-2

在AJAX調用中使用屬性。

crossDomain: true 

並確保您正在加載內容的html頁面的元數據標記。

+0

這不會做任何事情。它只關乎如果你正在做一個可能被重定向到一個不同的起源的相同的原始請求(因爲它告訴jQuery不要給請求添加額外的頭部,這將需要一個預檢OPTIONS請求來獲得它添加的CORS的權限)給出的URL指向相同的原點)。您仍然需要請求服務器向CORS授予權限。 – Quentin 2016-04-06 06:35:04

+0

同意這一點,我在科爾多瓦應用程序中使用這種情況,我可以通過允許CROS權限在我的應用程序中調用遠程URL。它的運行也很完美。 – user2417120 2016-04-06 07:16:15

-1

出於安全原因,AJAX不支持CORS(跨源資源共享)。

+0

是的,它的確如此。 CORS專門爲Ajax設計(然後擴展了其他一些功能,如字體和畫布圖像)。 – Quentin 2016-04-06 08:40:50