phantomjs截取网页截图

  • 场景
    有一个视频播放地址,需要对该网页进行截图

  • 解决思路:
    1.将视频下载到本地,使用ffmpeg进行处理
    2.使用phantomjs,phantomjs内置了webkit浏览器引擎,phantomjs可以模拟浏览器打开视频地址,然后进行整个网页的截图。

WebKit 是一个开源的浏览器引擎,与之相对应的引擎有Gecko(Mozilla Firefox 等使用)和Trident(也称MSHTML,IE 使用)

  • 选择
    第一个方案,ffmpeg只能处理本地视频或者处理RTCP直播流,同时要求的视频直播地址中有部分是直播流,有部分是组件渲染,所以该方案不可行。
    因此选择第二个方案。

  • phantomjs进行网页截图,这里以window平台为例
    1.首先,去phantomjs官网下载页面下载phantomjs程序,支持window、mac os、linux、freebsd平台。
    2.将下载下来的phantomjs添加系统环境变量里
    3.编写js文件capture.js

    "use strict";  //严格模式var page = require('webpage').create();
    var system = require('system');
    page.viewportSize = {width : 1024,height : 720
    };if (system.args.length < 3) {console.log('param must greater 2');phantom.exit();
    } else{var url = system.args[1];  //远程视频地址var saveFile = system.args[2];  //保存截图的文件路径page.open(url, function(status) {if (status == 'success'){// 通过在JS获取页面的渲染高度var rect = page.evaluate(function () {return document.getElementsByTagName('html')[0].getBoundingClientRect();});// 按照实际页面的高度,设定渲染的宽高page.clipRect = {top:    rect.top,left:   rect.left,width:  rect.width,height: rect.height};setTimeout(function() {var result = page.render(saveFile);page.close();console.log(result);phantom.exit();}, 1000);  //延迟截图时间}})
    }

    4.在php中进行调用

    $url = 'http://xxx';
    $savePath = 'c:\test.png';
    $jsPath = 'c:\phantomjs.js';
    $command = "phantomjs {$jsPath}  {$url}  {$savePath}";
    $result = @exec($command );

    这样就对网页进行截图,保存截图在指定路径中。

    另外:有大神在github上提交了个操作phantomjs的php类库,可以参考使用:

    https://github.com/jonnnnyw/php-phantomjs
    http://jonnnnyw.github.io/php-phantomjs/4.0/2-installation/

参考自:
http://phantomjs.org/download.html
http://phantomjs.org/api/webpage/method/render.html

代码实例:

phantomjs和slimerjs,两款都是服务器端的js,简单说来,都是封装了浏览器解析引擎,不同是phantomjs封装的 webkti,slimerjs封装的是Gecko(firefox)。 权衡利弊,决定研究下phantomjs,于是就用phantomjs实现了网 站快照生成。phantomjs的项目地址是:http://phantomjs.org/

代码涉及两个部分,一个是设计业务的index.php,另一个是生成快照的js脚本snapshot.js。代码比较简单,仅仅是实现了功能,没有做过多的修饰。代码分别如下所示:

php:

<?phpif (isset($_GET['url'])){set_time_limit(0);$url = trim($_GET['url']);$filePath = "./cache/".md5($url).'.png';if (is_file($filePath)){exit($filePath);}$command = "phantomjs/bin/phantomjs snapshot.js {$url} {$filePath}";exec($command);exit($filePath);}
?>

html

<!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>快照生成</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>

php利用CutyCapt实现网页高清截图 :

网页截图功能,必须安装IE+CutyCapturl:要截图的网页out:图片保存路径path:CutyCapt路径cmd:CutyCapt执行命令比如:http://你php路径.php?url=http://XX.com

<?php
/*
网页截图功能,必须安装IE+CutyCapt
url:要截图的网页
out:图片保存路径
path:CutyCapt路径
cmd:CutyCapt执行命令
比如:http://你php路径.php?url=http://niutuku9.com/
*/
$url=$_GET["url"];
$imgname=str_replace('http://','',$url);
$imgname=str_replace('https://','',$imgname);
$imgname=str_replace('.','-',$imgname);
$out = 'D:/webroot/test/'.$imgname.'.png';
$path = 'D:/webserver/CutyCapt.exe';
$cmd = "$path --url=$url --out=$out";
echo $cmd;
system($cmd);
?>
CutyCapt下载地址:http://sourceforge.net/projects/cutycapt/files/cutycapt/windows的不用安装的,直接下载解压放到相对应的路径即可linux安装CutyCapt教程:http://niutuku9.com/tech/php/273578.shtml

整理参考来自:软盟网

