使用 jQuery 的跨站 AJAX

Posted

技术标签:

【中文标题】使用 jQuery 的跨站 AJAX【英文标题】：Cross-site AJAX using jQuery 【发布时间】：2010-11-14 22:19:58 【问题描述】：

我有一个现有的 jQuery 插件，它可以进行很多 AJAX 调用（主要是 JSON）。我想知道什么是允许它进行跨站点调用的最快方法，即 $.get 和 $.post URL 不会来自同一个域。

我听说过 JSONP，但想知道是否有人可以给我一个具体的例子来了解整个过程。如果可能的话，我想对我的脚本进行最小的更改。我应该使用各种 proxy.php 吗？

感谢您的宝贵时间。

【问题讨论】：

【参考方案1】：

如果您可以控制远程域或远程域具有许可的crossdomain.xml，您可以将flXHR 连同其jQuery plugin 一起放入库中。

【讨论】：

【参考方案2】：

JSONP 将允许您进行跨站点调用。 See jQuery docs on that matter.

这个概念很简单：jQuery 将在您的<head> 上附加一个<script> 标记，而不是进行普通的Ajax 调用。为了使其工作，您的 JSON 数据需要包装在 函数调用。

您的服务器需要以这种方式发送信息（PHP 示例）：

$json = json_encode($data);
echo $_GET['jsonp_callback'] . '(' . $json . ');';

然后，您可以使用 jQuery 来获取该信息：

$.ajax(
  dataType: 'jsonp',
  jsonp: 'jsonp_callback',
  url: 'http://myotherserver.com/getdata',
  success: function () 
    // do stuff
  ,
);

更多信息请点击此处：What is JSONP?

【讨论】：

不错！我会继续测试这个。除了我认为 echo 语句应该打印 $json 变量，而不是 $data。对吗？ @PHP_Jedi：那是正确的。我刚刚更正了那个错字（令人尴尬的是，这个错字已经存在 2 年了）。 请注意，JSONP 会向任何网站打开您的服务器。如果使用的数据是像谷歌地图这样的公开数据，那很好，但如果数据是用户登录后使用的数据，JSONP 不提供跨域保护，HTTP_REFERER 也无济于事（因为 Flash 可用于欺骗 REFERER ）。制作窃取用户数据或修改其帐户的恶意页面很容易。如果数据敏感，请使用允许您控制来源的东西，例如 flxhr。【参考方案3】：

您也可以使用 CORS 代替 JSONP，适用于 ff、chrome、safari。 CORS 设置起来不那么麻烦，并且只需要在服务器端有一个过滤器。

请仔细阅读这篇文章。解释得很好，类似。 唯一的限制是IE不支持这个和旧版本的FF，chrome也有一些问题。

http://techblog.constantcontact.com/software-development/using-cors-for-cross-domain-ajax-requests/

【讨论】：

你能描述一下如何在你的答案中使用它吗？

以上是关于使用 jQuery 的跨站 AJAX的主要内容，如果未能解决你的问题，请参考以下文章

ios的跨站脚本限制

django的跨站请求访问

Asp.net环境中的跨站脚本攻击环境搭建与试验

ajax解决csrf的跨站请求伪造

PCI 合规性的资源/服务？修复“类别参数中的跨站脚本漏洞”漏洞？

jQuery中的ajaxjquery中ajax全局事件load实现页面无刷新局部加载ajax跨域请求jsonp利用formData对象向服务端异步发送二进制数据