冠亚体育手机网站:SpringMVC文件上传功能实例解析

说明:

文本上传的门路

  文件上传主要有三种艺术:

  1.使用Apache Commons FileUpload元件。

  2.应用Servlet3.0及其越来越高版本的内置匡助。

客商端编制程序

  1.为了上传文件,必须将HTML表格的enctype属性值设为multipart/form-data,像下边那样:

<form action="action" enctype="multipart/form-data" method="post">
  Select a file<input type="file" name="fieldName"/>
  <input type="submit" value="Upload"/>
</form>

  2.在HTML5在此以前,假使要想上传三个文本,必得使用八个公文input成分。不过,在HTML5中,通过在input成分中引进多少个multiple属性,使得四个文本的上传变得尤为简明,上边均可使一个上传框协助八个公文上传。

<input type="file" name="fieldName" multiple/>
<input type="file" name="fieldName" multiple="multiple"/>
<input type="file" name="fieldName" multiple=""/>

MultipartFile接口

  在SpringMVC中拍卖已经上传的文本相当的粗略,上传到SpringMVC应用程序中的文件会被包在一个MultipartFile对象中,你唯黄金年代要做的政工正是用途目为MultipartFile的性子编写三个Domain类。犹如上边那样:

package domain;
import org.springframework.web.multipart.MultipartFile;
import java.io.Serializable;
import java.util.List;
public class Product implements Serializable {
  //实现了这个接口,可以安全的将数据保存到HttpSession中
  private long id;
  private String name;
  private String description;
  private String price;
  //在Domain类中加入MultipartFile类型的属性,用来保存上传的文件
  private List<MultipartFile> images;
  public List<MultipartFile> getImages() {
    return images;
  }
  public void setImages(List<MultipartFile> images) {
    this.images = images;
  }
  ......多个get和set方法。

  MultipartFile接口提供了以下办法:

Modifier and Type Method and Description
byte[] getBytes()Return the contents of the file as an array of bytes.
String getContentType()Return the content type of the file.
InputStream getInputStream()Return an InputStream to read the contents of the file from.
String getName()Return the name of the parameter in the multipart form.
String getOriginalFilename()Return the original filename in the client’s filesystem.
long getSize()Return the size of the file in bytes.
boolean isEmpty()Return whether the uploaded file is empty, that is, either no file hasbeen chosen in the multipart form or the chosen file has no content.
void transferTo(File dest)Transfer the received file to the given destination file.

实例:用CommonsFileUpLoad上传文件

导入Jar包及配置情状变量

冠亚体育手机网站 1

编写视图

代码:

<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
  <title>Add Product Form</title>
</head>
<body>
<form:form action="product_save" method="post" commandName="product" enctype="multipart/form-data">
  <fieldset>
    <legend>Add a Product</legend>
    <p>
      <label for="name">ProductName</label>
      <form:input type="text" id="name" name="name" tabindex="1" path="name"/>
    </p>
    <p>
      <label for="description">ProductDescription</label>
      <form:input type="text" id="description" name="description" tabindex="2" path="description"/>
    </p>
    <p>
      <label for="price">ProductPrice</label>
      <form:input type="text" id="price" name="price" tabindex="3" path="price"/>
    </p>
    <p>
      <label for="image">ProductImage</label>
      <input type="file" name="images[0]">
    </p>
    <p>
      <input type="reset">
      <input type="submit">
    </p>
  </fieldset>
</form:form>
</body>
</html>

说明:

