ExtJs上传中文文件名乱码，观察请求。
ExtJs6上传乱码从后台无法解决，因为文件名请求里面就已经乱码了，后台无法解码。
除非请求参数正确没有乱码，后台因为编码设置不一样，可以通过后台处理乱码
这里的思路使用ExtJs的Form隐藏域。
前端使用Base64加密，后台用Base64解密。
这里加密的时间很巧妙，发送请求前文件名并未乱码，把这个取出来用Base64加密（乱码的加密成Base64是徒劳的）
放入空的form里面，带给后台
/**
* @author cjy
* @Date 2018/6/5 9:47.
*/
Ext.define('Admin.view.eduQuestion.ExcelImportForm', {
extend: 'Ext.window.Window',
xtype: 'excelImportForm', title: '导入表格', requires: [
'Admin.view.eduQuestion.ExcelImportFormController',
'Ext.form.Panel',
'Ext.form.field.ComboBox',
'Ext.form.field.Text',
'Ext.form.field.TextArea',
'Ext.layout.container.Fit'
], layout: 'fit', modal: true,
height: 200,
width: 370, controller: 'excelImportForm', items: [{
flex: 1,
xtype: 'form',
reference: 'form',
modelValidation: true,
defaults: {
labelAlign: 'left',
margin: 10,
msgTarget: 'side'
},
items: [{
xtype: 'textfield',
hidden:true,
name:'fileName',
id:'fileName'
},{
xtype: 'filefield',
name: 'excelPath',
id:'excelPath',
fieldLabel: '表格',
labelWidth: 50,
msgTarget: 'side',
anchor: '100%',
accept: 'xls/xlsx',
buttonText: '选择Excel表格...',
validator: function (value) {
if(value==''){
return true;
}
var arr = value.split('.');
if (arr[arr.length - 1] == 'xls' || arr[arr.length - 1] == 'xlsx') {
return true;
} else {
return '必须选择xls或者xlsc格式的Excel！';
}
}
}]
}],
buttons: [{
text: '确定',
handler: 'editExcel'
}, {
text: '取消',
handler: 'closeWindow'
}]
});
在Controller.js里面对form进行操作，关键代码已标红
/**
* @author cjy
* @Date 2018/6/5 9:47.
*/
Ext.define('Admin.view.eduQuestion.ExcelImportFormController', {
extend: 'Admin.view.BaseViewController', alias: 'controller.excelImportForm', /**Excel上传
* @param {Ext.button.Button} component
* @param {Event} e
*/
editExcel: function () {
var me = this,
window = me.getView(),
form = window.down('form');
if (!form.isValid()) {
return false;
} var ff = Ext.getCmp('excelPath')
var ffv = ff.getValue('filename')
var index = ffv.lastIndexOf('\\')
var ffv = Ext.util.Base64.encode(ffv.substring(index+1,ffv.length))
Ext.getCmp('fileName').setValue(ffv);
if (window.action === 'uploadExcel') {
successMsg = '上传成功';
submitUrl=Common.Config.requestPath('EduQuestion', 'importExcelForEduQuestion');
} else {
Ext.Msg.alert('温馨提示', '表单操作错误，请联系管理员');
return;
}
form.submit({
//method : 'get',默认是post，指定没用
url: submitUrl,
waitMsg: '正在上传Excel并导入，请稍等...',
success: function(fp, o) {
Common.util.Util.toast(successMsg);
me.getView().close();
},
failure: function(form, action) {
Common.util.Util.toast(successMsg);
me.getView().close();
}
});
}, /**关闭 userWindow
* @param {Ext.button.Button} component
* @param {Event} e
*/
closeWindow: function () {
this.getView().close();
} });
后台接收，本来只用MultipartFile就可以接收到文件名和文件内容，现在需要两个参数，一个接收文件名，另一个接收文件内容
@RequestMapping(value = "/importExcelForEduQuestion")
@ResponseBody
//@RequiresPermissions("eduQuestionBank:importExcelForEduQuestion")
public Map<String,Object> importExcelForEduQuestion(@RequestParam("excelPath") MultipartFile file,@RequestParam("fileName") String fileName) throws IOException {
//如果文件不为空，写入上传路径
if(!file.isEmpty()) {
//上传文件路径
//上传文件名
BASE64Decoder decoder = new BASE64Decoder();
String filename = new String(decoder.decodeBuffer(fileName),"UTF-8");
FileToolUtil.ifCreateNewFile(UPLOADED_FILE_PATH,filename);
//将上传文件保存到一个目标文件当中
try {
file.transferTo(new File(UPLOADED_FILE_PATH + File.separator + filename));
} catch (IOException e) {
e.printStackTrace();
return ResultUtil.createFailResult("上传失败");
}
return ResultUtil.createSuccessResult();
} else {
return ResultUtil.createFailResult("上传文件为空");
}
}
补充文件FoolUtil里的方法
public static File createNewFile(String pathFileName) throws IOException {
File outFile = new File(pathFileName);
File parentFile = outFile.getParentFile();
if (!parentFile.exists()){
parentFile.mkdirs();//不存在则创建父目录
}
if(!outFile.exists()) {
outFile.createNewFile();
}
return outFile;
}