通过formdata ajax上传图片 以及后台接收formdata数据 mvc

通过formdata ajax上传图片 以及后台接收formdata数据 mvc

版权声明：本文为博主原创文章，未经博主允许不得转载。

最近一直研究如何通过ajax上传图片看了好对用formdata来实现 但是关于springmvc后台如何接收formdata的数据一直没有介绍 今天把后台接收数据也写下来了 。

有点不完整  但是是能够实现的   相信有能看懂的  大家见谅  带有颜色的标记注意一下

                  <form class="inpform" id="uploadForm" enctype="multipart/form-data">
                        <div class="f-inp">
                            <div>&#12288;<i>诊所名称：</i>
                                <input type="text"  name="name" id="name"  >
                            </div>
                            <div>&#12288;<i>诊所地址：</i>
                                <input type="text"  name="addrInfo"  id="addrInfo" >
                            </div>
       
                            <h4>Logo</h4>  
                      <input type="file" id="file" name="file" />
                        </div>
                    </form>
       <input  type="button" value="提交" onclick="add();">

js如下

function add(){
     var formData = new FormData($("#uploadForm")[0]);//用form 表单直接 构造formData 对象; 就不需要下面的append 方法来为表单进行赋值了。 
     $.ajax({
         async: false,//要求同步 不是不需看你的需求
         url : "app/gexingSet.htmls",  
         type : 'POST',  
         data : formData,  
         processData : false,  //必须false才会避开jQuery对 formdata 的默认处理   
         contentType : false,  //必须false才会自动加上正确的Content-Type
         success : function(result) {  
                if(result==1){
                    forward=true;
                }else{
                    
                    $(".myModal-click").trigger("click");
                    forward=false;
                }
         },  
         error : function(result) {  
             $(".myModal-click").trigger("click");
                forward=false;
         }  
     });  
    
}

spring mvc 处

@Controller
@RequestMapping("/app")
public class ClinicController {

     @ResponseBody
    @RequestMapping("gexingSet.htmls")
    public int gexingSet1(
            @RequestParam(value = "file", required = false)MultipartFile file,
            String name, String addrInfo, HttpServletRequest request) {  //name和addrinfo是表单提交的数据 因为文件上传有可能带有其他参数   但是名字要与表单里的名字一样
        String fileName = file.getOriginalFilename(); //获取文件名
        if (!file.isEmpty()) {
            String path = “”;//写你的路径 这里不写了
            File targetFile1 = new File(path, fileName);
            OutputStream out;

InputStream in;             

  try {    
                    byte[] buf = file.getBytes();//文件二进制

         while ((length = in.read(buf)) != -1) {
                    out.write(buf, 0, length);
                }
                out.flush();
                in.close();
                out.close();
                } catch (IOException e) {
                    // TODO Auto-generated catch block
                    e.printStackTrace();
                }
             
        }
    
    }