jquery ajax 上传文件和传递参数到一个接口的实现方法
2023-09-27 14:25:37 时间
参考: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与angular的交互
- jquery条件选择多个元素(与、或者)
- html文件中jquery与velocity变量中的$冲突的解决方法
- jQuery Ajax 上传文件改进
- 用jquery控制表单提交
- js获取网页的url文件名( 例如index.aspx),js获取url的参数(例如获取 ?cid=joeylee的值),给jquery拓展方法
- JQuery通过radio,select改变隐藏显示div
- jquery如何获取第一个或最后一个子元素?
- 利用 jQuery 操作页面元素的方法,实现电商网站购物车页面商品数量的增加和减少操作,要求单项价格和总价随着数量的改变而改变
- jQuery.holdReady()方法用法实例
- jQuery.getJSON的缓存问题的解决办法
- Jquery ajaxfileupload.js结合.ashx文件实现无刷新上传
- Jquery+Json+Handler文件结合应用实例
- 基于jQuery发展历程时间轴特效代码
- 基于jQuery功能非常强大的图片裁剪插件
- jquery如何实现点击LI标签和下面的LI互换顺序? 超简单代码
- 【jquery ajax】实现文件上传提交
- JQuery中$.load()方法的用法和分析【转】
- Jquery 超炫的导航效果