ng-file-upload结合springMVC使用

  引入angular和ng-file-upload。

  前端代码

 1 Upload.upload({
 2         url: 'upload',
 3         fields: {'username': 'zouroto'}, // additional data to send
 4         file: file
 5     }).progress(function (evt) {
 6         var progressPercentage = parseInt(100.0 * evt.loaded / evt.total);
 7         console.log('progress: ' + progressPercentage + '% ' + evt.config.file.name);
 8     }).success(function (data, status, headers, config) {
 9         console.log('file ' + config.file.name + 'uploaded. Response: ' + data);
10     });

  springMVC代码:

 1 @Controller
 2 public class UiController {
 3 
 4     @ResponseStatus(HttpStatus.OK)
 5     @RequestMapping(value = "/upload")
 6     public void upload(@RequestParam("file") MultipartFile file, @RequestParam("username") String username ) throws IOException {
 7 
 8         byte[] bytes;
 9 
10         if (!file.isEmpty()) {
11              bytes = file.getBytes();
12             //store file in storage
13         }
14 
15         System.out.println(String.format("receive %s from %s", file.getOriginalFilename(), username));
16     }
17 
18 }

  application config

1 <bean id="multipartResolver"
2  class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
3     <property name="maxUploadSize" value="5000000"/>
4 </bean>

  maven

1 <dependency>
2         <groupId>commons-fileupload</groupId>
3         <artifactId>commons-fileupload</artifactId>
4         <version>1.3.1</version>
5     </dependency>

 

posted @ 2017-04-04 22:42  ngulc  阅读(765)  评论(0编辑  收藏  举报