Extjs fileupload - 跨域框架

Question

我的 Extjs 应用程序中有一个文件上传字段。我尝试通过以下代码将文件加载到服务器:

var form = Ext.getCmp('ProcImpNewSugFileForm').getForm();
var fileNameStr = Ext.getCmp('ProcImpNewSugFileUpload').getValue().split("\\");
if(fileNameStr){
var filename = fileNameStr[fileNameStr.length-1];
if(form.isValid()){
    form.submit({
        url: '/PISRFileUploader.php',            
        waitMsg: 'Uploading your file...',                
        success: function (formPanel, action, result) {
            Ext.Msg.alert('Msg',"Success: "+action.response.responseText);
        },
        failure: function (formPanel, action, result) {
            Ext.Msg.alert('Msg',"Failure: "+action.response.responseText);
        }
    });
   }
}

但是当我尝试上传任何文件时。文件正在加载到服务器，但响应如下:

    Failure: {success:false,message:"Blocked a frame with origin 'http://localhost' from accessing a cross-origin frame."}

提前致谢!

Answer 1

这是 Uberdude 在 Sencha 论坛中发现的一个 Ext js 错误。

问题描述:

当您使用包含要上传的文件输入的表单发出 Ext.Ajax.request 时，或者手动将 isUpload 选项设置为 true，而不是执行正确的 Ajax 请求时，Ext 会以标准 HTML 方式将表单提交到动态生成隐藏 .然后从 iframe 中读取 json 响应正文以创建伪造的 Ajax 响应。如果发出上传 Ajax 请求的页面更改了其 document.domain 属性，就会出现问题，例如home.example.com 的页面包含来自 static.example.com 的资源，它希望使用 javascript 对其进行操作，而不违反浏览器的同源策略，因此两者都将其 document.domain 设置为“example.com”。如果 home.example.com 然后向 home.example.com 服务器上的 URL 发出上传 Ajax 请求，则写入响应的 iframe 的 document.domain 将为“home.example.com”。因此，当 home.example.com 页面上的 Ajax.request 中的 ExtJS 代码尝试从 iframe 中提取文档正文时，它将被同源策略阻止，并且传递给回调函数的响应将错误地为空响应文本。

解决方法: 1. 发出上传请求时将 document.domain 传递给服务器。 2. 在服务器响应中，在响应文本/html 中添加 document.domain。

response.setHeader('Content-Type', 'text/html'); response.write('document.domain = "' + params.__domain + '";'); response.write(JSON.stringify({msg: '欢迎' + params.name})); 响应.end('');

详细信息:

请引用: http://www.sencha.com/forum/showthread.php?136092-Response-lost-from-upload-Ajax-request-to-iframe-if-document.domain-changed