带有 IE9 的 Blueimp 文件上传器答案

【问题标题】：Blueimp file uploader with IE9带有 IE9 的 Blueimp 文件上传器
【发布时间】：2013-10-28 16:33:08
【问题描述】：

我正在使用 AngularJS 应用程序中的此插件将文件上传到 REST API。当 'fileuploaddone' 事件触发几秒钟后，我收到来自 Internet Explorer 的黄色通知：您想保存\打开

附上截图。

【问题讨论】：

标签： internet-explorer angularjs internet-explorer-9 blueimp ajax-upload

【解决方案1】：

基于 iframe 的上传要求 JSON 响应的内容类型为 text/plain 或 text/html - 如果 iframe 响应设置为 application/json，它们将显示不需要的下载对话框。

来源：https://github.com/blueimp/jQuery-File-Upload/wiki/Setup#content-type-negotiation

您需要按照上面链接中的说明设置正确的 Content-Type。

【讨论】：

是的，我自己已经搞定了，但既然这是正确的答案，也许其他人可以使用你的帖子。干杯！

【解决方案2】：

Blueimp jQuery 文件上传设置支持现代浏览器以及 IE9（在 IE9 和 Chrome 39 上测试）

注意：我在服务器端使用 JAVA，Spring 3

index.html 文件

<!doctype html>
<!--[if lt IE 9]>      <html class="lt-ie9"> <![endif]-->
<!--[if IE 9]>         <html class="ie9"> <![endif]-->
<!--[if gt IE 9]><!--> <html>         <!--<![endif]-->

     <head>....</head>
     <body>....</body>
</html>

test.js 文件

var options = {
    url: 'api/test/fileupload',
    maxFileSize: 10000000,
    formData: {
        id: 1
    }
};

if ($('html').hasClass('ie9') || $('html').hasClass('lt-ie9')) {
    options.forceIframeTransport = true;
} else {
    options.dataType = 'json';
}

$('#fileUploadInput').fileupload(options);

test.java 文件

@POST
@Path("/api/test/fileupload")
@Consumes(MediaType.MULTIPART_FORM_DATA)
@Produces({ "text/plain" })
public Response uploadFile(
        @Context HttpServletResponse response,
        @Context HttpServletRequest request,
        @FormDataParam("id") Long id,
        @FormDataParam("files[]") FormDataContentDisposition fileDetail,
        @FormDataParam("files[]") InputStream uploadedInputStream) {
    String header = request.getHeader("accept");
    String returnContentType = MediaType.APPLICATION_XML;
    VEWTestAttachment attObj = testMgr.saveAttachment(id,fileDetail,uploadedInputStream);
    if(header.indexOf(MediaType.APPLICATION_JSON) >= 0){
        returnContentType = MediaType.APPLICATION_JSON;
    }
    response.setContentType(returnContentType);
    return Response
            .ok(attObj,returnContentType)
            .build();
}

【讨论】：