smartupload 组件:完成上传文件功能。一般使用表单的 file 元素:
<form > 上传图片: <input type="file" name="pic"> </form> |
常见的上传组件:
Smartupload 和 Apache 公司的 Fileupload
上传:
完成上传功能需要 smartupload 组件的支持,也就是 smartupload.jar 文件,将他放到根目录下的 WEB-INF 下的 lib 文件夹中。
注意:开发中表单中上传文件时,表单的提交方式一定要设置成 post 。
范例 :图片上传
upload.jsp
<%@page contentType="text/html;charset=gb2312"%> <html> <body> <form action="smart.jsp" method="post" > 上传图片: <input type="file" name="pic"> <input type="submit" value=" 上传 "> </form> </body> </html> |
smart.jsp
根目录下建立一个名为 upload 的文件夹。用于存放上传的文件。
<%@ page language="java" import="java.util.*" pageEncoding="GBK"%> <jsp:useBean id="smartupload" class="org.lxh.smart.SmartUpload"/> <html> <body> <% smartupload.initialize(pageContext); // 初始化上传 smartupload.upload(); // 准备上传 smartupload.save("upload"); // 保存文件 %> </body> </html> |
运行结果: 发现上传之后在 upload 中找不到我们上传的图片。
原因: 正常情况下我们用表单提交的是文本数据,而此处要上传文件,那么就必须对表单进行封装。
form 表单中存在的一个 enctype 属性。用于封装我们的表单。
修改 upload.jsp
<%@page contentType="text/html;charset=gb2312"%> <html> <body> <form action="smart.jsp" method="post" enctype="multipart/form-data" > 上传图片: <input type="file" name="pic"> <input type="submit" value=" 上传 "> </form> </body> </html> |
运行结果 :正常上传。而且文件名称与上传前的名称一致。
范例:
修改 upload.jsp
<%@page contentType="text/html;charset=gb2312"%> <html> <body> <form action="smart.jsp" method="post" > 姓名: <input type=”text” name=”name”><br> 上传图片: <input type="file" name="pic"> <input type="submit" value=" 上传 "> </form> </body> </html> |
修改 smart.jsp
<%@ page language="java" import="java.util.*" pageEncoding="GBK"%> <jsp:useBean id="smartupload" class="org.lxh.smart.SmartUpload"/> <html> <body> <% String name = request.getParameter(“name”); smartupload.initialize(pageContext); // 初始化上传 smartupload.upload(); // 准备上传 smartupload.save("upload"); // 保存文件 %> </body> </html> |
修改之后发现,通过 request.getParameter() 方法无法获取提交过来的参数 name 。
应该使用 smartupload 的 request 方法。
修改 smart.jsp
<%@ page language="java" import="java.util.*" pageEncoding="GBK"%> <jsp:useBean id="smartupload" class="org.lxh.smart.SmartUpload"/> <html> <body> <% smartupload.initialize(pageContext); // 初始化上传 smartupload.upload(); // 准备上传 smartupload.save("upload"); // 保存文件 String name = smartupload.getRequest().getParameter(“name”); %> </body> </html> |
这样之后就可以接受表单提交过来的参数了。
但是要注意 :虽然 request 的 getParameter 方法不能够在此处使用,但是 request 的其他方放照样可以继续使用。
但是这种情况下我们也不难发现,如果上传已经上传过的图片(因为上传后文件名称不变),所以存放上传照片的文件夹里会出现‘后上传的覆盖掉原来上传的同名文件’的情况。
前台输入文件名称。
修改文件名称时要保持文件后缀不变。
修改 smart.jsp
<%@ page language="java" import="java.util.*" pageEncoding="GBK"%> <jsp:useBean id="smartupload" class="org.lxh.smart.SmartUpload"/> <html> <body> <% smartupload.initialize(pageContext); // 初始化上传 smartupload.upload(); // 准备上传 String name = smartupload.getRequest().getParameter(“name”);// 从客户端获取文件名 String ext = smartupload.getFiles().getFile(0).getFileExt();// 获取上传文件的后缀, 0 表示第一个上传的文件 name = name + “.” +ext;// 完整的文件名称 String path = this.getServletContext().getRealPath(“/”)+”upload/”+name;// 获取完整的保存路径 smartupload.getFiles().getFile(0).saveAs(path);// 保存文件, saveAs 中的参数必须为完整的保存路径名 %> <img src = “upload/”<%=name%> width=”” height=””>// 显示上传后的图片 </body> </html> |
但是以上程序也存在问题,就是无法保证用户输入的文件名称不会重复。
所以我们将对上传的文件自动更名。
如何才能让文件名称不会重复呢?
可以这样设置文件名称:
IP 地址 + 时间戳 + 三位随机数
但是这里又有问题了,就是 IP 的补 0 问题。例如 IP 为 162.198.80.7 。这样出来的名称要这样的形式 162198080007 。所以我们创建一个 javaBean 来用于生成文件名称。
范例: IPTimeStamp.java
import java.text.SimpleDateFormat; import java.util.Random;
public class IPTimeStamp { private String ip;
public IPTimeStamp() { }
public IPTimeStamp(String ip) { this.ip = ip; // 通过 IPTimeStamp 的构造方法设置 ip 地址 } // 生成时间的方法,例如: 20111201213523 public String getTimeStamp() { String temp = null; SimpleDateFormat sdf = new SimpleDateFormat("yyyyMMddHHmmssSSS"); temp = sdf.format(new java.util.Date()); return temp; } // 生成我们要求的格式的 IP public String getIPTimeStampRand() { StringBuffer buf = new StringBuffer(); if (ip != null) { String str[] = this.ip.split("\\.");// 按照“ . “来拆分 for (int i = 0; i < str.length; i++) { buf.append(this.addZero(str[i], 3));// 将拆分完的并且补 0 之后的放入 buf } } buf.append(this.getTimeStamp());// 将生成好格式的时间放入 buf Random rand = new Random(); for (int i = 0; i < 3; i++) { buf.append(rand.nextInt(10)) ;// 将生成好的随机数放入 buf } return buf.toString() ; } //ip 被拆分后怎么补 0 的方法 private String addZero(String str, int len) { StringBuffer s = new StringBuffer(); s.append(str); while (s.length() < len) { s.insert(0, "0"); } return s.toString();// 返回生成好的文件名称 } } |
修改 upload.jsp
<%@page contentType="text/html;charset=gb2312"%> <html> <body> <form action="smart.jsp" method="post" > 上传图片: <input type="file" name="pic"> <input type="submit" value=" 上传 "> </form> </body> </html> |
修改 smart.jsp
<%@ page language="java" import="java.util.*" pageEncoding="GBK"%> <%@ page import="org.lxh.util.*"%> <jsp:useBean id="smartupload" class="org.lxh.smart.SmartUpload"/> <html> <body> <% IPTimeStamp its = new IPTimeStamp(request.getRemoteAddr()) ; // 将 IP 传入,获取生成文件名称类的对象 request.setCharacterEncoding("GBK") ; smartupload.initialize(pageContext) ; // 初始化上传 smartupload.upload() ; // 准备上传 String name=its. getIPTimeStampRand()+"."+ smartupload.getFiles().getFile(0).getFileExt() ;// 通过 IPTimeStamp 的对象获取到生成好的文件名称,并组合好完整的文件名称(包含后缀名) String fileName = this.getServletContext().getRealPath("/") + "upload/" + name ;// 将上传好的文件放到虚拟目录下的 upload 文件夹下 smartupload.getFiles().getFile(0).saveAs(fileName) ; %> <img src="upload/<%=name%>" width="300" height="200"> </body> </html> |
一般在系统开发中,需要将一些图片的信息保存在数据库中。一般有两种方式。
第一种:
直接在数据库中保存图片信息,通过 BLOG 字段存储。
如果上传文件比较大,那么这种方式不方便。
如果数据库备份时,仅仅备份数据库即可。
第二种:
直接将图片放到指定的文件夹中,然后在数据库中以普通文本的信息保存图片的路径。
如果上传文件比较大,那么这种方式方便。
如果数据库备份时,不仅得备份数据库,还有备份图片信息。
范例: 保存图片路径。(第二种方式)
有如下数据库脚本( Oracle )
DROP SEQUENCE myseq ; DROP TABLE person ; CREATE SEQUENCE myseq ; CREATE TABLE person( id NUMBER PRIMARY KEY NOT NULL , name VARCHAR2(60) NOT NULL , photo VARCHAR2(100) ) ; |
完成两个功能: 1. 插入信息。 2. 从数据库中将全部的信息列表显示。
insert.htm
<html> <body> <form action="insert.jsp" method="post" enctype="multipart/form-data"> 姓名: <input type="text" name="name"><br> 上传的图片: <input type="file" name="pic"><br> <input type="submit" value=" 上传 "> </form> </body> </html> |
之后建立一个连接数据库类,用于连接数据库操作。
DataBaseConnection.java
import java.sql.Connection; import java.sql.DriverManager; import java.sql.SQLException;
public class DataBaseConnection { public static final String DBDRIVER = "oracle.jdbc.driver.OracleDriver" ; public static final String DBURL = "jdbc:oracle:thin:@localhost:1521:MLDN" ; public static final String DBUSER = "scott" ; public static final String DBPASS = "tiger" ; private Connection conn = null ; public DataBaseConnection(){ try { Class.forName(DBDRIVER) ; conn = DriverManager.getConnection(DBURL,DBUSER,DBPASS) ; } catch (ClassNotFoundException e) { // TODO Auto-generated catch block e.printStackTrace(); } catch (SQLException e) { // TODO Auto-generated catch block e.printStackTrace(); } } public Connection getConnection(){ return this.conn ; } public void close(){ if(this.conn!=null){ try { this.conn.close() ; } catch (SQLException e) { e.printStackTrace(); } } } } |
insert.jsp
<%@ page language="java" import="java.util.*" pageEncoding="GBK"%> <%@ page import="java.sql.*"%> <%@ page import="org.lxh.util.*"%> <jsp:useBean id="smartupload" class="org.lxh.smart.SmartUpload"/> <jsp:useBean id="dbc" class="org.lxh.dbc.DataBaseConnection"/> <html> <body> <% request.setCharacterEncoding("GBK") ; try{ IPTimeStamp its = new IPTimeStamp(request.getRemoteAddr()) ; request.setCharacterEncoding("GBK") ; smartupload.initialize(pageContext) ; // 初始化上传 smartupload.upload() ; // 准备上传 String photoname = its.getIPTimeStampRand() + "." + smartupload.getFiles().getFile(0).getFileExt() ; String sql = "INSERT INTO person(id,name,photo) VALUES (myseq.nextVal,?,?)" ; PreparedStatement pstmt = dbc.getConnection().prepareStatement(sql) ; pstmt.setString(1,smartupload.getRequest().getParameter("name")) ; pstmt.setString(2,photoname) ; pstmt.executeUpdate() ; pstmt.close() ; String fileName = this.getServletContext().getRealPath("/") + "upload/" + photoname ; smartupload.getFiles().getFile(0).saveAs(fileName) ; }catch(Exception e){ }finally{ dbc.close() ; } %> </body> </html> |
显示
list.jsp
<%@ page language="java" import="java.util.*" pageEncoding="GBK"%>
<%@ page import="java.sql.*"%>
<%@ page import="org.lxh.util.*"%>
<jsp:useBean id="dbc" class="org.lxh.dbc.DataBaseConnection"/>
<html>
<body>
<%
request.setCharacterEncoding("GBK") ;
try{
String sql = "SELECT id,name,photo FROM person " ;
PreparedStatement pstmt = dbc.getConnection().prepareStatement(sql) ;
ResultSet rs = pstmt.executeQuery() ;
%>
<center>
<table border="1" width="80%">
<tr>
<td> 编号 </td>
<td> 姓名 </td>
<td> 照片 </td>
</tr>
<%
while(rs.next()){
int id = rs.getInt(1) ;
String name = rs.getString(2) ;
String photo = rs.getString(3) ;
%>
<tr>
<td><%=id%></td>
<td><%=name%></td>
<td><img src="upload/<%=photo%>" width="30" height="25"></td>
</tr>
<%
}
%>
</table>
</center>
<%
pstmt.close() ;
}catch(Exception e){
}finally{
dbc.close() ;
}
%>
</body>
</html>