jsp显示图片流 google
javaweb流的方式生成图片 google
转自：http://blog.csdn.net/javaeeteacher/article/details/1889381
http://0609xiaohua.iteye.com/blog/1487360
在一个网站中可能会存在大量的图片，有些图片对于所有的网页是相同的，例如网页的LOGO，主页中的图片，这些图片就像普通的html文件一样，这些图片的处理通常使用网页编辑工具来完成的，也就是说通常是由美工完成的。主要使用下面的html标签：
<img alt="" src=""/>
其中src指定文件的路径，使用相对路径，通常我们会在web应用中专门创建一个文件夹images存放所有的图片。
这些图片的处理一般不需要Java程序员管理。还有一些图片是与程序员需要考虑的，例如，网站有一个留言板，在留言的时候用户可以选择表情，表情是一个非常简单的图片，每个用户留言都会选择一个，如果不选择，系统也会给一个默认的。这里使用图片的特点是、大家共享这么多的图片，不管怎么选择，都是从中选择。对于这种图片的处理通常的做法：在记录留言的同时，记录图片的编号，这样在显示的时候根据图片的编号查找图片本身。
另外还有一种情况，如果系统要保存所有用户的照片，这些照片对于不同的用户是不相同的，这时候如果采用上面的方式图片从完成的功能来说也可以，但是管理起来不方便，更合理的方式应该使用数据库。通常通过上传的方式把图片上传到服务器，然后存储到数据库，然后需要的时候，从数据库提取然后显示。
下面分别对两种处理图片的方式进行介绍。
通过路径管理图片
这种方式下，为了访问文件方便，需要对文件名进行特殊设置，例如上面所说的20种表情图片，可以使用image01.gif、image02.gif、image03.gif等等。
（1）
路径的生成
首先在html文件中单选按钮让用户选择，例如下面的代码展示了20种被选择的表情，使用上面说的文件名命名方式。
请选择表情：<br>
<input type="radio" name="mode" value="01"/>
<img alt="表情1" src="images/image01.gif" />
<input type="radio" name="mode" value="02"/>
<img alt="表情2" src="images/image02.gif" />
<input type="radio" name="mode" value="03"/>
<img alt="表情3" src="images/image03.gif" />
…
这里需要注意的mode是单选按钮的名字，处理文件中会根据这个名字获取用户选择的信息，value对应的某个选项的值，如果你选择第一个图片，则单选按钮的值就是01。img标签用于显示表情图片。
然后在处理文件中获取这个参数，把它保存到数据库中，获取信息，可以通过下面的代码完成：
request.getParameter(“mode”);
如何向数据库中存储，请参考本书中关于数据库部分。
（2）
根据路径信息生成图片
首先，需要从数据库中获取到要显示的图片的路径信息，访问数据库的过程请参考本书中关于数据库部分。假设获取的信息保存在str中，通常我们会先保存到request中，通过下面的代码：
request.setAttribute(“mode”,str);
然后在页面中显示，需要根据这个路径确定文件名，所以img标签中的文件名部分需要根据这个变量确定。
原来的格式为：
<img src="images/image01.gif" />
需要把01替换成变量，使用表达式：
<img src="images/image${requestScope.mode}.gif" alt=""/>
使用下面的代码也可以得到相同的效果：
<%
String str = (String)request.getAttribute("mode");
out.println("<img src=/"images/image"+str+".gif/" alt=/"/"/>");
%>
或者
<%
String str2 = (String)request.getAttribute("mode");
%>
<img src="images/image<%=str2%>.gif" alt=""/>
使用存储路径的方式的思路非常简单，存储图片的信息到数据库中，不一定是全部信息，只要能确定图片即可，然后根据数据库中的信息构造图片的路径显示路径。
通过数据库存储图片
在数据库中存储图片，需要使用BLOB类型的字段，BLOB用于存储字节流对象。假设我们要管理用户信息，为了简化，这里用户信息包括用户名、用户编号和照片，表的定义语句如下：
create table user
(
userid varchar(10) primary key,
username varchar(10),
picture blob
)
下面分别对图片的上传、存储和显示进行介绍。
（1）图片的上传
文件的上传功能我们使用Struts中提供的上传功能。首先需要创建上传的界面，对应的代码如下：
<%@ page contentType="text/html; charset=GBK" %>
<%@ taglib uri="/WEB-INF/struts-html.tld" prefix="html" %>
<html>
<head>
<title>
adduser
</title>
</head>
<body bgcolor="#ffffff">
<h1>
JBuilder Generated JSP
</h1>
用户添加<br>
<html:form action="addAction.do" method="post" enctype="multipart/form-data">
用户编号：<html:text property="userid"/><br>
用户名：<html:text property="username"/><br>
照片：<html:file property="picture"/>
<html:submit>
</html:submit>
</html:form>
</body>
</html>
注意：请求方式是post，enctype的值为“multipart/form-data”。
需要创建一个Form用于传值：
package picturetest;
import org.apache.struts.action.ActionForm;
import org.apache.struts.upload.FormFile;
import org.apache.struts.action.ActionErrors;
import org.apache.struts.action.ActionMapping;
import javax.servlet.http.HttpServletRequest;
public class AddActionForm
extends ActionForm {
private FormFile picture;
private String userid;
private String username;
public FormFile getPicture() {
return picture;
}
public void setPicture(FormFile picture) {
this.picture = picture;
}
public void setUsername(String username) {
this.username = username;
}
public void setUserid(String userid) {
this.userid = userid;
}
public String getUserid() {
return userid;
}
public String getUsername() {
return username;
}
public ActionErrors validate(ActionMapping actionMapping,
HttpServletRequest httpServletRequest) {
/** @todo: finish this method, this is just the skeleton.*/
return null;
}
public void reset(ActionMapping actionMapping,
HttpServletRequest servletRequest) {
}
}
（2）图片的存储
图片的存储应该创建单独的类来完成，因为代码太多，这里简化，直接在Action中完成对信息的添加。
package picturetest;
import org.apache.struts.action.ActionMapping;
import org.apache.struts.action.ActionForm;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.apache.struts.action.ActionForward;
import org.apache.struts.action.Action;
import org.apache.struts.upload.FormFile;
import java.sql.*;
import java.io.*;
public class AddAction
extends Action {
public ActionForward execute(ActionMapping mapping, ActionForm form,
HttpServletRequest request,
HttpServletResponse response) {
AddActionForm addActionForm = (AddActionForm) form;
String uid = addActionForm.getUserid();
String username = addActionForm.getUsername();
FormFile file = addActionForm.getPicture();
System.out.println(file.getFileSize());
if(file == null)
return mapping.findForward("success");
try
{
Class.forName("com.mysql.jdbc.Driver");
//加载驱动程序
Connection con
= DriverManager.getConnection("jdbc:mysql://localhost:3306/webtest","root","");
//创建连接
PreparedStatement pstmt = con.prepareStatement("insert into user values(?,?,?)");
//创建语句对象
InputStream is = file.getInputStream();
//根据文件创建输入流
pstmt.setString(1,uid);
//为sql语句中的第一个变量赋值
pstmt.setString(2,username);
//为sql语句中的第二个变量赋值
pstmt.setBinaryStream(3,is,file.getFileSize());
//为sql语句中的第三个变量赋值，就是文件输入流
pstmt.execute();
//执行sql语句
is.close();
//关闭输入流
pstmt.close();
//关闭语句对象
con.close();
//关闭连接对象
}catch(Exception e)
{
System.out.print(e.toString());
}
request.setAttribute("userid",uid);
request.setAttribute("username",username);
return mapping.findForward("success");
}
}
把图片存入数据库的过程主要是先根据文件创建输入流，然后把该输入流作为参数添加到数据库中。保存图片使用：
pstmt.setBinaryStream(3,is,file.getFileSize());
其中，第一个参数3表示为sql语句中的第三个变量赋值，也就是第3个问号指定的变量，第二个参数is表示输入流，第三个参数表示图片的大小。
如果这里的图片不是上传的，而是位于文件系统中，操作过程也非常类似：
String str = getServletContext().getRealPath("code.gif");
File file = new File(str);
InputStream fis = new FileInputStream(file);
主要创建一个从图片的输入流即可，前面的是从上传文件的输入流，这里是从磁盘文件的输入流，后面我们还会介绍从内存图片的输入流。接下来向数据库中存储的过程是相同的。
（3）图片的显示
图片本身的显示通常伴随有其它信息的显示，这里把这个用户的所有信息都显示出来，但是文本类信息与图片信息本身的显示过程不同，所以这里使用两个文件：第一个文件用于显示图片本身，第二个文件用于显示其它信息以及关联到图片上。
显示图片的文件：
<%@page
contentType="image/jpeg"%>
<%@page import="java.sql.*"%>
<%@page import="java.io.*"%>
<%
String driver = "com.mysql.jdbc.Driver";
String url = "jdbc:mysql://127.0.0.1:3306/webtest";
try {
String userid = request.getParameter("userid");
//获取要显示的用户的ID
Class.forName(driver);
//加载驱动程序
Connection con = DriverManager.getConnection(url, "root", "");
//创建连接
String sql = "select picture from user where uid='"+userid+"'";
//String sql = "select picture from user where uid='00006789'";
PreparedStatement pstmt = con.prepareStatement(sql);
//创建语句对象
ResultSet rs = pstmt.executeQuery();
//查询的结果集
rs.next();
InputStream is = rs.getBinaryStream(1);
//从数据库中读取图片数据
byte b[] = new byte[8192];
//创建字节数组，用于接收数据
OutputStream os = response.getOutputStream();
//获取输出流
int i;
while ((i=is.read(b)) > 0) { //从输入流读取数据
os.write(b); //然后把读取的数据进行输出
}
os.close();
is.close();
rs.close();
pstmt.close();
con.close();
//关闭相关对象
}
catch (Exception e) {
out.println(e.toString());
}
%>
需要注意几个地方：
Ø
page属性的contentType属性的值为：image/jpeg；
Ø
读取图片，使用rs.getBinaryStream(1)；
Ø
需要获取输出流：OutputStream os = response.getOutputStream();
Ø
把需要显示的照片的用户ID传递过来。
显示所有信息的文件：
<%@ page contentType="text/html; charset=GBK" %>
<html>
<head>
<title>
userinformation
</title>
</head>
<body bgcolor="#ffffff">
<h1>
用户信息：
</h1>
用户编号:${requestScope.userid}<br>
用户名:${requestScope.username}<br>
照片:<img alt="照片" src="picture.jsp?userid=${requestScope.userid}" />
</body>
</html>
注意：照片:<img alt="照片" src="picture.jsp?userid=${requestScope.userid}" />，picture.jsp的作用就是生成图片，src的值为picture.jsp就是把picture.jsp生成的图片作为一个静态图片使用了，使用“?”号把要显示的用户ID传递给picture.jsp文件。
这里不再给出配置文件struts-configure.xml的内容。
[size=medium]数据库中存放的头像是byte[] 字节的,在jsp页面上根据用户的id用流从数据库中读取图片。但是如果用户没有头像的话，那么在页面上显示的就是一个图片的小白框框，难看死了，所以如果用户没有头像的话，就给用户一个默认的头像。
在User类中：
在UserAction类中：
在jsp页面中：
userImg.jsp:
=================================================================================
后来发现上面的办法并不是最好的解决办法，比如对象User和ClientUser都有byte[] img的属相，那么再Action类中就要分别根据主键id获取对象信息的img属性，然后放到容器中判断byte[]的长度是否为0.那么这是很繁琐的。因此，我想到了一个更好的方法，那就是把读取默认图片也封装成一个方法。java类代码如下：
在jsp页面中，这个和上面的一样，没有变化，只是传递一个id到userImg.jsp中。
userImg.jsp:
[/size]
在User类中：
Java代码
- private byte img[];
在UserAction类中：
Java代码
- ClientUser user = new ClientUser();
- user=UserService.getUserByUserId(sqlSession,user); request.getSession().setAttribute("LoginUserImg", user.getImg().length);
- //在这里需要用byte[]对象的length属性判断是否存放了图片，如果length为0，那么就没有图片，反之则有。
在jsp页面中：
Java代码
- <c:if test="${LoginUserImg==0 }">
- <img src="${pageContext.request.contextPath }/images/head.jpg"
- alt=" " width="100" height="118" align="middle" />
- </c:if>
- <c:if test="${LoginUserImg!=0 }">
- <img
- src="userImg.jsp?id=${id}"
- alt="${id}"
- width="100" height="118" align="middle">
- </c:if>
userImg.jsp:
Java代码
- <%@page contentType="image/jpeg; charset=utf8"%>
- <%@page import="java.io.OutputStream"%>
- <%
- String id = request.getParameter("id");
- Boolean ret = true;
- id = id == null ? "" : id.trim();
- userId = userId == null ? "" : userId.trim();
- OutputStream os = response.getOutputStream();
- if (!id.isEmpty()) {
- ret =UserService.getUserImgById(
- id, os);
- }
- os.flush();
- os.close();
- os = null;
- response.flushBuffer();//下面这三句是一定要加上的，否则就会报错。
- out.clear();
- out = pageContext.pushBody();
- %>
=================================================================================
后来发现上面的办法并不是最好的解决办法，比如对象User和ClientUser都有byte[] img的属相，那么再Action类中就要分别根据主键id获取对象信息的img属性，然后放到容器中判断byte[]的长度是否为0.那么这是很繁琐的。因此，我想到了一个更好的方法，那就是把读取默认图片也封装成一个方法。java类代码如下：
Java代码
- import java.io.FileInputStream;
- import java.io.FileNotFoundException;
- import java.io.IOException;
- import java.io.OutputStream;
- public class DefaultImage {
- public static int getUserImg(OutputStream out, String path) {
- int size = -1;
- FileInputStream is = null;
- try {
- is = new FileInputStream(path);
- // size = is.available(); // 得到文件大小
- byte[] bytes = new byte[1024];
- int len = 0;
- // 开始读取图片信息
- while (-1 != (len = is.read(bytes))) {
- out.write(bytes, 0, len);
- size += len;
- }
- out.flush();
- out.close();
- is.close();
- is = null;
- } catch (FileNotFoundException e) {
- e.printStackTrace();
- } catch (IOException e) {
- e.printStackTrace();
- }
- return size;
- }
- }
在jsp页面中，这个和上面的一样，没有变化，只是传递一个id到userImg.jsp中。
Java代码
- <c:if test="${LoginUserImg==0 }">
- <img src="${pageContext.request.contextPath }/images/head.jpg"
- alt=" " width="100" height="118" align="middle" />
- </c:if>
- <c:if test="${LoginUserImg!=0 }">
- <img
- src="userImg.jsp?id=${id}"
- alt="${id}"
- width="100" height="118" align="middle">
- </c:if>
userImg.jsp:
Jsp代码
- <%@page contentType="image/jpeg; charset=utf8"%>
- <%@page import="java.io.OutputStream"%>
- <%@page import="java.io.FileInputStream"%>
- <%@page import="com.tools.DefaultImage"%>
- <%
- String id = request.getParameter("id");
- String userId = request.getParameter("uid");
- int imgLen = 0;
- id = id == null ? "" : id.trim();/**注意这个地方必须判断一下**/
- userId = userId == null ? "" : userId.trim();
- OutputStream os = response.getOutputStream();
- if (!id.isEmpty()) {
- imgLen = UserService.getUserImgById(
- id, os);//Get Validate Information
- } else if (!userId.isEmpty()) {
- imgLen =UserService
- .getUserImgByUserId(userId, os);
- }
- //开始读取默认图片
- [color=red]String path = request.getRealPath("/images/head.jpg");[/color]
- //获取项目下的相对路径
- if (imgLen <= 0) {
- imgLen = DefaultImage.getUserImg(os, path);
- } else {
- os.flush();
- os.close();
- }
- os = null;
- response.flushBuffer();
- out.clear();
- out = pageContext.pushBody();
- %>
[/size]