PHP网页截取快照:PHP截取网站网页保存为一张图片实现。相关推荐

  1. 登录iis7 网站服务器上网站网页可以访问 但远程访问网站网页不能访问的解决方法

    原来是防火墙对端口的限制,解决方案如下: 1.防火墙-->高级设置-->入站规则-->右边的新建规则-->端口-->选择TCP-->特定本地端口(填写你的端口 如4 ...

  2. 响应已被截断_技术:RWD响应式网站网页设计基本原则

    响应式网站网页设计 RWD响应式网站网页设计对于解决多尺寸屏幕问题是个很好的解决方案,从平面的角度切入需克服很多困难,没有固定的页面尺寸.没有毫米或英寸,没有任何限制会让人感到无从下手.随着建立网站的 ...

  3. javascript网页设计期末作业 购物网站

    本次主要介绍下之前上传的作业的主要功能,网页下载地址: 网页设计期末作业 购物网站 如果对本文章内容还有疑问可以观看视频,也可以在评论区留言: javascript 网页设计期末作业 购物网站 网页实 ...

  4. QQ浏览器怎么截取整个网页 QQ浏览器完整截取网页的方法

    浏览器在我们工作娱乐的时候给我们带来了许多便利,在我们浏览网页时可能有这样的需求,将某个页面的内容截取成图片,而QQ截图功能只能实现局部截图,因此这时候我们可以考虑使用流量器自带的截图工具,这里用QQ ...

  5. asp数据库操作大全 [网站网页]

    什么叫活动服务器组件(Active Server Compontents)?组件是基于Activex技术的代码片断,通过指定接口提供指定的一组服务,组件供给客户端(Clients)在运行时候请求的对象 ...

  6. 利用wget 抓取 网站网页 包括css背景图片

    利用wget 抓取 网站网页 包括css背景图片 wget是一款非常优秀的http/ftp下载工具,它功能强大,而且几乎所有的unix系统上都有.不过用它来dump比较现代的网站会有一个问题:不支持c ...

  7. 网站网页编写需要注意哪些问题?

    在网站建设过程中对网页的制作必须按照一定的步骤进行制作,这样才不会显得网站页面太过杂乱,以便根据网站建设的习惯性制作好网页以及素材图片融合等内容.那么在网站页面制作的过程中需要注意哪些问题呢?下面就为 ...

  8. 怎么把一个网页作为背景套在另一个网页上_设计科技公司网站背景的六个小技巧...

    我们都知道,任何网站的背景对于网站如何影响我们都至关重要,尤其是在设计科技公司网站的时候表现的更加明显.背景对访问者及其用户对网站的认知程度有多大影响.以前网站没有背景,内容被放置在纯白色背景上.但是 ...

  9. 提交数据网页设计_网站网页编写需要注意哪些问题?

    在网站建设过程中对网页的制作必须按照一定的步骤进行制作,这样才不会显得网站页面太过杂乱,以便根据网站建设的习惯性制作好网页以及素材图片融合等内容.就以大连网龙科技旗下产品云霸屏为例来讲,云霸屏作为一款 ...

最新文章

  1. 李白打酒c语言编程,搞定了“李白打酒”,还原问题都迎刃而解
  2. 每个程序员都必须知道的 8 种数据结构
  3. 超级网管员原有QQ群己满,现增加新群
  4. Linux (四)其他一些服务的实现
  5. java 获取excel最后一行_查找Excel电子表格中的最后一行
  6. 连招 横版 flash 游戏_街机游戏中的无限连究竟有多变态?有种对决叫作没开始就结束了!...
  7. pjk static tp.php,在测试服上偶然出现 Error: Loading chunk 5 failed.
  8. pscc2021绿色免安装完整版
  9. linux内存中的文件权限,Linux系统管理(用户权限、磁盘存储、文件系统、内存、进程)...
  10. 概率分布函数--二项分布poisson分布
  11. 程序猿的移民加拿大后的所感
  12. 计算机访问记录怎么查,电脑上微信有访客记录吗?我们要怎么查看访客?
  13. 基于微信小程序的疫情智慧社区管理系统 计算机毕业设计 后台管理系统
  14. 百度android模拟器下载地址,百度手机助手电脑版怎么下载 安卓模拟器电脑版下载地址...
  15. 【00】processing-历史(中文)
  16. Web前端开发规范文档(更新于2013-01-13)
  17. NKCTF[eazy_baby_apk](DES名字的AES
  18. python 练习题目
  19. 保存chrome主题背景的图片
  20. 【python】70行代码,实现 GTA侠盗猎车 按键组合触发 作弊码。附源码 及 效果图

热门文章

  1. java roundup函数_Excel函数(2)if、rand、round函数
  2. Windows10蓝牙突然失灵 无法连接鼠标
  3. fluxion-wifi破解/钓鱼
  4. JS clientX、offsetX、pageX、screenX
  5. 一台电脑上配置多个git账号(gitee),向不同git线上仓库提交(命令行/TortoiseGit同时) 代码
  6. Ubuntu18.04安装ntl库
  7. [MP3]MP3固件持续分享(2019.1.25)
  8. instagram获取图片地址和视频地址
  9. 移动端微信浏览器调试工具整理eruda,微信x5调试工具无法使用,推荐新工具eruda、vconsole和debugxweb
  10. 清华操作系统实验lab1