java 使用html2canvas实现屏幕截图

最新推荐文章于 2024-08-21 19:59:11 发布

洋葱花瓣

最新推荐文章于 2024-08-21 19:59:11 发布

阅读量3.8k

点赞数 1

分类专栏： html 文章标签： html2canva js-截图 canvas java

本文链接：https://blog.csdn.net/u012151597/article/details/53066699

版权

html 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

知识点参考：
http://www.cnblogs.com/dreammyle/p/4872574.html

案列：

前段使用jsp页面，处理代码为Controller层代码。
js插件：
1、jquery-2.1.4.min.js
2、html2canvas.js

<%@ page language="java" pageEncoding="UTF-8"%><html>
    <head>
    <script type="text/javascript" src="../../frame/js/jquery/jquery-2.1.4.min.js"></script>
    <script type="text/javascript" src="../../frame/js/html2canvas.js"></script></head>
<body>
  <input type="button" class="button" value="屏幕截图" id="addPolyline" onclick="snapscreen()"/>
    <script type="text/javascript">
        function snapscreen(){
            html2canvas(document.body, {
                allowTaint: true, 
                taintTest: false,
                onrendered: function(canvas){
                    var dataUrl = canvas.toDataURL("image/png"); 
                    $.ajax({
                        url:'http://cmis:8080/cmisplat/snapCapture/snapscreen',
                        type:'POST',
                        data:{
                            base64ImgData : JSON.stringify(dataUrl)
                        },
                        success:function(msg){

                        },
                        error:function(XMLHttpRequest){
                            alert( "Error: " + XMLHttpRequest.responseText); 
                        }
                    });
                }
            });
        }
    </script>
</body>
</html>

Controller层代码：
注意：代码中使用到了sun.misc.BASE64Decoder类，在MyEclipse中会报错，需要进行几步操作：
第一步
这里写图片描述
第二步：选中Access rules,点击edit

第三步选择Accessible **

import java.io.File;
import java.io.PrintWriter;
import java.util.Date;
import java.util.HashMap;
import java.util.Map;

import org.apache.commons.io.FileUtils;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;

import sun.misc.BASE64Decoder;

import com.newsoft.utils.JSONTool;

@Controller
@RequestMapping("/snapCapture")
public class SnapScreenController {

    @RequestMapping("/snapscreen")
    public void snapscreen(PrintWriter writer,String base64ImgData,
            Integer stationno,Integer laneno,Date ccollecttime,String recordid) {
        Map<String, Object> map = new HashMap<String, Object>();
        boolean flag = false;
        String msg = "截屏失败";

        try {
                //BASE64Decoder会报错，Myeclipse中需要开启对此类的使用
                BASE64Decoder d = new BASE64Decoder();
                //去掉头部声明
                base64ImgData = base64ImgData.substring(base64ImgData.indexOf(",")+1);
                byte[] bs = d.decodeBuffer(base64ImgData);
                String snapScreenPath = "F:\\screen.png";
                //保存图片到本地
                //org.apache.commons.io.FileUtils;
                FileUtils.writeByteArrayToFile(new File(snapScreenPath), bs);

        } catch (Exception e) {
            e.printStackTrace();
            flag = false;
            msg = "截屏失败!失败原因:" + e.getMessage();
        }

        map.put("success", flag);
        map.put("msg", msg);
        writer.write(JSONTool.toJson(map));
    }
}