common-fileupload上传图片并显示图片
效果图如下:
代码:
注意:需要jar包:commons-fileupload-1.2.1.jar 和 commons-io-1.4.jar
index.jsp
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>添加图片</title>
<script type="text/javascript">
//打开上传页面
function openUpload(){
var win = window.showModalDialog("/upload.jsp","","dialogWidth:300px;dialogHeight:200px;scroll:no;status:no");
if(win != null){
document.getElementById("photo_id").value = win;
document.getElementById("img_id").src = "/"+win;
}
}
</script>
</head>
<body>
<h5>添加图片</h5><hr/>
<p>
上传图片:
<label>
<input type="hidden" id="photo_id" name="photo" value="images/default.gif">
<input type="button" onclick="openUpload()" value="上传图片"/><br/>
<img id="img_id" alt="" src="/images/default.gif" width="200px" height="200px">
</label>
</p>
</body>
</html>
upload.jsp
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK">
<meta http-equiv="pragma" content="no-cache" />
<span style="color: #ff0000;"><base target="_self"></span>
<title>图片上传</title>
</head>
<body>
<h5>图片上传</h5><hr/>
<p style="color: red">${requestScope.errorMsg}</p>
<form id="form1" name="form1" action="/servlet/Upload" method="post" enctype="multipart/form-data">
<div>注:图片大小最大不能超过3M!</div>
<div>
<input type="file" name="file_upload"/>
<input type="submit" value="上传"/>
</div>
</form>
</body>
</html>
Upload.java 中的主要代码:
public class Upload extends HttpServlet { private String uploadPath = "aa/upload/"; // 上传文件的目录
private String tempPath = "aa/uploadtmp/"; // 临时文件目录
private String serverPath = null; private int sizeMax = 3;//图片最大上限
private String[] fileType = new String[]{".jpg",".gif",".bmp",".png",".jpeg",".ico"}; public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/html");
response.setCharacterEncoding("utf-8"); //设置编码,方式返回的中文乱码 serverPath = getServletContext().getRealPath("/").replace("\\", "/");
//Servlet初始化时执行,如果上传文件目录不存在则自动创建
if(!new File(serverPath+uploadPath).isDirectory()){
new File(serverPath+uploadPath).mkdirs();
}
if(!new File(serverPath+tempPath).isDirectory()){
new File(serverPath+tempPath).mkdirs();
} DiskFileItemFactory factory = new DiskFileItemFactory();
factory.setSizeThreshold(5*1024); //最大缓存
factory.setRepository(new File(serverPath+tempPath));//临时文件目录 ServletFileUpload upload = new ServletFileUpload(factory);
upload.setSizeMax(sizeMax*1024*1024);//文件最大上限 String filePath = null;
try {
List<FileItem> items = upload.parseRequest(request);//获取所有文件列表
for (FileItem item : items) {
//获得文件名,这个文件名包括路径
if(!item.isFormField()){
//文件名
String fileName = item.getName().toLowerCase(); if(fileName.endsWith(fileType[0])||fileName.endsWith(fileType[1])||fileName.endsWith(fileType[2])||fileName.endsWith(fileType[3])||fileName.endsWith(fileType[4])||fileName.endsWith(fileType[5])){
String uuid = UUID.randomUUID().toString();
filePath = serverPath+uploadPath+uuid+fileName.substring(fileName.lastIndexOf("."));
item.write(new File(filePath));
PrintWriter pw = response.getWriter();
pw.write("<script>alert('上传成功');window.returnValue='"+uploadPath+uuid+fileName.substring(fileName.lastIndexOf("."))+"';window.close();</script>");
pw.flush();
pw.close();
}else{
request.setAttribute("errorMsg", "上传失败,请确认上传的文件存在并且类型是图片!");
request.getRequestDispatcher("/upload.jsp").forward(request,response);
}
}
}
} catch (Exception e) {
e.printStackTrace();
request.setAttribute("errorMsg", "上传失败,请确认上传的文件大小不能超过"+sizeMax+"M");
request.getRequestDispatcher("/upload.jsp").forward(request,response);
}
} }
<p style="color: red">${requestScope.errorMsg}</p>
表示变量的作用域,一共4种。
pageScope: 表示变量只能在本页面使用。
requestScope:表示变量能在本次请求中使用。
sessionScope:表示变量能在本次会话中使用。
applicationScope:表示变量能在整个应用程序中使用。
源码下载地址:http://download.csdn.net/detail/u011518709/7885625
common-fileupload上传图片并显示图片的更多相关文章
- COS上传图片和显示图片
写这篇文章之前,我也是刚刚实现COS上传和显示图片.我百度了好多相关文章,COS上传图片成功的文章不少,上传后显示图片的文章几乎没有.于是写一篇记录下. COS上传图片推荐链接:https://blo ...
- springmvc上传图片并显示图片--支持多图片上传
实现上传图片功能在Springmvc中很好实现.现在我将会展现完整例子. 开始需要在pom.xml加入几个jar,分别是: <dependency> <groupId>comm ...
- javaweb中上传图片并显示图片,用我要上传课程信息(里面包括照片)这个例子说明
原理: 从客户端上传到服务器 照片——文件夹——数据库 例如:桌面一张照片,在tomacat里创建upload文件夹,把桌面照片上传到upload文件夹里,并且把照片的 ...
- input[type="file"]上传图片并显示图片
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- Java web项目 上传图片保存到数据库,并且查看图片,(从eclipse上移动到tomact服务器上,之路径更改,包括显示图片和导出excel)
//项目做完之后,在本机电脑运行完全正常,上传图片,显示图片,导出excel,读取excel等功能,没有任何问题,但是,当打成war包放到服务器上时,这些功能全部不能正常使用. 最大的原因就是,本机测 ...
- 02-20 winform 上传图片并读取图片
建立一个windows窗体应用程序,在form1界面中拖入两个按钮和一个pictureBox,通过输入输出流来上传图片和显示图片.需要添加一下openFileDialog1. 界面如下: 在cs中写上 ...
- 关于百度world 编辑器改变上传图片的保存路径图片不显示的问题
在ueditor.mini for asp.net 中,将上传的图片保存的路径更改了,可图片在 world 编辑器中不显示,但却可以上传到指定的保存目录下,解决这个问题的方法 是: 在udditor_ ...
- 基于ASP.Net +easyUI框架上传图片,实现图片上传,提交表单
<body> <link href="../../Easyui/themes/easyui.css" rel="stylesheet" typ ...
- 使用ajax上传图片,支持图片即时浏览,支持js图片压缩后上传给服务器
使用ajax上传图片,支持图片即时浏览,支持js图片压缩后上传给服务器 ajax上传主要使用了 var reader = new FileReader() 此方法 js图片压缩主要是利用canvas进 ...
随机推荐
- JS实现购物车动态功能
整理了一下当时学js写的一些案例,觉得购物车功能在一般网站比较常见且基础,现在把它整理出来,需要的小伙伴可以参考一下. 该案例购物车主要功能如下: 1. 商品单选.全选.反选功能 2. 商品添加.删除 ...
- 第二章 "我要点爆"微信小程序点爆页面的实现与云函数和云存储的应用
点爆页面的实现与云函数和云存储的应用以及录音功能讲解 点爆页面制作 点爆页面主要提供文字记录和语音记录两种爆文记录方式,在本页面内输入文字或录入语音后选择心情点击点爆按钮,跳转到点爆方式选择界面. 首 ...
- 基于php的AWS存储服务
近几天用到了aws的s3存储服务,公司内部的完全兼容aws并对其进行了封装,之前也用过,现在把经验总结一下. 既然要用,首先需要安装sdk,下边提供了几种安装方法 方法一:使用composer安装 1 ...
- 测试 | 代码覆盖测试工具 | Eclemma
安装: 打开eclipse,点击Help菜单下的Install New Software 在弹出的对话框中,点击Add 输入Name,如EclEmma 输入Location: http://updat ...
- Xor-MST Codeforces - 888G
https://codeforces.com/contest/888/problem/G 这题可以用Boruvka算法: 一开始每个点是一个连通块.每次迭代对于每个连通块找到其最近邻居(与其有边相连且 ...
- python之生成器(~函数,列表推导式,生成器表达式)
一.生成器 概念:生成器的是实质就是迭代器 1.生成器的贴点和迭代器一样,取值方式也和迭代器一样. 2.生成器一般由生成器函数或者声称其表达式来创建,生成器其实就是手写的迭代器. 3.在python中 ...
- 如何实现序列化为json
因为需要观察对象的数据,所以寻找能自动描述对象中字段名和其值的描述类,咨询了不少人,都推荐使用json,但是json使用起来有一点额外的操作. 需要在文件中引用 using System.Web.Sc ...
- python Windows和Linux路径表示问题
Windows下路径是用‘\\’表示也可以使用'/',但是Linux下路径都是‘/’表示. 因为python是跨平台的,有时候程序迁移会出现错误. 解决办法1 可全部使用‘/’表示 解决办法2 我们可 ...
- python学习之IO:
输入输出兼程IO操作,有同步(速度不匹配时四等)和异步(轮询和消息通知,复杂而高效) 一 文件操作函数: 文件打开:f=open("文件路径“,“操作类型 r/rb/w/a”,"编 ...
- 51nod 1640 天气晴朗的魔法 二分 + 克鲁斯卡算法(kruskal算法) 做复杂了
http://www.51nod.com/onlineJudge/questionCode.html#!problemId=1640 一开始想的时候,看到要使得最大值最小,那这样肯定是二分这个最大值了 ...