外部 HTML 检索答案

【问题标题】：External HTML retrieval外部 HTML 检索
【发布时间】：2012-12-06 19:09:24
【问题描述】：

我正在尝试通过 ajax 调用获取 http://en.wikipedia.org 的内容。为此，我正在使用 jQuery。代码如下：

jQuery.ajax({
  url:"http://en.wikipedia.org",
  crossDomain: true,
  dataType: "jsonp",
  jsonpCallback: "myCallback"
});

function myCallBack(data){
  console.log("ok");  
}

问题是我在 Firebug 中遇到了这个错误：

SyntaxError: syntax error
<!DOCTYPE html>

所以我会说 html 内容被提取了，虽然回调函数没有运行。在某些时候它遇到指定的标签，抛出这个错误并停止运行脚本。

你知道问题出在哪里吗？

还有其他方法可以获取 html 页面的内容吗？我不想使用 iframe，因为这意味着我将无法使用或修改其内容。

【问题讨论】：

标签： javascript jquery

【解决方案1】：

这是因为您是 Ajax 函数需要来自提供的 url 的 json 响应，并且它会给出 html 响应，这就是您收到语法错误的原因，您将从 Chrome 调试器中收到相同的错误好吧。

更新：

您正在尝试做的事情称为跨域请求。

“出于安全原因，脚本无法访问来自其他域的内容。Mozilla 有一篇关于 HTTP access control 的长文章，但底线是，如果网站本身没有添加对跨域请求的支持，那么您将搞砸了。”

Reference

解决方案：

您可以通过为您提供外部页面的后端脚本来解决此问题。就像代理服务器一样，它驻留在同一个域中，因此您不必面对跨域问题。您可以通过

加载它们

$.get(url, success: function(data) { // the url that will fetch the external html page for you, located on the same domain
  console.log("ok");
});

【讨论】：

有什么方法可以“告诉”jQuery 期待 html 内容而不是 json？
JSONP 响应（application/javascript）不是 JSON 响应。

【解决方案2】：

您在这里遇到的问题是您正在跨域调用。尽管您似乎已经意识到这一点并且正在使用 jsonp 来满足您的请求，但您尝试提取的文档（即 wikepedia）并不是 jsonp 文档。因此，一旦 ajax 找到 html 标签，它就会抛出一个错误，正如您所定义的那样，您期望得到一个 jsonp 响应。

由于跨域问题，您不能仅使用 javascript 跨域提取其他网站数据，如果您想完成您在此处所做的事情，则需要使用后端语言来获取数据。

有用的链接是http://json-p.org/ 希望有帮助

【讨论】：