逆向工程使用 Ext.Ajax.request 的跨域 POST 请求答案

【问题标题】：Reverse engeering cross domain POST requests which use Ext.Ajax.request逆向工程使用 Ext.Ajax.request 的跨域 POST 请求
【发布时间】：2011-09-29 14:20:50
【问题描述】：

我正在使用一个脚本，该脚本似乎使用Ext.Ajax.request（使用 ExtJS 3）来发送跨域请求 - 其中一些是 POST 请求。正在考虑从 ExtJS3 移开（一般可能从 ExtJS 移开），但快速尝试使用 XMLHttpRequest 没有奏效；我怎样才能知道使用什么技术来发送这些跨域请求？

【问题讨论】：

标签： ajax cross-domain extjs3

【解决方案1】：

我目前正在使用 ExtJS 3.3.1，我还没有切换到 4，但很可能会在新项目出现时。无需查看 Ext 源代码，我可以告诉您他们正在使用 JSONP 来完成此任务，这是进行跨域 AJAX 调用的唯一方法，因为 JavaScript 必须遵守 same-origin policy。

您是否正在尝试对 JSONP 进行纯 JS 实现？还是您已经在使用 JS 库？

编辑

根据我们的 cmets... 他们正在发出 POST 请求。 JSONP 无法做到这一点。据我所知，他们正在使用 iframe 类似的诡计。这与在旧浏览器上用于“AJAX”上传文件的技巧相同。

This 链接更详细地解释了它。

此外，Valum's file uploader 中使用了相同的方法（iframe 到、POST、上传文件）。它比 ExtJS 源代码更容易理解。

【讨论】：

但是你可以使用 JSONP 发送 POST 请求吗？我正在查看 Firebug 中的网络活动，并且页面正在发送跨域 POST 请求
现在你让我好奇......我假设 JSONP 只能发送 GET 请求。我要去挖了。
没有详细阅读这篇文章...但是没有提到Ext.Ajax.request；它更多的是关于表单提交。不过，我会看看。

【解决方案2】：

Ext JS 3.4 online documentation 将为您提供Ext.Ajax 类继承模型，可用于跟踪与Ext.Ajax.request 方法调用相关的源代码。但是，与其花费更多的时间和资源来重新创建轮子，我建议通过 proxy 配置选项将原生 Ext JS Ext.data.ScriptTagProxy 类实现到您现有的商店中，以方便您的跨域请求远程商店。下面是我所指内容的缩略示例。

示例

var myJsonStore = new Ext.data.JsonStore
({
    autoLoad : true,
    proxy : new Ext.data.ScriptTagProxy
    ({
        url : 'http://www.cross-domain.com/file.php'
    }),
    fields : ['myIdColumn','myCharColumn','myDateColumn']
});

添加

因为您打算不再使用 Ext JS，请查看 ACD (AJAX Cross Domain) 库。

【讨论】：

但是我打算放弃使用 ExtJS...这不是建议继续使用 ExtJS 吗？
不一定。我试图建议您首先使用 Ext JS 3.4 在线文档查看Ext.Ajax 类继承模型及其底层request 方法逻辑。通过从那里开始并理解继承层次结构，您应该能够轻松地向上遍历树，识别和查看超类方法和负责促进跨域请求的逻辑。我的示例可能被误解了，但旨在暗示特定的 Ext.data.ScriptTagProxy 类，您可能会在其中找到所需的内容。
请查看我添加的提供跨域支持的非常简单和轻量级的 JavaScript AJAX 库。如果您打算编写一个本土解决方案，您可以使用库本身，或者源代码作为参考。

【解决方案3】：

JSONP 有点小技巧，但可以使用。

但是，如果您控制跨域，请考虑使用 CORS。 CORS 涉及在来自网站的响应中放置一个标头（Access-Control-Allow-Origin）：http://enable-cors.org/

IE 8+（带有警告，natch）、Firefox 和 WebKit 浏览器都支持它。 IE 警告是这样的：IE 对 CORS 请求使用不同的请求对象 (XDomainRequest)。如果您必须支持 Opera，则需要使用 JSONP 或 polyfill（类似于https://github.com/gimite/web-socket-js/，需要 Flash）。

如果您无法控制相关域，可以尝试让他们支持 CORS。

【讨论】：

【解决方案4】：

你可以尝试使用jsonp jQuery 示例：

$.ajax({
  url: "test.php",
  dataType: "jsonp"
  success: function(data){
     console.log(data)
  }
});

或者，如果您有权访问请求的内容，则可以设置 Access-Control-Allow-Origin 标头。 PHP 示例：

header('Access-Control-Allow-Origin: '.$_SERVER['HTTP_ORIGIN']);

【讨论】：