如何使用springMVC Restful Service和jQuery上传文件

Question

I am developing an application with springMVC restful service as backend service and jQuery as front-end tech.

Now I have a requirement that files need to be uploaded by webservice to the server. I have no idea on how to write such a file uploading function. How should I send the file to the server by jQuery?

Thanks in advance.

Answer 1

I'm not sure what you are asking for, this is what i got from you

controller code like this

map.put("a", "/Student_Photos/sample.jpg");

in jsp write your stuff and include this

<form:form modelAttribute="uploadItem" action="add" name="student"
                method="post" enctype="multipart/form-data"
                onSubmit="return validate();">

              <td width="152"  rowspan="4"  ><img id="blah"
                        src="<c:url value="${a}"/>" alt="your image" width="130"
                        height="110" />

                    <form:input path="fileData" id="image" type="file"
                            onchange="readURL(this)" /></td>
              </form:form>

Answer 2

There are two main ways to do it in the browser:

1. For modern browsers, use the HTML5 File API. See https://developer.mozilla.org/en-US/docs/Using_files_from_web_applications

2. If you need to support old browser, you POST the file to a hidden iFrame. See http://viralpatel.net/blogs/ajax-style-file-uploading-using-hidden-iframe/

On the server side, I am going to assume you are using Spring Data REST (SDR) for your REST servlet. SDR doesn't do file uploads, but you can run SDR along with a regular Spring MVC Dispatcher Servlet in the same servlet.

The handler method in your MVC Dispatcher's FileController would look something like this, if saving to database:

@RequestMapping(value = "/files", method = RequestMethod.POST)
@ResponseStatus(HttpStatus.CREATED)
@ResponseBody
List<FileEntity> upload(@RequestParam("file") MultipartFile[] multipartFiles) throws Exception {

    List<FileEntity> response = new ArrayList<FileEntity>();

    for (MultipartFile multipartFile : multipartFiles) {

        FileEntity f = new FileEntity(multipartFile.getBytes(), multipartFile.getContentType(), multipartFile.getOriginalFilename());

        fileRepository.save(f);

        response.add(f);

    }

    return response;

}

You want SDR, Apache Commons FileUpload and IO on your classpath (or use the newer Servlet 3 API instead of Apache Commons). Add them as maven dependencies:

    <dependency>
        <groupId>commons-fileupload</groupId>
        <artifactId>commons-fileupload</artifactId>
        <version>1.3.1</version>
    </dependency>

    <dependency>
        <groupId>commons-io</groupId>
        <artifactId>commons-io</artifactId>
        <version>2.4</version>
    </dependency>

    <dependency>
        <groupId>org.springframework.data</groupId>
        <artifactId>spring-data-rest-webmvc</artifactId>
        <version>2.0.1.RELEASE</version>
    </dependency>