ExtJS文件上传报错：Ext.Error: You're trying to decode an invalid JS_H5之家

在写一个基于ExtJS、Spring MVC的文件上传组件的时候老是发现报错：Ext.Error: You're trying to decode an invalid JSON String:<pre>...</pre>。前端ExtJS用到的是Ext.form.field.File这个文件上传组件，使用官方提供的简单例子发现也会报错：

Ext.create('Ext.form.Panel', { title: 'Upload a Photo', width: 400, bodyPadding: 10, frame: true, renderTo: Ext.getBody(), items: [{ xtype: 'filefield', name: 'photo', fieldLabel: 'Photo', labelWidth: 50, msgTarget: 'side', allowBlank: false, anchor: '100%', buttonText: 'Select Photo...' }], buttons: [{ text: 'Upload', handler: function() { var form = this.up('form').getForm(); if(form.isValid()){ form.submit({ url: 'photo-upload.php', waitMsg: 'Uploading your photo...', success: function(fp, o) { Ext.Msg.alert('Success', 'Your photo "' + o.result.file + '" has been uploaded.'); } }); } } }] });

上面是一个简单的官方提供的例子，上传时报错信息如下：

上传报错信息

图1：上传报错信息

可以看到，其实返回的json字符串都是正常的，只是ExtJS莫名其妙的给加上了<pre></pre>标签，导致无法解析字符串，最终一直处于等待状态。

后来发现是由于后端返回的内容格式是application/json导致，将其改为text/html则正常。我是使用的Spring MVC，修改后的代码配置如下：

@RequestMapping(value = "/importCsv", produces = "text/html; charset=utf-8")

再次测试，正常。