逆向工程使用 Ext.Ajax.request 的跨域 POST 请求
Posted
技术标签:
【中文标题】逆向工程使用 Ext.Ajax.request 的跨域 POST 请求【英文标题】:Reverse engeering cross domain POST requests which use Ext.Ajax.request 【发布时间】:2011-09-29 14:20:50 【问题描述】:我正在使用一个脚本,该脚本似乎使用Ext.Ajax.request
(使用 ExtJS 3)来发送跨域请求 - 其中一些是 POST 请求。正在考虑从 ExtJS3 移开(一般可能从 ExtJS 移开),但快速尝试使用 XMLHttpRequest
没有奏效;我怎样才能知道使用什么技术来发送这些跨域请求?
【问题讨论】:
【参考方案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']);
【讨论】:
以上是关于逆向工程使用 Ext.Ajax.request 的跨域 POST 请求的主要内容,如果未能解决你的问题,请参考以下文章
在 Chrome 中超时 Ext.Ajax.request 后未捕获的异常
Ext Js,Ext.Ajax.request 在移动设备上不起作用
ExtJS 4.2.1 模拟 Ext.Ajax.request