通过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>　<i>诊所名称：</i>

                                <input type="text"  name="name" id="name"  >

                            </div>

                            <div>　<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();

                }

             

        }

    

    }