爲什麼不能從jQuery加載方法加載外部資源？

在使用jQuery學習Ajax請求的過程中，我嘗試在點擊鏈接時加載google主頁。所以我寫了類似：爲什麼不能從jQuery加載方法加載外部資源？

$("#ajax").click (function (event) { 
    $("#g").html("Loading..."); 
    $("#g").load("http://www.google.com"); 
    event.preventDefault(); 
});

身體

而且地方：

<a id="ajax" href="http://www.google.com">Load file ajax way</a> 
<div id="g">Click the above link to load the page...</div>

，沒有工作，最初我以爲有一些語法錯誤或東西。但後來當我用服務器上的靜態HTML文件替換谷歌網址時，它正常運行。

$("#g").load("Temp.htm");

它的設計是這樣工作嗎（如果是的話，爲什麼？）還是我做錯了什麼？

編輯：請任何人都可以解釋（或引用）跨域Ajax調用引入的安全問題？換句話說，爲什麼可以安全地打開另一個瀏覽器選項卡並打開谷歌而不是在頁面內？它是保護來電者還是被叫人？

來源

2009-08-18 Hemant

Jquery使用ajax（XMLHttpRequest）請求來加載數據，但瀏覽器允許這個資源在同一個域上。（上面的答案提到了Same origin policy）。這就是爲什麼它適用於Temp.htm，但不適用於www.google.com。

解決此問題的一種方法是創建一個服務器腳本，爲您加載頁面 - 基本上是一個代理。然後調用
```
$('#g').load("load.php?url=google.com") 
```
另一個解決辦法是使用iframe的溝通 - 我發現這個庫，這似乎是你所需要的：jquery-crossframe
第三個選項是JSONP但是這是行不通的它是你的情況。

我的意見 - 請與服務器端代理的第一個選項。

爲什麼會有相同的原產地規定？

想象一下，你正在檢查你的易趣賬戶上的一些東西。然後在另一個選項卡中打開我的網站，在那裏我有一個腳本，它提出了一系列eBay請求（您仍然登錄），並且在沒有您注意的情況下爲您投標奧迪A8。討厭......如果是你的銀行，它可以直接從你那裏偷錢。

具有諷刺意味的是，儘管有相同的原產地政策，上述攻擊仍是可能的。

來源

2009-08-18 08:29:01

+1非常棒的答案。 – 2009-12-13 02:20:01

非常全面和完整的答案 – 2011-02-22 14:39:15

因此load.php只是讀取查詢的域並存儲內容？ – 3zzy 2012-11-28 10:41:29

出於安全原因，您不允許進行跨域AJAX調用 - 請參見Same Origin Policy。

來源

2009-08-18 08:17:54 Greg

這是由於安全性。您可以在yahoo以及解決方案中閱讀所有內容。

來源

2009-08-18 08:19:07

首先，我必須假設你有一個很好的理由做一些鏈接的默認操作用JavaScript ...

主要的原因可能是安全的：你不能訪問任何數據在JavaScript的當前域之外。

來源

2009-08-18 08:19:15

我沒有任何理由這樣做。我只是在學習jQuery和Ajax調用（並且天真地試圖使用谷歌）。因此，我可能永遠不需要打電話給其他服務器，但如果需要的話，瞭解解決方案仍然很好（由Andy提出）。 – Hemant 2009-08-18 08:25:23

值得注意的是，您並未完全排除JavaScript中的跨域請求。

從jQuery 1.2開始，如果您指定了JSON-P回調，並且您調用的URL支持JSON-P輸出，則可以加載位於其他域的JSON數據。

以下示例直接來自jQuery文檔。它抓住了最後四張帶有「貓」標籤的flickr圖片。

$.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?tags=cat&tagmode=any&format=json&jsoncallback=?", 
    function(data){ 
     $.each(data.items, function(i,item){ 
     $("<img/>").attr("src", item.media.m).appendTo("#images"); 
     if (i == 3) return false; 
     }); 
    });

你可以在這裏閱讀文檔：http://docs.jquery.com/Ajax/jQuery.getJSON#urldatacallback

我個人使用它在我在我的博客最新的鳴叫拉而無需將其打造成爲我的服務器端代碼。這還具有額外的好處，就是不必爲Twitter中常見的API服務編寫錯誤處理代碼。只要查看我的博客來源，如果你想看到它：http://joreteg.com

來源

2009-12-13 02:12:23

嘗試添加

<IfModule mod_headers.c>Header add Access-Control-Allow-Origin: "http://yoursite.com/"

在htaccess.send一些使用

$("#g").load("http://www.google.com",{nomeaning:'nomeaning'});

參數，這將發個帖子request.it工作對我來說

來源

2014-07-25 05:41:50 Kavita

爲什麼不能從jQuery加載方法加載外部資源？

回答

相關問題