使用JQuery嵌入外部HTML文件

Question

我正在开发一个页面，需要使用JQuery的“load”命令将一个HTML文件导入到另一个HTML文件中。它应该相当简单 - 它会提取网站标题的内容（徽标图像，搜索框，菜单栏）。

在我的测试页面上它可以正常工作，但在实体店面它不起作用，我无法弄清楚原因。

这是我的JS文件中的一行 - 非常简单：

$("#x-head").load('http://www.sunandfuninoc.com/testingsites/jxinstalls/topparts/ebay/head.html');

应该填充的HTML div在我的主页上显示如下：     

以下是测试页面的精彩工作： http://www.sunandfuninoc.com/testingsites/jxinstalls/topparts/ebay/store.html

这是根本没有加载的实时网站： http://stores.ebay.com/Top-Parts-Store

有什么想法吗？谢谢！

Answer 1

这是因为JavaScript运行的原始政策相同。

除非服务器明确允许，否则在使用AJAX时，您可能无法从单独的远程服务器（即您正在运行的服务器之外）提取内容。

http://en.wikipedia.org/wiki/Same_origin_policy

除非您调用的服务器允许跨域调用，否则您唯一的选择是不是通过jQuery而是通过服务器端代理加载页面，例如PHP通过cURL。服务器端语言通常不受此限制。

Answer 2

它适用于第一种情况，因为您提出的请求与托管的网站位于同一个域中。在第二种情况下，store.ebay.com正在发出请求，并且由于现代浏览器中的安全功能，不允许跨域请求。

Answer 3

1。 load();如果您使用的网址位于同一域名下，则会有效。

2. 如果要加载外部内容，例如store.ebay.com，请使用代理，如果您使用的是PHP，则可以创建一个PHP文件，使用cURL从该网站获取源代码。否则，您将无法实现Access-Controll-Allow-Origin规则所需的内容（这意味着您可以加载不在您域中的外部内容）。