参考:https://blog.csdn.net/qq_15674631/article/details/81095284

参考:https://www.jianshu.com/p/46e6e03a0d53  (包含了上传多个文件的方法)

总结: ajax 如果想同时发送文件和参数,那就必须用 formData 封装,如果想接收单个参数,直接key:value的形式写到data:{}里或者用formData append都可以,后端springmvc接收直接用 String xxx , int xxx ,这样接收就行了,不过参数如果多了最好用bean封装

<input type="file" id="newTemplateFileId" >
var formData = new FormData();
formData.append('file', $('#newTemplateFileId')[0].files[0]);
formData.append('templatename', $('#newTemplateNameId').val());
formData.append('systype', templateName);
formData.append('templatetype', templatetype);
formData.append('templatejson', templateJsonContent);
$.ajax({
// url:'/RM/views/test/statusJson.json',
url: '/RM/controller/json/ConfigTemplateController/saveMobanContentsAndUploadUserCustomScripts',
type: 'POST',
cache: false,
processData: false,
contentType: false,
data: formData,
success: function (response) {
if (response.status == "1") {
// $('#nextStepBtnId').attr('data-toggle','modal').attr('data-target','#myModal');
alert('保存成功')
}else if (response.status == "0") {
alert(response.msg);
}
}
})
@ResponseBody
@RequestMapping(value = "controller/json/ConfigTemplateController/saveMobanContentsAndUploadUserCustomScripts", method = RequestMethod.POST)
public BaseResult saveMobanContentsAndUploadUserCustomScripts(@Valid ConfigTemplateCustom configTemplateCustom, BindingResult result, @RequestParam(value = "file", required = false) MultipartFile file) throws IOException { if (result.hasErrors()) {
Map<String, Object> map = new HashMap<>();
List<FieldError> fieldErrors = result.getFieldErrors();
for (FieldError fieldError :
fieldErrors) {
map.put(fieldError.getField(), fieldError.getDefaultMessage());
}
return ResultUtil.error(303, "参数异常").add("errorFields", map);
} else { if (configTemplateCustom.getTemplatename() == null || configTemplateCustom.getTemplatename()=="" || configTemplateCustom.getTemplatename().isEmpty()) {
return ResultUtil.error(400, "请填写模板名");
} if (file == null || file.isEmpty()) {
return ResultUtil.error(400, "文件为空,请上传文件后再保存模板");
} // 文件类型分拣
int fileNameLength = file.getOriginalFilename().length();
String beHandFileName = new String(file.getOriginalFilename());
String beHandSuffixName = null;
String beHandedFileNameVbs = beHandFileName.substring(fileNameLength - 4, fileNameLength);
String beHandedFileNameSh = beHandFileName.substring(fileNameLength - 3, fileNameLength);
String beHandedFileNamePl = beHandFileName.substring(fileNameLength - 3, fileNameLength); if (!".sh".equals(beHandedFileNameSh) && !".pl".equals(beHandedFileNamePl)) {
return ResultUtil.error(400, "上传的脚本类型不匹配,当前只支持类unix系列的远程扫描,请上传后缀名为 .sh .pl 的脚本文件");
} if (configTemplateCustomService.checkTemplateName(configTemplateCustom)==false){
return ResultUtil.error(400, "模板名已被使用,请填写新的模板名");
}
ConfigTemplateCustom savedTemplateCustom = configTemplateCustomService.saveAfterFetchId(configTemplateCustom); // if (".vbs".equals(beHandedFileNameVbs)) {
// beHandSuffixName = ".vbs";
// } if (".sh".equals(beHandedFileNameSh)) {
beHandSuffixName = ".sh";
}
if (".pl".equals(beHandedFileNamePl)) {
beHandSuffixName = ".pl";
} File templateDir = new File("C:\\RM-ROOT\\upload\\userCustomScripts\\" + configTemplateCustom.getTemplatename());
templateDir.mkdir(); String path = "C:\\RM-ROOT\\upload\\userCustomScripts\\" + configTemplateCustom.getTemplatename();
String uploadedFileName = configTemplateCustom.getTemplatename() + beHandSuffixName; FileUtils.copyInputStreamToFile(file.getInputStream(), new File(path,
uploadedFileName)); return ResultUtil.success().add("savedTemplateCustom", savedTemplateCustom); } }

