javascript - 使用 blueimp jQuery 文件上传进行文件上传，在 IE9 中不起作用

Question

已经用jQuery-file-upload创建了上传功能，我的上传工作在Firefox、Chrome和IE版本9以上。

我尝试强制 iframe 传输，这是 jQuery-fileupload 插件文档推荐的。Fileupload 完成了他的任务，但他发送了一个空对象。因此，symfony 发送有关文件的错误。我的上传过程是这样的:Backbone.js + require.js -> symfony ->rackspace

                $(selector).fileupload({
                dataType: 'json',
                autoUpload: true,
                url: 'http://' + IM('site').get('domain') + '/' + window.PadawanSite.envPath + '/upload/adpost/img',
                forceIframeTransport: true,

                add: function (e, data) {
                    var id = e.target.id.substring(e.target.id.length - 2),
                        jqXHR = data.submit()
                            .success(function (result, textStatus, jqXHR) {
                                images.push({
                                    id: id,
                                    original: result.publicUrl.original,
                                    large   : result.publicUrl.large,
                                    medium  : result.publicUrl.medium,
                                    small   : result.publicUrl.small
                                });
                            })
                            .error(function (jqXHR, textStatus, errorThrown) {
                                $('#picture_callback_' + id).removeClass('glyph icon-spinner2 icon-refresh-animate').addClass('glyph-05 icon-x-empty');
                            })
                            .complete(function (result, textStatus, jqXHR) {
                                if (textStatus === "success") {
                                    var ad = IM('ad').toJSON();
                                    ad.images = images;
                                    IM('ad').clear().set(ad);
                                    IM('ad').save(ad);
                                    if (IM('ad').toJSON()) {
                                        $('#adpost_picture_img_' + id).attr("src", result.responseJSON.publicUrl.small);
                                        $('#picture_callback_' + id).removeClass('glyph icon-spinner2 icon-camera icon-x-empty icon-refresh-animate').addClass('glyph-05 icon-v');
                                        $('#adpost_picture_visualize').removeAttr('disabled');
                                    }
                                }
                            });
                    $('#adpost_picture_visualize').attr('disabled', 'disabled');
                    $('#picture_callback_' + id).removeClass('glyph-05 icon-camera icon-x-empty').addClass('glyph icon-spinner2');
                    $('#picture_callback_' + id).addClass('icon-refresh-animate');
                    $('#adpost_picture_name_' + id).empty();
                    $('#adpost_picture_name_' + id).append(data.files[0].name);
                }
            });

我的请求 header ，它发送到 symfony。但是你可以看到 content-length 等于 0。所以这就是问题所在，但他为什么要这样做呢？

X-Requested-With: XMLHttpRequest
Host: sjus.local
Request: POST /app_dev.php/upload/adpost/img HTTP/1.1
Cache-Control no-cache
User-Agent Mozilla/5.0 (Windows NT 6.1; Trident/7.0; rv:11.0) like Gecko
Connection Keep-Alive
Referer http://sjus.local/app_dev.php#postad/picture
Accept-Encoding gzip, deflate
Accept-Language en-us
Content-Length 0
Accept */*

Answer 1

当您像 plugin's documentation site says 那样进行跨域文件上传时，这是 IE8/9 上的已知限制。 .

我曾经遇到过这个问题，特别是当插件尝试从 iframe 检索响应时，我收到“权限被拒绝”错误，这是因为在我的情况下，该网站是与 api 位于同一域中的子域。所以我能够使用选项“initialIframeSrc”来指定要在 iframe 中使用的 document.domain(我很幸运)。我做了这样的事情:

dataType: 'text',
forceIframeTransport: true,
initialIframeSrc: "javascript:document.write('<script>document.domain=\"mydomain.com\";</script>')",

这样插件就能够从 iframe 内容中检索响应。

希望这有帮助。