在JSP中显示servlet中生成的或读取的图片

好久没有动过JavaEE了, 现在从最基础的开始写写总结. 

 

在JSP页面中动态显示图片.

后台servlet中生成图片, 或者是读取某一个图片, 传到前台JSP中显示是很常见的需求.

 

下面开始:

 

一. 

     JSP中显示图片的主要代码就是:

 

 

<img src="http://localhost:8080/imgShow/ImageShowServlet" />

 

 

    其中"imgShow"是项目名称, "ImageShowServlet"是url-pattern. 

 

二. 

     web.xml的配置:

 

 

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" id="WebApp_ID" version="2.5">
  <display-name>imgShow</display-name>
  <welcome-file-list>
    <welcome-file>index.jsp</welcome-file>
  </welcome-file-list>
  <servlet>
    <description></description>
    <display-name>ImageShowServlet</display-name>
    <servlet-name>ImageShowServlet</servlet-name>
    <servlet-class>com.xuriyunhai.sevlet.ImageShowServlet</servlet-class>
  </servlet>
  <servlet-mapping>
    <servlet-name>ImageShowServlet</servlet-name>
    <url-pattern>/ImageShowServlet</url-pattern>
  </servlet-mapping>
</web-app>

 

 

三.

    创建的servlet:

 

    @Override
    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        doPost(request, response);
    }

    /**
     * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
     */
    @Override
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        int width=300, height=100;
        BufferedImage image = createImgage(width, height);
        //ByteArrayOutputStream bao=new ByteArrayOutputStream();
        //ImageIO.write(image, Util.JPG, bao);

        Util.showImage(response, image, Util.JPG, true);
        Util.showImage(response, bao.toByteArray(), true);
        //Util.showImage(response, "d:\\aaa.png", true);
    }

    /**
     * 生成图片
     * 
     * @param width 图片宽度
     * @param height 图片高度
     * @return
     */
    private BufferedImage createImgage(int width, int height) {
        BufferedImage image = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB);
        Graphics g = image.getGraphics();
        //以下填充背景颜色
        g.setColor(Color.lightGray);
        g.fillRect(0, 0, width, height);
        //以下设置前景色
        g.setColor(Color.blue);
        g.drawString("Http://www.xuriyunhai.com",10,20);
        g.drawString("Author:xuriyunhai[[e-mail]]",10,40);
        g.drawLine(10,50,290,50);
        g.drawString("Image Show",10,70);
        g.dispose();
        return image;
    }

 

Util类:

 

public class Util {

    public static final String JPG = "jpg";
    public static final String PNG = "png";
    public static final String BMP = "bmp";
    public static final String GIF = "gif";

    /**
     * 在servlet中调用该方法, jsp页面中img标签的src指向该servlet, 则会显示图片
     * 
     * @param response
     * @param path
     * @param isResponseClose
     */
    public static void showImage(HttpServletResponse response,
                                 String path,
                                 boolean isResponseClose) {
        try {
            ServletOutputStream outStream = response.getOutputStream();// 得到向客户端输出二进制数据的对象
            FileInputStream fis = new FileInputStream(path); // 以byte流的方式打开文件
            // 读数据
            byte data[] = new byte[1000];
            while (fis.read(data) > 0) {
                outStream.write(data);
            }
            fis.close();
            response.setContentType("image/*"); // 设置返回的文件类型
            outStream.write(data); // 输出数据
            if (isResponseClose) {
                outStream.close();
            }
        } catch (IOException e) {
            e.printStackTrace();
        }
    }

    /**
     * 在servlet中调用该方法, jsp页面中img标签的src指向该servlet, 则会显示图片
     * 
     * @param response
     * @param data
     * @param isResponseClose
     */
    public static void showImage(HttpServletResponse response,
                                 byte[] data,
                                 boolean isResponseClose) {
        try {
            ServletOutputStream outStream = response.getOutputStream();// 得到向客户端输出二进制数据的对象
            // 读数据
            outStream.write(data);
            response.setContentType("image/*"); // 设置返回的文件类型
            outStream.write(data); // 输出数据
            if (isResponseClose) {
                outStream.close();
            }
        } catch (IOException e) {
            e.printStackTrace();
        }
    }

    /**
     * 在servlet中调用该方法, jsp页面中img标签的src指向该servlet, 则会显示图片
     * 
     * @param response
     * @param image
     * @param imgType
     * @param isResponseClose
     */
    public static void showImage(HttpServletResponse response,
                                 BufferedImage image,
                                 String imgType,
                                 boolean isResponseClose) {
        try {
            ImageIO.write(image, imgType, response.getOutputStream());
        } catch (IOException e) {
            e.printStackTrace();
        }
    }

}

 

 

最主要的方法就是Util类中的showImage方法, 该方法通过各个重载的方法实现3中方式的图片输入:

       1, 传入正确的图片路径

       2, 传入图片的字节数组

       3, 传入BufferImage, 该种方式主要用在java代码生成图片的情况.

 

最后附上代码:

评论

2 楼 dsmagickey 2014-05-23  

学习，感谢。

1 楼 motrsky 2012-07-22  

   大哥，你解决了困扰我很久的问题，谢谢！