zoukankan      html  css  js  c++  java
  • 前端的截图功能

    依赖:html2canvas

    function dataURLtoFile(dataurl, filename) {
     
            var arr = dataurl.split(','),
                mime = arr[0].match(/:(.*?);/)[1],
                bstr = atob(arr[1]), 
                n = bstr.length, 
                u8arr = new Uint8Array(n);
                
            while(n--){
                u8arr[n] = bstr.charCodeAt(n);
            }
            
            return new File([u8arr], filename, {type:mime});
        }
        
        //Usage example:
        
    
    function takeScreenshot() {
        html2canvas(document.body,{
    	 allowTaint: true,
         foreignObjectRendering: true
    	}).then(function(canvas) {
    		//document.body.appendChild(canvas);
    		var dataurl=canvas.toDataURL();
    		var file = dataURLtoFile(dataurl,'cap.png');
    		//var url = window.URL.createObjectURL(file);
    		var a = document.createElement('a');
    		var url = window.URL.createObjectURL(file);
    		var filename = 'cap.png';
    		a.href = url;
    		a.download = filename;
    		a.click();
    		window.URL.revokeObjectURL(url);
    		console.log(url);
    		
    	});
    }
    

      

  • 相关阅读:
    map侧连接
    二次排序
    倒排索引
    多表关联
    单表关联
    Shuffle
    Partitioner
    Combiner
    CSS3中的多列
    CSS3动画
  • 原文地址:https://www.cnblogs.com/yiyi17/p/12118936.html
Copyright © 2011-2022 走看看