简短/通用版:
我正在开发一个应用程序,它(不幸的是,因为其他原因)在每个页面的顶部将document.domain
设置为“真实”域名的子字符串:对于像sub.app.local
这样的子域,document.domain = "app.local"
。我还动态创建一个iframe并将其添加到页面中。 iframe加载与父页面位于同一服务器上的文件。稍后,一些Javascript需要访问iframe的contentDocument
属性。
这在现代浏览器中没有问题,但由于此bug,它会在IE9中出现问题。 (请参见顶部答案以获得有关此的良好解释。)据我所知,新于IE9的所有浏览器都会自动继承通过编程方式创建的iframes的document.domain
,因此这是IE9特定的。由于我的方案具有某些独特要求(tldr:iframe src需要更改),因此上述帖子中的答案对我无效。
较长/针对应用程序的版本:
我正在使用FineUploader在运行在IIS上的应用程序中,将文件上传到S3。在现代浏览器中一切正常,但即使在按照文档(支持IE9和更早版本)配置iframeSupport.localBlankPagePath
选项后,IE9支持也会给我带来麻烦。我有点困惑!
- 我已经在FineUploader 4.0.3和5.0.3上尝试过。
- 在IE11中一切正常。如果我在F12控制台中切换文档模式为9,它就会出问题。
- 我没有打开CORS支持,因为我没有从不同的域加载任何内容。
- 我在与我的页面相同的域上有一个虚拟/空白文件。
- 我可以看到(在网络面板中)来自AWS的HTTP 303响应,其中包括
Location
键和指向我的空白文档的值。如果我将整个URL粘贴到地址栏中,则页面会正常加载且为空白。 - 我尝试添加
X-Frame-Options SAMEORIGIN
到服务器的响应标头,如此处所建议的那样,但没有帮助。
我在控制台中收到的错误是:
[Fine Uploader 5.0.3] Error when attempting to access iframe during handling of upload response (Access is denied.
)
[Fine Uploader 5.0.3] Amazon likely rejected the upload request
更新
我已经确定,它不能直接使用的原因是应用程序在页面加载时设置了document.domain
,并且它与(子集)location.host
不同。 FineUploader的303重定向机制到空白页面运行正常,但iframe的document.domain
与父级不同(由于IE9不继承该属性),因此访问被拒绝。
实际的S3上传是有效的。 只是验证上传的最后一步失败了。
这是我的客户端代码:
FineUploader.js
var fu = namespace('App.FineUploader');
fu.DocId;
fu.ClientDeployId;
fu.viewModel;
fu.defaultAttachmentEndpoint = "https://s3.amazonaws.com/App.UploadBucket";
fu.FineUploaderController = "FineUploaderDocAttachment";
fu.delete = function (documentAttatchmentID, attachmentID) {
var data = documentAttatchmentID;
$.ajax({
type: "POST",
url: App.BaseUrl + "/api/" + fu.FineUploaderController + "/delete",
data: JSON.stringify(data),
success: function () {
$('#fineUploader' + attachmentID).fineUploader('reset');
$('#fineUploader' + attachmentID).show();
$('#aDownloadfineUploader' + attachmentID).html('');
$('#aDownloadfineUploader' + attachmentID).hide();
$('#aDeletefineUploader' + attachmentID).hide();
},
dataType: 'json',
contentType: 'application/json'
})
}
fu.lockAll = function () {
$('.fineUploader').hide();
$('a[id^="aDeletefineUploader"]').hide();
}
fu.init = function (sID) {
$('#' + sID).fineUploaderS3({
request: {
endpoint: fu.defaultAttachmentEndpoint,
accessKey: "[key]",
params: {
documentid: $('#' + sID).attr('documentid'),
attachmentid: $('#' + sID).attr('attachmentid')
}
},
signature: {
endpoint: App.BaseUrl + "/api/" + fu.FineUploaderController + "/signtureHandler"
},
uploadSuccess: {
endpoint: App.BaseUrl + "/api/" + fu.FineUploaderController + "/success"
},
iframeSupport: {
localBlankPagePath: App.BaseUrl + "/Scripts/FineUploader/4.0.3/html/blank.html"
},
objectProperties: {
key: function (fileId) {
var keyRetrieval = new qq.Promise(),
filename = $('#' + sID).fineUploader("getName", fileId);
var documentid = $('#' + sID).attr('documentid');
var attachmentid = $('#' + sID).attr('attachmentid');
var data = { name: filename, documentId: documentid, attachmentId: attachmentid }
$.ajax({
type: "POST",
url: App.BaseUrl + "/api/" + fu.FineUploaderController + "/preUpload",
data: JSON.stringify(data),
success: null,
dataType: 'json',
contentType: 'application/json'
}).done(function (data) {
keyRetrieval.success(data.key);
}).fail(function () {
keyRetrieval.failure();
});
return keyRetrieval;
}
},
validation: {
itemLimit: 1
},
chunking: {
enabled: true
}
}).on('error', function (event, id, name, errorReason, xhrOrXdr) {
alert(qq.format("Error on file number {} - {}. Reason: {}", id, name, errorReason));
}).on('complete', function (event, id, name, response) {
if (fu.FineUploaderController === "FineUploaderDocLibraryAttachment") {
$('#' + sID).fineUploader('reset');
App.Contracts.Create.ReloadImageLibraryList(true);
App.Contracts.Create.HideLoader();
} else {
$('#aDownload' + sID).attr('href', response.url);
$('#aDownload' + sID).html(response.name);
$('#aDownload' + sID).show();
$('#aDelete' + sID).show();
$('#aDelete' + sID).attr('onclick', 'App.FineUploader.delete(' + response.daId + ',' + sID.replace('fineUploader', '') + ');');
$('#' + sID).hide();
}
}).on('submitted', function () {
if (fu.FineUploaderController === "FineUploaderDocLibraryAttachment") {
App.Contracts.Create.ShowLoader();
}
});
}
content-type
也是text/html
。 - Mark Feltner