JSP

实验目的：掌握在JSP中存取数据库图片字段的方法。

本实验使用示例数据库Northwind，实现雇员表Employees中图片字段的存取。Employees表的Photo字段为“图片类型”（或称“二进制数据”，实际上能以字节形式原样保存任何文件）。

1 文件上传组件

本实验使用了开源项目文件上传组件并需要输入输出组件的支持，因此要先将相应的类库文件commons-fileupload-1.2.2.jar和commons-io-2.4.jar放到Java类库文件夹。

首先创建主页面index.jsp，参照教学6.4，完成以表格显示雇员信息功能（连接名称为conn，记录集名称为rs），除雇员号、姓氏、名字和职位外，再增加一个“照片”列用于显 示雇员照片。在照片列的内容单元格中插入图像标签并设置属性：替换文本是“照片”（这样如果雇员还没有照片，则会在页面中显示替换文本），源文件是showimg.jsp并传递EmployeeID参数（即由 showimg.jsp负责输出相应雇员的照片数据）；链接是upimg.jsp并也传递EmpoyeeID参数（这样点击图片时将由upimg.jsp 负责上传相应雇员的照片文件）。

2 上传图片并写入图片字段

创建图片上传页面upimg.jsp，先在页顶引入所需的类：

<%@ page import="java.io.*" %>
<%@ page import="java.util.*" %>
<%@ page import="org.apache.commons.fileupload.servlet.*" %>
<%@ page import="org.apache.commons.fileupload.disk.*" %>
<%@ page import="org.apache.commons.fileupload.*" %>

再用以下代码段根据统一设置创建数据库连接：

<%@ include file="../Connections/conn.jsp" %>
<%
Class.forName(MM_conn_DRIVER);
Connection conn = DriverManager.getConnection(MM_conn_STRING,MM_conn_USERNAME,MM_conn_PASSWORD);
%>

在页面中添加表单，在表单中插入一个文件域photo和一个提交按钮，DW会自动设置提交文件数据的表单编码方式enctype="multipart/form-data"

最后添加以下代码段上传图片并保存到雇员表的图片字段

<%  //上传图片
boolean isMultipart = ServletFileUpload.isMultipartContent(request);
if (isMultipart) {  //提交了文件
	FileItemFactory factory = new DiskFileItemFactory();
	ServletFileUpload upload = new ServletFileUpload(factory);
	List<FileItem> items = upload.parseRequest(request);
	Iterator iter = items.iterator();
	while (iter.hasNext()) {
		FileItem item = (FileItem) iter.next();
		if (item.isFormField()) {  //普通域
		}
		else {  //文件域
			/*以下代码段用于保存到服务端目录
			String fileName = item.getName();
			File saveFile = new File(config.getServletContext().getRealPath("/") + fileName);
			item.write(saveFile);*/
			/*以下代码段用于读取字节输入流
			InputStream is = item.getInputStream();
			byte b[] = new byte[is.available()];
			is.read(b);*/
			//以下代码段用于写入数据库图片字段并跳转回主页面
			byte b[] = item.get();
			String sql = "UPDATE Employees SET photo=? WHERE EmployeeID=?";
			PreparedStatement pstmt = conn.prepareStatement(sql);
			pstmt.setBytes(1, b);
			pstmt.setString(2, request.getParameter("EmployeeID"));
			pstmt.execute();
			pstmt.close();
			response.sendRedirect("index.jsp");
		}
	}
}
%> 

上传的图片文件也可以保存到服务器目录，或是用来创建字节输入流，具体方法请参看上面代码段中被注释掉的部分。

3 读取图片字段在页面中显示

创建图片显示页面showimg.jsp，先在页顶引入所需的类：

<%@ page import="java.io.*" %>

再在绑定面板中创建记录集rsImg，根据提交的EmployeeID参数筛选出唯一的雇员记录（只需Photo列即可）。

最后添加以下代码段即可读取图片字段并输出：

<%
response.setContentType("image/jpeg");
OutputStream os = response.getOutputStream();
byte[] b = rsImg.getBytes("Photo");
os.write(b);
os.flush();
os.close();
%>

如果采用图片文件上传到服务器目录而在数据库中保存图片文件名的方式，则图像标签的源文件属性设为图片文件的相对路径即可。

（注意：Northwind数据库的Employees表的Photo字段实际上已存有图片数据，但此数据包含78字节的头信息，因此输出字节流时要指定开始位置为78才能正常显示原有图片os.write(b, 78, b.length-78)。）