如何解决jUploader插件IE8下无法上传图片的问题(前端如何修改contantType值)

肖生克的九叔_
  • 67

写一个需要上传图片的页面的时候,用到了jUploader插件,其他浏览器都是正常的。但是到了IE8下,发现了一个问题。上传图片变成了下载图片,相信大家应该也遇到过这个问题。我就不多做说明了。

clipboard.png

(ps:上图是用的网上别人的图,我的IE直接调了迅雷了。。)

这个问题究其根本,其实contantType的值导致的。

clipboard.png

这里的contantType如果是*/json格式的,在IE下就会默认下载这个文件,所以我需要将这个值改了。但是苦于不知应该如何改动这个值,现在想在后台不调整的情况下,将这个值改动一下。

希望大家能够提供一些思路。

因为用的是jUploader插件,所以js也就是按照他的写的。
请求代码如下:

    $.jUploader.setDefaults({
        cancelable: true, 
        allowedExtensions: ['jpg', 'png', 'gif'],
        messages: {
            upload: '上传',
            cancel: '取消',
            emptyFile: "{file} 为空,请选择一个文件.",
            invalidExtension: "只能上传后缀名是 {extensions} 的图片。",
            onLeave: "文件正在上传,如果你现在离开,上传将会被取消。"
        }
    });
    $.jUploader({
        fileField: 'file',
        button: "js_uploadPic", 
        action: url,
        dataType: 'json',
        // 开始上传事件
        onUpload: function(data) {
           ...
           somefunction();
           ....
        },
        // 上传完成事件
        onComplete: function(fileName, data) {
           ...
           somefunction();
           ....
        },
        showMessage: function(message) {
            alert(message);
        },
        onCancel: function(fileName) {},
            debug: true
    });

希望有人能够提供一些思路,让我可以在前端控制contantType的值。
或者提供一些别的思路,让我可以在IE下使用jUploader插件正常上传图片。 谢谢~

回复
阅读 2.5k
3 个回答

找服务端修改Content-Type,传输文本类型,在前端接收到转成JSON

Content-Type:text/plain
kakaguo
  • 137

最近刚好做了兼容ie的上传图片功能。一步一步着实踩了不少坑。

问题出现的原因是:ie无法解析回调里的json数据,就是说如果服务器返回json数据,ie会把它当做文件来处理,显示打开或保存。

解决方法是,在后端返回的时候自定义contype-type为"text/html",比如在node中这样写res.setHeader('Content-Type', 'text/html')。

这样改完之后,会发现,虽然现在不提示下载文件了,可是会直接跳转到新页面。不过新页面里确实拿到了回调的内容。

为了避免跳转到新页面,需要手动指定跳转的页面为一个iframe。然后取到iframe里的回调内容后,将相应内容从iframe里取出来使用。

response header是后端返回的header,前端只能获取,不能改写(或是能够改写但是已经万事休矣)。
楼主用的插件我也没有用过,但是这个问题可能是普遍存在的,一般都还是通过后端修改contantType来做,通过监听UA,识别IE版本。
已经不想再弄IE8及以下的了。。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
宣传栏