如何使用sprimgMvc上传文件?

后端框架使用springMvc, 与前端页面进行交互 , 涉及到图片,文本等文件的上传功能 , 页面使用jsp页面

页面部分 , 使用表单提交 , 并要求后端返回json格式的数据, 这样可以获取后端处理信息, 以便于在页面进行信息提示 .

表单部分代码如下 :

<form id="pageListForm" class="form-horizontal" enctype="multipart/form-data">
              <div class="box-body">
              
                <div class="form-group">
                  <label for="inputEmail3" class="col-sm-2 control-label">邮箱</label>
                  <div class="col-sm-10">
                    <input type="text" class="form-control" name="t_email" style="width: 450px">
                  </div>
                </div>
                <div class="form-group">
                  <label for="inputEmail3" class="col-sm-2 control-label">用户名</label>
                  <div class="col-sm-10">
                    <input type="text" class="form-control" name="t_userName" style="width: 450px">
                  </div>
                </div>
                
                <div class="form-group">
                  <label for="inputEmail3" class="col-sm-2 control-label">头像</label>
                  <div class="col-sm-10">
                    <input type="file" οnchange="PreviewheadImage(this);" name="headImg" style="width: 350px;height: 35px">
                  </div>
                </div>
                <div class="form-group">
                  <label for="inputPassword3" class="col-sm-2 control-label">头像预览</label>
                  <div class="col-sm-10">
                     <img id="headImg" alt="" src="" style="width: 300px;height: 200px">
                  </div>
                </div>
                
                
                <div class="form-group">
                  <label for="inputEmail3" class="col-sm-2 control-label">背景图</label>
                  <div class="col-sm-10">
                    <input type="file" οnchange="PreviewbackgroundImage(this);" name="backgroundImg" style="width: 350px;height: 35px">
                  </div>
                </div>
                <div class="form-group">
                  <label for="inputPassword3" class="col-sm-2 control-label">背景图预览</label>
                  <div class="col-sm-10">
                     <img id="backgroundImg" alt="" src="" style="width: 300px;height: 200px">
                  </div>
                </div>
                
              </div>
              
              <!-- /.box-body -->
              <div class="box-footer">
                <button type="button" class="btn btn-default">取消</button>
                <button type="button" οnclick="saveTeacher();" class="btn btn-info">确定</button>
              </div>
              <!-- /.box-footer -->
    </form>

注意部分 :

1 , 该form表单 要设置 enctype="multipart/form-data" , 为什么要设置这个?

2, 如果<button> 直接设置为submit, 则该表单直接提交到后端, 后端处理结果如何返回给前端,告诉用户操作是成功还是失败 ?

3, 如何提交form表单 , 能让后端返回json格式的数据 ?

方案如下 :

  //保存轮播图
  function saveTeacher(){
	  
	  var formData = new FormData($("#pageListForm")[0]);
	  
	  $.ajax({
			url : "${ctx}/platform/saveTeacherInformation.do",
			type : 'POST',
			data : formData,
			async : false,
			cache : false,
			contentType : false,
			processData : false,
			success : function(data) {
				showMessageDialog(data.msg);
			},
			error : function(data) {
				showMessageDialog("网络异常");
			}
	  });
  }

1, 什么是FormData ?

2, 通过new FormData 为什么可以将数据提交到后端 ?

后端 springMvc的控制器 接受前端请求

	/**
	 * 保存老师信息
	 * @param request
	 * @return
	 */
	@ResponseBody
	@RequestMapping("/saveTeacherInformation.do")
	public AjaxResult saveTeacherInformation(HttpServletRequest request,
				@RequestParam("headImg") MultipartFile headImgFile,
				@RequestParam("backgroundImg") MultipartFile backgroundImgFile){
		AjaxResult saveTeacherInformation = null ;
		try {
			saveTeacherInformation = teacherService.saveTeacherInformation(request,headImgFile,backgroundImgFile);
		} catch (Exception e) {
			e.printStackTrace();
			return AjaxResult.errorResult("保存失败");
		}
		return saveTeacherInformation;
	}

1, 通过 @RequeatParam("属性名" ) MultipartFile file , 接受前端传递相应属性名的File文件 , 格式为 MultipartFile

2 , MultipartFile 是什么格式的文件 ? 与 File 有什么区别 ?

3, 如何操作这个MultipartFile , 将文件保存到服务器上 ?

运行报错  :

  Expected MultipartHttpServletRequest: is a MultipartResolver configured?

翻译 : 这是是一个multipartresolver配置吗 ?  意思是不是multipartresolver 配置 , 为什么?

springMvc上传文件 需要配置 :

	<!-- springMvc上传文件 -->
	<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
  
		<property name="maxUploadSize" value="500000000000"/>
	</bean>

1,  需要引入jar包 : commons-fileupload-X.X.jar

2, 配置这个是做什么的 ?

可见 , 我有很多的困惑