  首先为了上传文件,必得将HTML表格的enctype属性值设为multipart/form-data
冠亚体育手机网站,  其次,在HTML5此前,假设要想上传多少个文本,必定要用到八个公文input成分。
  但是在HTML5,通过在Input成分中引进过个multiple属性,使得八个文件上传变得特别简明。

<input type="file" name="fieldName" multiple/>
<input type="file" name="fieldName" multiple="multiple"/>
<input type="file" name="fieldName" multiple=""/>

图示:

冠亚体育手机网站 2 

编写调节器

package controller;
import domain.Product;
import Service.ProductService;
import org.apache.commons.logging.Log;
import org.apache.commons.logging.LogFactory;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.validation.BindingResult;
import org.springframework.web.bind.annotation.ModelAttribute;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.multipart.MultipartFile;
import javax.servlet.http.HttpServletRequest;
import java.io.File;
import java.io.IOException;
import java.util.List;
@Controller
public class ProductController {
  private static final Log logger=LogFactory.getLog(ProductController.class);
  @Autowired
  private ProductService productService;
  @RequestMapping(value = "/product_input")
  public String inputProduct(Model model)
  {
    logger.info("inputProduct called");
    model.addAttribute("product",new Product());
    return "ProductForm";
  }
  @RequestMapping(value = "/product_save",method = RequestMethod.POST)
  public String saveProduct(HttpServletRequest servletRequest, @ModelAttribute Product product, 
BindingResult bindingResult,Model model)
  {
    List<MultipartFile> files= product.getImages();
    System.out.println("文件数量是"+files.size());
    if(null!=files&&files.size()>0)
    {
      for (MultipartFile file:files)
      {
        String fileName=file.getOriginalFilename(); //获得文件名称
        File imagFile = new File(servletRequest.getServletContext().getRealPath("/image"),fileName);try {
          file.transferTo(imagFile);//用于将文件写到服务器本地
        } catch (IOException e) {
          e.printStackTrace();
        }
      }
    }
    model.addAttribute("product",product);
    return "ProductDetails";
  }
  @RequestMapping(value = "/product_view/{id}")
  public String viewProduct(@PathVariable Long id,Model model)
  {
    Product product =productService.get(id);
    model.addAttribute("product",product);
    return "ProductDetails";
  }
}

铺排文件

  你可以见到我们在SpringMVC的布置文件中配置了五个名叫multipartResolver的Bean。

  基于servlet的multipartresolver实现Apache Commons FileUpload
1.2或以上。
  提供“maxuploadsize”、“maxinmemorysize”和“defaultencoding”设置bean的属性(继承commonsfileuploadsupport)

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xmlns:context="http://www.springframework.org/schema/context"
    xmlns:mvc="http://www.springframework.org/schema/mvc"
    xsi:schemaLocation="http://www.springframework.org/schema/beans 
http://www.springframework.org/schema/beans/spring-beans.xsd 
http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context.xsd
    http://www.springframework.org/schema/mvc
      http://www.springframework.org/schema/mvc/spring-mvc-3.0.xsd">
  <context:component-scan base-package="controller"/>
  <context:component-scan base-package="Service"/>
  <!--
   <mvc:annotation-driven>元素注册用于支持基于注解的控制器的请求处理方法的Bean对象。
    详解:https://my.oschina.net/HeliosFly/blog/205343
  -->
  <mvc:annotation-driven></mvc:annotation-driven>
  <bean id="viewResolver"
     class="org.springframework.web.servlet.view.InternalResourceViewResolver">
    <property name="prefix" value="/WEB-INF/view/"/>
    <property name="suffix" value=".jsp"/>
  </bean>
  <!--resources 元素指示SpringMVC那些静态资源需要单独处理-->
  <mvc:resources mapping="/image/**" location="/image/"/>
  <bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
    <property name="maxUploadSize" value="2000000"/>
  </bean>
</beans>

说明:

  resources
成分提醒SpringMVC那一个静态能源须要独自管理,此处大家要独立管理的是image,要是不单独管理而是通过dispatcher的话,就能发生404错误.

实例:用Servlet3及其更加高版本上传文件

说明:

  有了Servlet3,就没有需求Commons FileUpload 和康芒斯IO元器件了.因为在Servlet3中放置了上传文件的天性.
  幸运的是Domain类和Controller类基本不改变,大家唯有必要改进一下铺排文件。

配备文件:

修改Web.xml

