javascript - 想用ajax访问另一个域的内容吗?

时间:2009-07-19 16:08:58

标签: jquery ajax jsonp

我正在尝试编写一个从openstreetmap API(http://wiki.openstreetmap.org/wiki/OSM_Protocol_Version_0.6)加载数据的javascript应用程序,它基本上只是一个安静的xml api。我正在尝试使用jquery来访问XMl。但是我遇到了安全错误。这是一个跨站点脚本阻止。

如何访问该XML? AFAIK OSM不提供jsonp,因此不起作用。反正了吗?>

3 个答案:

答案 0 :(得分:2)

绕过跨站点脚本的两种方法是设置服务器端代理,使用脚本调用服务器端代理来调用url。另一种方法是使用脚本标记调用数据,该标记对跨站点调用没有限制。

答案 1 :(得分:1)

由Dan链接的博客文章向您展示了如何解决这个问题,但这里是背景:

您可以通过JSONP从网页进行跨域Javascript调用的唯一方法。如果您没有获得JSONP,那么您将不得不求助于使用代理脚本,因为浏览器会故意阻止站点脚本进行此类调用。

请注意,如果您正在编写Firefox扩展程序,则表示您正在特权空间中执行,因此可以无限制地进行此类跨域调用。

答案 2 :(得分:1)

OpenStreetMap的Nominatim API现在支持JSONP,因此您可以完全使用客户端代码获取数据,而无需在您自己的服务器上进行额外的操作。这是一个 jsfiddle示例 - 如果您可以在jsfiddle中执行此操作,则可以在任何地方执行此操作。

关于如何从其他域访问API的更一般的问题,这里有一些有用的东西,我在学习那些许多部分完整且经常相互矛盾的答案时,通过反复试验而学到的。如果有任何内容或变得不准确,请编辑或评论。

  • 如果您不能使用支持JSONP的API,则需要使用jquery-xdomain-ajax之类的内容查看YQL之类的插件,并了解它们的工作原理。通常,这些插件看起来比阅读HTML更适合阅读HTML。
  • 为了能够直接访问API,它必须a)以JSON提供结果,b)内置JSONP支持,这意味着: -
    • 必须设置API以侦听一个参数,该参数告诉它包含其结果的函数的名称
    • 您必须找出调用该参数的内容。在OSM的情况下,它被称为json_callback,jQuery的默认callback只有在偶然的情况下才能工作,这是API被编程来监听的内容
    • 使用jQuery,这是特定于API的参数键,它应该在?的查询网址末尾(例如,如果它是json_callback,那么someurl.com/api?json_callback=?)。 jQuery弄清楚这是什么,将?交换为类似jQuery1712164863864387412的字符串,使用相同的字符串命名内联函数,并等待接收一些按名称触发该函数的代码并将其传递给JSON 。
      • 如果请求有效但回调没有触发并且您看到类似parseerror jQuery17109935275333671539_1300495251986 was not called的错误,则表示jQuery具有名为,ready和waiting的函数,但是API没有使用该字符串来包装JSON因此未调用该函数 - 可能意味着您没有使用正确的参数名称
    • 如果没有jQuery,您需要将该参数键传递给将接收JSON的命名函数的名称
  • 由于基本上所有发生的事情都是浏览器加载然后以受控的方式运行相当于someFunction({"some": "argument"});的javascript代码片段,错误处理是有限的(但是如果你使用完整的jQuery提供jQuery提供的内容) $.ajax语法而不是精简的$.getJSON快捷方式)
  • 在Firebug中对我来说,至少JSONP请求不像其他AJAX调用那样出现在控制台中,而是它们位于NET面板的底部(因为,在引擎盖下,它基本上是一个圆形的背面加载代码的方式,处理更像是说<script>)。

希望这对某人有帮助!