为什么我无法从jQuery加载方法加载外部资源？

Question

在使用jQuery学习Ajax请求的过程中,我尝试通过点击链接加载谷歌主页.所以我写了类似的东西:

$("#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调用引入的安全问题？换句话说,为什么打开另一个浏览器选项卡并打开谷歌而不是从页面内打开是安全的？它是为了保护来电者还是被叫者？

Answer 1

Jquery使用ajax(XMLHttpRequest)请求来加载数据,但浏览器允许这个用于同一域上的资源.(上面的答案提到了同源政策).这就是为什么它适用于Temp.htm,但不适用于www.google.com.

• 解决此问题的一种方法是创建一个服务器脚本,为您加载页面 - 基本上是代理.然后你打电话

  $('#g').load("load.php?url=google.com")
  

• 另一个解决方案是使用iframe进行通信 - 我找到了这个库,这似乎是你需要的:jquery-crossframe

• 第三个选项是JSONP,但这不适合你的情况.

我的意见 - 选择服务器端代理的第一个选项.

为什么有相同的原产地政策？

想象一下,你正在检查你的易趣帐户上的一些东西.然后,在你打开我的网站另一个选项卡,在这里我有一个脚本,提出了一系列要求易趣(您仍然登录)和竞价您的奥迪A8没有你甚至没有注意到的.恼人的......如果是你的银行,它可以直接从你那里偷钱.

具有讽刺意味的是,尽管有相同的原产地政策,上述攻击仍然是可能的.