jquery ajax 上传文件和传递参数到一个接口的实现方法的更多相关文章

  1. IE8/9 JQuery.Ajax 上传文件无效

    IE8/9 JQuery.Ajax 上传文件有两个限制: 使用 JQuery.Ajax 无法上传文件(因为无法使用 FormData,FormData 是 HTML5 的一个特性,IE8/9 不支持) ...

  2. jQuery ajax上传文件实例

    jQuery ajax上传文件实例 <form id="form" enctype="multipart/form-data"><input ...

  3. flask jQuery ajax 上传文件

    1.html 代码 <div> <form id="uploadForm" enctype="multipart/form-data" > ...

  4. jquery ajax 上传文件

    html:<!-- /.tab-pane --> <div class="tab-pane" id="head_portrait"> & ...

  5. ASP.NET Jquery+ajax上传文件(带进度条)

    效果图 支持ie6+,chrome,ie6中文文件名会显示乱码. 上传时候会显示进度条. 需要jquery.uploadify.js插件,稍后会给出下载 前台代码 <%@ Page Langua ...

  6. jQuery Ajax 上传文件改进

    如果用户取消上传后 背景 提示自动消失了.... 修正Bug.... 同时也更新了不同上传类型的提示字体大小... 2017-05-26 增加了鼠标释放提示 先看之前的效果: 再看现在的效果: 升级 ...

  7. jQuery Ajax 上传文件夹及文件

    我们先来看一下文件夹结构 这是上传处理的: 看一下系统日志: 升级 HTML5文件实现拖拽上传提示效果改进(支持三种状态提示) 拖拽过程详解: 1:文件未拖出文件选择框的时候提示:将要上传的文件或文件 ...

  8. asp.net 中使用JQuery Ajax 上传文件

    首先创建一个网页,网页中添加如下代码. <h3>Upload File using Jquery AJAX in Asp.net</h3> <table> < ...

  9. jQuery Ajax上传文件

    JS代码: //保存 function btnAdd() { var formData = new FormData($("#frm")[0]); $.ajax({ url: &q ...

随机推荐

  1. Loadrunner11代理录制&各个常见功能介绍

    1.代理录制: Lr代理工具:C:\Program Files (x86)\HP\LoadRunner\bin\wplus_init_wsock.exe 1) 设置代理 配置代理信息: 2)设置浏览器 ...

  2. windows下npm安装vue

    一.使用之前,我们先来掌握3个东西是用来干什么的. npm: Nodejs下的包管理器. webpack: 它主要的用途是通过CommonJS的语法把所有浏览器端需要发布的静态资源做相应的准备,比如资 ...

  3. September 23rd 2017 Week 38th Saturday

    Lonely people will always remember his life occurred in each person. 寂寞的人总是会用心记住他生命中出现过的每个人. If you ...

  4. django中session的存储位置

    django-session 存放位置 设置session的保存位置,有三种方法: 保存在关系数据库(db) 保存在缓存数据库(cache) 或者 关系+缓存数据库(cache_db) 保存在文件系统 ...

  5. Linux常用命令笔记总结(待补充)

    问题实际场景:遇到告警磁盘利用率不足,检查根目录下各文件大小 Linux查看磁盘利用率 df –h 查找磁盘占用情况 find / -size +100M 从根目录往下找大于100M大小的文件 du ...

  6. JVM 调优参数详解

    GC有两种类型:Scavenge GC 和Full GC 1.Scavenge GC 一般情况下,当新对象生成,并且在Eden申请空间失败时,就会触发Scavenge GC,堆的Eden区域进行GC, ...

  7. 谷歌希望让 Swift 成为安卓的优先选择,以取代由 Oracle 开发的 Java 程序语言。

    http://news.coolban.com/Web/Index/land/app/2/id/405239

  8. P3694 邦邦的大合唱站队

    题目背景 BanG Dream!里的所有偶像乐队要一起大合唱,不过在排队上出了一些问题. 题目描述 N个偶像排成一列,他们来自M个不同的乐队.每个团队至少有一个偶像. 现在要求重新安排队列,使来自同一 ...

  9. 20155314 2016-2017-2 《Java程序设计》第4周学习总结

    20155314 2016-2017-2 <Java程序设计>第4周学习总结 教材学习内容总结 理解封装.继承.多态的关系 理解抽象类与接口的区别 掌握S.O.L.I.D原则 了解模式和设 ...

  10. 20145203盖泽双 《Java程序设计》第8周学习总结

    20145203盖泽双 <Java程序设计>第8周学习总结 教材学习内容总结 1.java.util.logging包提供了日志功能相关类与接口,使用日志的起点是logger类,Logge ...