[JavaWeb]将Web页面内容生成图片

在工作中遇到一个需求,是要将Web页面内容生成一张图片,然后导出下载。

下面是四种不同的实现方式:

  • (1)此方法需要用到html2image-0.9.jar
    /**
     * html2image-0.9.jar
     * 
     * HtmlImageGenerator 常用方法
     * 
     * loadUrl(url) - (从url载入html)
     * loadHtml(html) - (载入本地html)
     * saveAsImage(file) - (以图片形式保存html)
     * saveAsHtmlWithMap(file, imageUrl) - (创建一个HTML文件包含客户端image-map)
     *
     * getLinks() - (列出所有在HTML文档的链接和相应href、目标、头衔、位置和尺寸)
     * getBufferedImage() - (获得awt,html缓冲后的图片)
     * getLinksMapMarkup(mapName) - (HTML代码段里获得的客户端image-map <地图>产生的链接)
     *
     * get/setOrientation(orientation) -  (get/set文本定位)
     * get/setSize(dimension) -  (设置生成图片大小)
     */

举例:

        HtmlImageGenerator imageGenerator = new HtmlImageGenerator();
        imageGenerator.loadUrl("http://www.baidu.com"); 
        imageGenerator.saveAsImage("d:/hello-world.png");  
        imageGenerator.saveAsHtmlWithMap("hello-world.html", "hello-world.png");
  • (2)此方法需要用到Cobra.jar
        JFrame window = new JFrame();
        HtmlPanel panel = new HtmlPanel();
        window.getContentPane().add(panel);
        window.setSize(600, 400);
        window.setVisible(true);
        new SimpleHtmlRendererContext(panel, new SimpleUserAgentContext())
                .navigate("http://www.baidu.com");

        BufferedImage image = new BufferedImage(panel.getWidth(),
                panel.getHeight(), BufferedImage.TYPE_INT_ARGB);

        // paint the editor onto the image
        SwingUtilities.paintComponent(image.createGraphics(), panel,
                new JPanel(), 0, 0, image.getWidth(), image.getHeight());
        // save the image to file
        ImageIO.write((RenderedImage) image, "png", new File("html.png"));
  • (3) 此方法不需要任何相关Jar支持
    /**
     * 方法详解:该方法利用Robat提供的强大桌面操作能力
     *          硬性调用浏览器打开指定网页,并将网页信息保存到本地。
     * 优势:简单易用,不需要任何第三方插件。
     * 缺点:不能同时处理大量数据,技术含量过低,属于应急型技巧。       
     * @throws URISyntaxException 
     * @throws IOException 
     * @throws MalformedURLException 
     * @throws AWTException 
     * 
     */
    public static void test3() throws MalformedURLException, 
            IOException, URISyntaxException, AWTException{
        //此方法仅适用于JdK1.6及以上版本  
        Desktop.getDesktop().browse(  
                new URL("http://www.baidu.com").toURI());  
        Robot robot = new Robot();  
        robot.delay(10000);  
        Dimension d = new Dimension(Toolkit.getDefaultToolkit().getScreenSize());  
        int width = (int) d.getWidth();  
        int height = (int) d.getHeight();  
        //最大化浏览器  
        robot.keyRelease(KeyEvent.VK_F11);  
        robot.delay(2000);  
        Image image = robot.createScreenCapture(new Rectangle(0, 0, width,  
                height));  
        BufferedImage bi = new BufferedImage(width, height,  
                BufferedImage.TYPE_INT_RGB);  
        Graphics g = bi.createGraphics();  
        g.drawImage(image, 0, 0, width, height, null);  
        //保存图片  
        ImageIO.write(bi, "jpg", new File("d:/111.jpg"));  
    }
  • (4) 使用H5技术,将页面截图,传入后台
    前端处理

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
        <script type="text/javascript" src="./jquery-1.9.1.js">script>
        <script type="text/javascript" src="http://html2canvas.hertzen.com/build/html2canvas.js">script>
        <script  type="text/javascript" >
        $(document).ready( function(){
                $(".example1").on("click", function(event) {
                        event.preventDefault();
                        html2canvas(document.body, {
                        allowTaint: true,
                        taintTest: false,
                        onrendered: function(canvas) {
                            canvas.id = "mycanvas";
                            //document.body.appendChild(canvas);
                            //生成base64图片数据
                            var dataUrl = canvas.toDataURL();

                            var newImg = document.createElement("img");
                            newImg.src =  dataUrl;
                            document.body.appendChild(newImg);
                        }
                    });
                }); 

        });

        script>
    head>
    <body>

        Hello!
        <div class="" style="background-color: #abc;">
            测试html5页面截图
            <br>jsjtt.com
        div>
        <textArea id="textArea" col="20" rows="10" >textArea>
        <input class="example1" type="button" value="button">
        生成界面如下:


    body>
html>

后台处理

    /**
     * 使用H5 CANVAS技术,解析当前页面并且生成Base64数据传入后台,后台将数据生成图片
     * @throws IOException
     */
    public static void test4() throws IOException {
        String base64ImgData = "后台传过来的Base64数据" ;
        String filePath = "d:/11.jpg";
        convertBase64DataToImage(base64ImgData, filePath);
    }


    /** 
     * 把base64图片数据转为本地图片 
     * @param base64ImgData 
     * @param filePath 
     * @throws IOException 
     */  
    public static void convertBase64DataToImage
            (String base64ImgData,String filePath) throws IOException {  
        BASE64Decoder d = new BASE64Decoder();  
        byte[] bs = d.decodeBuffer(base64ImgData);  
        FileOutputStream os = new FileOutputStream(filePath);  
        os.write(bs);  
        os.close();  
    }

你可能感兴趣的:(JavaEE)