首页 > 编程 > Java > 正文

java实现多图片上传功能

2019-11-26 08:40:57
字体:
来源:转载
供稿:网友

本文实例为大家分享了java实现多图片上传功能的具体代码,供大家参考,具体内容如下

开发环境:jdk1.7,MyEclipse10
框架用的是spring。用到了maven工具(maven的包百度下就可以)。

四步完成,全部复制改参数就可以

第一步:先在Spring中对图片进行限制

<!-- SpringMVC上传文件时,需要配置MultipartResolver处理器 --> <bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">    <property name="defaultEncoding" value="UTF-8"/> <!-- 指定所上传文件的总大小不能超过500KB。注意maxUploadSize属性的限制不是针对单个文件,而是所有文件的容量之和。这个的大小是以字节为单位的,要多大自己算好了再设置-->   <property name="maxUploadSize" value="500000"/>   <!-- 最大内存大小 (10240)-->   <property name="maxInMemorySize" value="40960" /> </bean>

第二步:写jsp页面

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%><%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><script type="text/javascript" src="../js/jquery-1.7.1.min.js"></script><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>上传图片</title></head><body> <form action="filesUpload" method="POST" name="xiangmu" id="xiangmu" enctype="multipart/form-data"> <table>  <tr>  <td>身份证图片上传:</td>  <td><input type=file name="myfiles" id="doc"   onchange="showImage();">  </td>  <div id="localImag">   <img id="preview" width=-1 height=-1 style="diplay:none" />  </div>  </tr>  <tr>  <td>公司运营情况:</td>  <!-- 为了实现张图片上传,上传框这个name要都一样 -->  <td><input type="file" name="myfiles" id="doc1"></td>  <td>     </td>  </tr>  <tr>  <td><input type="submit" value="提交" />  </td>  </tr> </table> </form></body></html>

注意:

多图上传,上传框的name要都一样,等于发送了一个MultipartFile[]数组。
不仅支持上传图片,还支持多文件上传。
form的enctype=“multipart/form-data”,这个是上传文件必须的。

第三步:如果你要实现页面展现图片的功能,就在jsp页面添加下面的方法:

<script type="text/javascript"> function showImage() { var docObj = document.getElementById("doc"); var imgObjPreview = document.getElementById("preview"); if (docObj.files && docObj.files[0]) {  //火狐下,直接设img属性   imgObjPreview.style.display = 'block';  imgObjPreview.style.width = '300px';  imgObjPreview.style.height = '120px';  //imgObjPreview.src = docObj.files[0].getAsDataURL();   //火狐7以上版本不能用上面的getAsDataURL()方式获取,需要一下方式   imgObjPreview.src = window.URL.createObjectURL(docObj.files[0]); } else {  //IE下,使用滤镜   docObj.select();  var imgSrc = document.selection.createRange().text;  var localImagId = document.getElementById("localImag");  //必须设置初始大小   localImagId.style.width = "250px";  localImagId.style.height = "200px";  //图片异常的捕捉,防止用户修改后缀来伪造图片   try {  localImagId.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)";  localImagId.filters   .item("DXImageTransform.Microsoft.AlphaImageLoader").src = imgSrc;  } catch (e) {  alert("您上传的图片格式不正确,请重新选择!");  return false;  }  imgObjPreview.style.display = 'none';  document.selection.empty(); } return true; }</script>

注意:这个方法只能上传一张来显示,除非你设置多个div。或者:展示多个图片可以找找其他方法。

第四步:后台接收

@RequestMapping("/filesUpload") //requestParam要写才知道是前台的那个数组 public String filesUpload(@RequestParam("myfiles") MultipartFile[] files,  HttpServletRequest request) { List<String> list = new ArrayList<String>(); if (files != null && files.length > 0) {  for (int i = 0; i < files.length; i++) {  MultipartFile file = files[i];  // 保存文件  list = saveFile(request, file, list);  } } //写着测试,删了就可以 for (int i = 0; i < list.size(); i++) {  System.out.println("集合里面的数据" + list.get(i)); } return "index";//跳转的页面 } private List<String> saveFile(HttpServletRequest request,  MultipartFile file, List<String> list) { // 判断文件是否为空 if (!file.isEmpty()) {  try {  // 保存的文件路径(如果用的是Tomcat服务器,文件会上传到//%TOMCAT_HOME%//webapps//YourWebProject//upload//文件夹中  // )  String filePath = request.getSession().getServletContext()   .getRealPath("/")   + "upload/" + file.getOriginalFilename();  list.add(file.getOriginalFilename());  File saveDir = new File(filePath);  if (!saveDir.getParentFile().exists())   saveDir.getParentFile().mkdirs();  // 转存文件  file.transferTo(saveDir);  return list;  } catch (Exception e) {  e.printStackTrace();  } } return list; }

注意:upload是文件夹,自己新建下再运行,免得出错。

结束,全部复制就可以实现了。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持武林网。

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表