使用blueimp(jQuery文件上传)调试IE问题

3

我正在使用blueimp和user_dirs(基于会话的上传目录)进行工作。

在Firefox、Chrome、Safari等浏览器中,当上传完成后,我可以看到缩略图出现。

但是,在IE 9中,上传完成后我看到“错误SyntaxError:Invalid character”。IE开发面板没有显示任何错误。而且...如果我刷新页面,缩略图就会出现,上传也已成功。

在IE 8中,情况相同,但我会得到“错误[object Error]”,如果刷新,我会看到上传已成功,缩略图也已出现并链接。

如果我使用Chrome查看接收到的JSON数据,会看到像这样的条目:

{
    "files": [{
        "name": "us (1).jpg",
        "size": 40294,
        "type": "image\/jpeg",
        "url": "http:\/\/upload.mysite.com\/uploads\/9cb5b4df96928f247b5bce2d4ed8a300\/us%20%281%29.jpg",
        "thumbnail_url": "http:\/\/upload.mysite.com\/uploads\/9cb5b4df96928f247b5bce2d4ed8a300\/thumbnail\/us%20%281%29.jpg",
        "delete_url": "http:\/\/upload.mysite.com\/blueimp\/server\/php\/?file=us%20%281%29.jpg",
        "delete_type": "DELETE"
    }]
}

我下一步该如何调试?有办法在IE的开发面板中访问实际错误吗?

// 5.29 12:27 CST 更新

当使用IE时,在main.js中/cors/result.html会收到404错误:

$('#fileupload').fileupload(
        'option',
        'redirect',
        window.location.href.replace(
            /\/[^\/]*$/,
            '/cors/result.html?%s'
        )
    );

当更新为正确的路径时:

$('#fileupload').fileupload(
        'option',
        'redirect',
        window.location.href.replace(
            /\/[^\/]*$/,
            '/blueimp/cors/result.html?%s'
        )
    );

现在我收到了“错误的空文件上传结果”的提示,但是刷新后显示上传已成功...

发现另一个404文件:jquery.xdr-transport.js

纠正路径,现在一切都好了。

// 更新结束


1
在IE中,您可以尝试使用F12网络选项卡并开始捕获以查看实际的请求/响应(如果您还没有这样做)。将内容类型和长度以及数据的实际编码与Chrome中的内容进行比较,并查看是否可以发现任何明显的差异? - Klors
1
哎呀!这是一个艰难的教训——我不知怎么错过了IE 9在开发面板上有一个网络选项卡。只有在IE上才发现jquery.xdr-transport.js出现404错误。 - jerrygarciuh
请将您的答案添加为答案!你得到了五十分。非常感谢您的教训。 - jerrygarciuh
3个回答

9

如果你还没有尝试过,在IE浏览器中,你可以尝试使用F12的网络选项卡并点击开始捕获,以查看实际的请求/响应情况。比较内容类型和长度的头信息以及数据的实际编码,与Chrome的相应信息进行比较,看看是否能发现明显的差异?


它的意思是“您可以在22个小时后授予奖励。”我会将其添加到明天的日历中。再次感谢! - jerrygarciuh

1

上传时出现404响应的另一个原因是由于接收已发布文件的应用程序设置了请求长度。


1
我的解决方法是将“cors”文件夹上传到网站。该文件夹包含postmessage.html和result.html文件。 在IE 9中使用检查器后,可以发现IE 9使用result.html通过GET接收服务器的上传响应。由于我没有将这个文件夹包含在我的服务器文件中,所以只有在IE 9中才会出现这个问题。通过分析服务器错误日志并阅读IE 9检查器中的404消息,我找到了这个解决方案。

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接