使用phantomjs对页面进行截图
本文章参考了使用phantomjs操作DOM并对页面进行截图需要注意的几个问题 及 phantomjs使用说明 这两篇文章,初次接触phantomjs的童鞋可以去看下这两篇原文
在学习中可以看下 phantomjs官方相关示例
phantomjs是一个无界面浏览器,可用于网页截图和前端自动化测试,基于webkit内核(也就是chrome使用的内核),并使用js编写业务脚本来请求、浏览和操作页面。
1、安装phantomjs
下载phantomjs(官网下载),选择自己需要的版本下载即可,我这里是在windows下使用的,下载后直接解压,为了方便我将包含phantomjs.exe的目标路径添加到了环境变量里面,后续使用比较方便。
安装完成后在cmd里面输入phantomjs --version即可查看phantomjs版本信息。
2、phantomjs使用
phantomjs有标准的入门文档可以参考,网上也有很多的资料可以查阅,在使用过程中根据自己的需要实际操作。
我们这里主要是对文章开头提到到第一篇文章的仿照实现,所以理论和相关的注意事项可以参考文章引用的第一篇文章。
操作界面中的DOM树主要使用使用
- evaluate(function, arg1, arg2, ...) {object}
在截图中如何将整个界面截图,有如下几种方法:
一个是使浏览器足够大,这样底部就显示了,可以设置viewPortSize很大:page.viewportSize = {width: 4800,height: 8000};
另一个是通过BOM方法操作滚动条,可以把滚动条滚动到一个很大的值,如:window.scrollTo(0,10000);也可以滚动到适应的高度:window.document.body.scrollTop = document.body.scrollHeight;
如何延迟截图,页面请求的资源,如图片、异步cgi、js等,返回的时间以及执行的长短都是不确定的,如果截图过早,可能很多空白区域,因此需要定时截图,在打开页面后,使用setTimeout来延迟截图
- window.setTimeout(function () {
- page.render("test.png");
- phantom.exit();
- }, 1000);
完整的代码,请求搜狗搜索微信的公众账号信息,并对连接标记红框、延迟截图
- var page = require('webpage').create();
- system = require('system');
- //var url = 'http://yule.club.sohu.com/gifttrade/thread/2m2efbrpfui';
- var address;
- if(system.args.length == 1){
- phantom.exit();
- }else{
- adress = system.args[1];
- page.open(adress, function (status){
- if (status != "success"){
- console.log('FAIL to load the address');
- phantom.exit();
- }
- page.evaluate(function(){
- //此函数在目标页面执行的,上下文环境非本phantomjs,所以不能用到这个js中其他变量
- window.scrollTo(0,10000);//滚动到底部
- //window.document.body.scrollTop = document.body.scrollHeight;
- window.setTimeout(function(){
- var plist = document.querySelectorAll("a");
- var len = plist.length;
- while(len)
- {
- len--;
- var el = plist[len];
- el.style.border = "1px solid red";
- }
- },5000);
- });
- window.setTimeout(function (){
- //在本地生成截图
- page.render("json2form.png");
- console.log(page.content);
- phantom.exit();
- }, 5000+500);
- });
- }
这里附上java操作phantomjs的代码:
- package com.newsTest.weixin;
- import java.io.BufferedReader;
- import java.io.IOException;
- import java.io.InputStream;
- import java.io.InputStreamReader;
- /**
- * 类名: DownLoad
- * 包名: com.newsTest.weixin
- * 作者: zhouyh
- * 时间: 2014-9-10 下午04:19:46
- * 描述: TODO(这里用一句话描述这个类的作用)
- */
- public class DynamicDownLoad {
- /**
- *
- * 方法名:getSrcContent
- * 作者:zhouyh
- * 创建时间:2014-9-10 下午06:57:32
- * 描述:根据传入的url,调用phantomjs进行下载,并返回源码信息
- * @param url
- * @return
- */
- public static String getSrcContent(String url){
- //windows下phantomjs位置
- String path = "D:/phantomjs-1.9.7-windows/";
- Runtime rt = Runtime.getRuntime();
- Process process = null;
- try {
- process = rt.exec(path + "phantomjs.exe D:/phantomjs-1.9.7-windows/test.js " + url.trim());
- } catch (IOException e) {
- // TODO 这里写异常处理的代码
- e.printStackTrace();
- }
- InputStream is = process.getInputStream();
- BufferedReader br = new BufferedReader(new InputStreamReader(is));
- StringBuffer sbf = new StringBuffer();
- String tmp = "";
- try {
- while((tmp = br.readLine())!=null){
- sbf.append(tmp);
- }
- } catch (IOException e) {
- // TODO 这里写异常处理的代码
- e.printStackTrace();
- }
- return sbf.toString();
- }
- /**
- * 方法名:main
- * 作者:zhouyh
- * 创建时间:2014-9-10 下午04:19:46
- * 描述:TODO(这里用一句话描述这个方法的作用)
- * @param args
- * @throws IOException
- */
- public static void main(String[] args){
- // TODO Auto-generated method stub
- String src = DynamicDownLoad.getSrcContent("http://weixin.sogou.com/gzh?openid=oIWsFt9MmzCvfJgaVxEUevPcuUCg");
- System.out.println(src);
- }
- }
在使用中还有很多需要学习的地方,希望下次有机会可以深入的学习下phantomjs,附上截图照片
最新文章
- MySQL运行状态show status中文详解(转)
- 使用R进行倾向得分匹配
- Equals Finalize GetHashCode GetType MemberwiseClone ReferenceEquals ToString String.IsInterned
- Mybaits学习总结1
- robotframework笔记3--如何编写好的测试用例使用机器人的框架
- cdev、udev
- Codeforces 583D. Once Again... (LIS变形)
- hdoj 5461 Largest Point
- 每天200亿次查询 – MongoDB在奇虎360【转】
- MySQL缓存之Qcache与buffer pool对比
- MySQL主从复制_复制过滤
- TypeError: Error #1034: 强制转换类型失败:无法将 ";0.49"; 转换为 mx.graphics.IFill。
- CF809E Surprise me!(莫比乌斯反演+Dp(乱搞?))
- deepin 安装scrapy安装出错:fatal error: Python.h 的解决办法
- 结对作业收获_core组
- BZOJ3687: 简单题(dp+bitset)
- laravel 守护进程Supervisor的配置
- 【模板】K短路 A-star
- AIX挂载NFS写入效率低效解决
- dup等复制文件描述符函数
热门文章
- 【译】Android系统简介—— Activity
- Oracle使用%rowtype变量存储一行数据
- [搜片神器]winform程序自己如何更新自己的方法代码
- sqlserver 2008 卸载时提示 “重新启动计算机”失败
- Linux ";ls -l";文件列表权限详解
- 出现错误:Unable to load configuration. - action - file:/E:/Java/Tomcat7.0/apache-tomcat-7.0.68-windows-x64/apache-tomcat-7.0.68/webapps/SSH2Integrate/WEB-INF/classes/struts.xml:8:43
- 【递推】BZOJ 1088: [SCOI2005]扫雷Mine
- 一些css效果积累
- [转载]C#获取本机IPv4地址
- source Insight注册码