  大家得以观看实际dispatcher的底工上增加了布置项:multipart-config

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
     xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
     xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"
     version="3.1">
  <context-param>
    <param-name>contextConfigLocation</param-name>
    <param-value>/WEB-INF/applicationContext.xml</param-value>
  </context-param>
  <listener>
    <listener-class>org.springframework.web.context.ContextLoaderListener</listener-class>
  </listener>
  <servlet>
    <servlet-name>dispatcher</servlet-name>
    <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
    <load-on-startup>1</load-on-startup>
    <multipart-config>
      <max-file-size>20848820</max-file-size>
      <!--上传内文件的最大容量-->
      <max-request-size>418018841</max-request-size>
      <!--表示多部分HTTP请求允许的最大容量-->
      <file-size-threshold>1048576</file-size-threshold>
      <!--超过这个容量将会被写到磁盘中-->
      <location>/image/</location>
      <!--要将已上传的文件保存到磁盘中的位置-->
    </multipart-config>
  </servlet>
  <servlet-mapping>
    <servlet-name>dispatcher</servlet-name>
    <url-pattern>/</url-pattern>
  </servlet-mapping>
  <!--Spring中文乱码拦截器-->
  <filter>
    <filter-name>setcharacter</filter-name>
    <filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>
    <init-param>
      <param-name>encoding</param-name>
      <param-value>UTF-8</param-value>
    </init-param>
  </filter>
  <filter-mapping>
    <filter-name>setcharacter</filter-name>
    <url-pattern>/*</url-pattern>
  </filter-mapping>
 </web-app>

SpringMVC配置文件添增添某个分析器

MultipartResolver接口的标准实现,基于Servlet 3.0部分API. To be added as "multipartResolver" bean to a Spring DispatcherServlet context, without any extra configuration at the bean level.
 <bean id="MultipartResolver" class="org.springframework.web.multipart.support.StandardServletMultipartResolver"></bean>

实例:为多文本上传增加二个进程条

说明:

  大家关怀的是HTML5
input成分的change事件,当input成分的值爆发变动时,他就能够被触发。其次,我们还关切XMLHttpRequest对象中增加progress事件。XMLHttpRequest自然是AJAX的骨子。当异步使用XMLHttpRequest对象上传文件的时候就能够四处地触发progress事件,直到上传进程实现可能裁撤。通过轻易监听progress事件,能够轻便地检查测验文件上传操作的进程。

编写Domain和Controller

1.Domain:UploadFile

package domain;
import org.springframework.web.multipart.MultipartFile;
import java.io.Serializable;
public class UploadFile implements Serializable {
  private MultipartFile multipartFile;
  public MultipartFile getMultipartFile() {
    return multipartFile;
  }
  public void setMultipartFile(MultipartFile multipartFile) {
    this.multipartFile = multipartFile;
  }
}

2.Controller:Html5FileUploadController类

package controller;
import domain.UploadFile;
import org.apache.commons.logging.Log;
import org.apache.commons.logging.LogFactory;
import org.springframework.stereotype.Controller;
import org.springframework.validation.BindingResult;
import org.springframework.web.bind.annotation.ModelAttribute;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.multipart.MultipartFile;
import javax.servlet.http.HttpServletRequest;
import java.io.File;
@Controller
public class Html5FileUploadController {
  private static final Log logger = LogFactory.getLog(Html5FileUploadController.class);
  @RequestMapping("/html5")
  public String inputProduct()
  {
    return "html5";
  }
  @RequestMapping("/file_upload")
  public void saveFile(HttpServletRequest servletRequest, @ModelAttribute UploadFile file, BindingResult result)
  {
    MultipartFile multipartFile =file.getMultipartFile();
    String filename =multipartFile.getOriginalFilename();
    try {
      File file1 = new File(servletRequest.getServletContext().getRealPath("/image"),filename);
      multipartFile.transferTo(file1);
      System.out.println("已经写人本地文件:"+file1.getName());
    } catch (Exception e) {
      e.printStackTrace();
    }
  }
}

编写HTML5页面

<%--
 Created by IntelliJ IDEA.
 User: zy
 Date: 17-3-8
 Time: 下午10:01
 To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
  <title>Title</title>
</head>
<body>
  <script>
    var totalFileLength,totalUploaded,fileCount,filesUploaded;
    function debug(s) { //输出调试信息
      var debug = document.getElementById('debug');
      if(debug)
      {
        debug.innerHTML =debug.innerHTML+'</br>'+s;
      }
    }
    function onUploadComplete(e) { //当一个文件上传完成,紧接着开始调用下次upLoadNext();
      totalUploaded+=document.getElementById('files').files[filesUploaded].size;
      filesUploaded++;
      debug('Complete'+filesUploaded+" of "+fileCount);
      debug('totalUploaded:'+totalUploaded);
      if(filesUploaded<fileCount)
      {
        upLoadNext();
      }
    }
    function onUploadFailed() {
      alert("Error uploading file");
    }
    function onUploadProgress(e) {//当进度发生改变时,改变进度条
      if(e.lengthComputable)
      {
        var percentComplete =parseInt((e.loaded+totalUploaded)*100/totalFileLength);
        var bar = document.getElementById("bar");
        bar.style.width=percentComplete+"%";
        bar.innerHTML =percentComplete+"% complete";
      }
      else
      {
        debug('unable to compute');
      }
    }
    function upLoadNext() { //将XMLHttpRequest对象的progress事件添加到onLoadProgress并将load事件和error事件分别绑定到对应方法。
      var xhr = new XMLHttpRequest();
      var fd =new FormData();
      var file =document.getElementById('files').files[filesUploaded];
      fd.append("multipartFile",file);
      xhr.upload.addEventListener("progress",onUploadProgress,false);
      xhr.addEventListener("load",onUploadComplete,false);
      xhr.addEventListener("error",onUploadFailed,false);
      xhr.open("POST","file_upload");
      debug('uploading'+file.name);
      xhr.send(fd);
    }
    function onFileSelect(e) { //当选择的文件发生改变时,重新获取并打印现在所选的文件信息
      var files =e.target.files;
      var output=[];
      fileCount =files.length;
      totalFileLength =0;
      for(var i=0;i<fileCount;i++)
      {
        var file =files[i];
        output.push(file.name,'(',file.size,'bytes',')',file.lastModifiedDate.toLocaleDateString());
        output.push("<br/>");
        debug('add'+file.size);
        totalFileLength+=file.size;
      }
      document.getElementById('selectedFiles').innerHTML = output.join('');
      debug('totalFileLength:'+totalFileLength);
    }
    function startUpload() { //当用户点击提交以后开始执行
      totalUploaded=filesUploaded=0;
      upLoadNext();
    }
    window.onload=function () {
      document.getElementById('files').addEventListener('change',onFileSelect,false);
      document.getElementById('upLoadButton').addEventListener('click',startUpload,false);
    }
  </script>
</body>
  <h1>Multipart File Uploads with Progress Bar</h1>
  <div id="bar" style="height:100px;background: #33dd33;width: 0%">
  </div>
<form>
  <input type="file" id="files" multiple>
  <br>
  <output id="selectedFiles"></output>
  <input id="upLoadButton" type="button" value="Upload">
</form>
<div id="debug" style="height: 100%;border: 2px solid green;overflow: auto">
</div>
</html>

说明:

  progressBar div用于体现上传进程,debug div用于展示调节和测验音信。

  实施脚本时,第风姿洒脱件事就是为4个变量分配空间:totalFileLength,totalUploaded,fileCount,filesUploaded;

  1. totalFileLength:首要用以保存上传文件的总长度。
  2. totalUploaded:提示近来早就上传的字节数。
  3. fileCount:包罗了要上传的文本数量。
  4. fileUploaded:提示了曾经上传的文书数量。

冠亚体育手机网站 3

以上所述是笔者给大家介绍的SpringMVC文件上传功效实例分析,希望对大家有着支持,假使我们有别的疑问请给自身留言,俺会及时还原大家的。在这也特别多谢我们对台本之家网址的扶持!

您可能感兴趣的作品:

  • SpringMVC+Ajax完结文件批量上传和下载功用实例代码
  • SpringMVC上传文件的三种情势
  • SpringMVC多少个公文上传及上传后立刻展现图片功用
  • SpringMVC完结公文上传和下载效用
  • SpringMVC
    单文件上传与多文本上传实例
  • SpringMVC上传文件的简短实例
  • SpringMVC落成文件的上传和下载实例代码
  • JavaEE开垦之SpringMVC中的自定义音讯转变器与公事上传
  • SpringMVC文件上传及查看的演示代码

Post Author: admin

发表评论

电子邮件地址不会被公开。 必填项已用*标注