Article Detail

php结合phantomjs实现网页全屏截图

php代码快照生成-www.oicqzone.com * { margin: 0; padding: 0; } form { padding: 20px; }...

PHP 阅读 47.5万 4 分钟阅读 2017-04-24 14:11

php代码

<?php  
    if (isset($_GET['url']))  
    {  
        set_time_limit(0);  
  
        $url = trim($_GET['url']);  
        $filePath = md5($url).'.png';  
        if (is_file($filePath))  
        {  
            exit($filePath);  
        }  
  
        $command = "phantomjs snap.js {$url} {$filePath}";  
        @exec($command);  
  
        exit($filePath);  
    }  
?>  
  
<!DOCTYPE html>  
<html>  
<head>  
<meta charset="utf-8" />  
<meta name="viewport" content="width=device-width, initial-scale=1.0" />  
<meta name="keywords" content="" />  
<meta name="description" content="" />  
<title>快照生成-www.oicqzone.com</title>  
<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>  
<style>  
* {  
    margin: 0;  
    padding: 0;  
}  
  
form {  
    padding: 20px;  
}  
  
div {  
    margin: 20px 0 0;  
}  
  
input {  
    width: 200px;  
    padding: 4px 2px;  
}  
  
#placeholder {  
    display: none;  
}  
</style>  
</head>  
  
<body>  
    <form action="" id="form">  
        <input type="text" id="url" />  
        <button type="submit">生成快照</button>  
  
        <div>  
            <img src="" alt="" id="placeholder" />  
        </div>  
    </form>  
    <script>  
    $(function(){  
        $('#form').submit(function(){  
            if (typeof($(this).data('generate')) !== 'undefined' && $(this).data('generate') === true)  
            {  
                alert('正在生成网站快照，请耐心等待...');  
                return false;  
            }  
  
            $(this).data('generate', true);  
            $('button').text('正在生成快照...').attr('disabled', true);  
  
            $.ajax({  
                type: 'GET',  
                url: '?',  
                data: 'url=' + $('#url').val(),  
                success: function(data){  
                    $('#placeholder').attr('src', data).show();  
                    $('#form').data('generate', false);  
                    $('button').text('生成快照').attr('disabled', false);  
                }  
            });  
  
            return false;  
        });  
    });  
    </script>  
</body>  
</html>

以下保存为js文件，放在phantomjs同一目录下面。

var page = require('webpage').create(); 
var args = require('system').args; 
 
var url = args[1]; 
var filename = args[2]; 
 
page.open(url, function () { 
    page.render(filename); 
    phantom.exit(); 
});

我测试了下，大部分网站都能顺利截图，效果还不错，但是有一些登录以后才能访问的页面好像截取的只能是登录页，还有一些不能截取成功，一些图片加载的好像也截取不成功。

Comments 评论区

广西南宁市 2017-04-25 18:08

删除文件夹内所有大于24小时的文件的php代码
3600*24秒（一天）, 60*5 秒（5分钟）

function del_file($path = '.') {
    $current_dir = opendir($path);    //opendir()返回一个目录句柄,失败返回false
    while(($file = readdir($current_dir)) !== false) {    //readdir()返回打开目录句柄中的一个条目
        $sub_dir = $path . DIRECTORY_SEPARATOR . $file;    //构建子目录路径
        if($file == '.' || $file == '..') {
            continue;
        } else if(is_dir($sub_dir)) {    //如果是目录,进行递归
            del_file($sub_dir);
        } else {    //如果是文件,判断是24小时以前的文件进行删除
            $files = fopen($path.'/'.$file,"r");
            $f =fstat($files);
            fclose($files);
            if($f['mtime']<(time()-3600*24)){
                if(@unlink($path.'/'.$file)){
                    echo "删除文件【".$path.'/'.$file."】成功！<br />";
                }else{
                    echo "删除文件【".$path.'/'.$file."】失败！<br />";
                }
            }
        }
    }
}
del_file('d:/www');

#⁰

广西南宁市 2017-04-25 18:10

snap.js

var page = require('webpage').create();
var args = require('system').args; 
var url = 'https://lizhenqiu.com/article.php?id='+args[1]+'&getimg_now=1';
var urlname=args[2];
page.viewportSize = { width: 929, height: 768 };
page.open(url, function() {
  page.render('tmp/lizhenqiu.com-'+urlname+'.jpg');    //jpg图片质量比png差，png格式图片大
  phantom.exit();
});

#⁰

广西南宁市 2017-04-25 18:10

<?php

function del_file($path = '.') {
    $current_dir = opendir($path);    //opendir()返回一个目录句柄,失败返回false
    while(($file = readdir($current_dir)) !== false) {    //readdir()返回打开目录句柄中的一个条目
        $sub_dir = $path . DIRECTORY_SEPARATOR . $file;    //构建子目录路径
        if($file == '.' || $file == '..') {
            continue;
        } else if(is_dir($sub_dir)) {    //如果是目录,进行递归
            del_file($sub_dir);
        } else {    //如果是文件,判断是24小时以前的文件进行删除
            $files = fopen($path.'/'.$file,"r");
            $f =fstat($files);
            fclose($files);
            if($f['mtime']<(time()-60*15)){
                if(@unlink($path.'/'.$file)){
                    //echo "删除文件【".$path.'/'.$file."】成功！<br />";
                }else{
                    //echo "删除文件【".$path.'/'.$file."】失败！<br />";
                }
            }
        }
    }
}
del_file('tmp');



$ttime=time().rand(10000,99999);
$url=$_GET['get_img_url']+0;
$command = "phantomjs snap.js {$url} {$ttime}"; //上面提到的js文件的路径  和执行php同目录
exec($command,$out);
//$img_file = 'github.png';
//$img_info = getimagesize($img_file);
//$img_src = "data:{$img_info['mime']};base64," . base64_encode(file_get_contents($img_file));
//@unlink ($img_file);
echo $ttime;
exit;
//exit("<img src='{$img_src}' />");
?>

#⁰

广西南宁市 2017-04-25 18:12

浏览器屏幕前端截图截屏js项目php拓展phantomjs-2.1.1-windows

#⁰

Comment Form 留下评论

正在回复 #0

粘贴图片、拖拽文件，或点上面的按钮上传 图片会自动插入 [img] 标签，其他附件会自动插入 [attach] 标签。

正在上传...

提交前会先拉起旧项目同款第三方人机验证。

不再要求填写昵称；reply 会生成一条带楼层回链的新评论，quote 会附带完整引用块，并保持评论锚点跳转。