因为phantomjs使用了一个真正的渲染引擎WebKit,它能截取一个web页面的真实影像,这是因为phantomjs能够折射出WEB页面上的任何东西,包括html,css,svg和Canvas等。

新建一个JS文件,baidu.js。

// 写入以下内容
var page = require("webpage").create();
// 设置地址变量
var url='https://www.baidu.com' page.open(url,function(){
// 将该页面保存成图片
page.render("test.jpg");
phantom.exit();
}) 执行:
phantomjs baidu.js

  官方提供了一个更完整的将网页保存为图片的JS示例,文件名为rasterize.js ,在JS目录下的子目录examples下面。

  执行方法:phantomjs rasterize.js http://ariya.github.io/svg/tiger.svg tiger.png

当然你也可以通过page的属性来改变视口的大小

var page = require("webpage").create();
// 视口的尺寸就是无头浏览器的真正大小
page.viewportSize = {width:1024,height:768};
// clipRect 是要获取的页面部分大小
page.clipRect = {top:0,left:0,width:1024,height:768}; page.open("http://example.com/",function(){
page.render("github.png");
phantom.exit();
});

  

phantomJs页面截图的更多相关文章

  1. 微信图片生成插件,页面截图插件 html2canvas,截图失真 问题的解决方案

    html2canvas 是一个相当不错的 JavaScript 类库,它使用了 html5 和 css3 的一些新功能特性,实现了在客户端对网页进行截图的功能.html2canvas 通过获取页面的 ...

  2. 利用JavaScript将页面截图生成图片传给后台的插件:html2canvas

    利用JavaScript将页面截图生成图片传给后台的插件:html2canvas 一.总结 一句话总结: 10 <script type="text/javascript"& ...

  3. Chrome - 使用 开发者工具 对页面截图

    概述 使用 开发者工具 对页面截图 背景 经常需要截图 常用的截图模式有这些 窗口截图 区域截图 gif 问题 Chrome 如何截长图 firefox 好像有插件 1. 解决: 使用 Chrome ...

  4. Node.js & 页面截图 & 生成画报

    Node.js & 页面截图 & 生成画报 https://zzk.cnblogs.com/my/s/blogpost-p?Keywords=headless solution 使用 ...

  5. 通过phantomjs 进行页面截图

    本文章参考了使用phantomjs操作DOM并对页面进行截图需要注意的几个问题 及phantomjs使用说明 这两篇文章,初次接触phantomjs的童鞋可以去看下这两篇原文 在学习中可以看下 pha ...

  6. python+selenium自动化软件测试(第6章):selenium phantomjs页面解析使用

    我们都知道Selenium是一个Web的自动化测试工具,可以在多平台下操作多种浏览器进行各种动作,比如运行浏览器,访问页面,点击按钮,提交表单,浏览器窗口调整,鼠标右键和拖放动作,下拉框和对话框处理等 ...

  7. 使用html2canvas.js实现页面截图并显示或上传

    最近写项目有用到html2canvas.js,可以实现页面的截图功能,但遭遇了许多的坑,特此写一篇随笔记录一下. 在使用html2canvas时可能会遇到诸如只能截取可视化界面.截图没有背景色.svg ...

  8. JS 使用html2canvas实现页面截图功能

    html2canvas的官方文档地址:http://html2canvas.hertzen.com/ 实现原理:将需要截图的页面在canvas中进行重绘,这样将页面转换成图片的过程. 注意事项: 不支 ...

  9. phantomJs页面操作

    因为phantomjs能加载和操纵页面,它可以自动化地完美执行页面的各种操作. 操作文档: 脚本的被执行,就像它真的正在web 浏览器上运行一样. 下面的脚本,是读取元素id为myagent的文本内容 ...

随机推荐

  1. 【jQuery源码】事件委托

    jQuery的事件绑定有几个比较优秀的特点: 1. 可以绑定不限数量的处理函数 2. 事件可以委托到祖先节点,不必一定要绑到对应的节点,这样后添加的节点也照样能被处理. 3. 链式操作 下面主要分析事 ...

  2. ES6 箭头函数 this 指向

    ES6 箭头函数 this 指向 箭头函数有几个使用注意点: 函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象. 不可以当作构造函数,也就是说,不可以使用new命令,否则会抛出一个 ...

  3. ILSpy工具使用

    Reflector是.NET开发中必备的反编译工具.即使没有用在反编译领域,也常常用它来检查程序集的命名规范,命名空间是否合理,组织类型的方法是否需要改善.举例说明,它有一个可以查看程序集完整名称的功 ...

  4. apache的rewrite规则来实现URL末尾是否带斜杠

    1.url: http://www.test.com/user/ 跟:http://www.test.com/user 这两个URL对于用户来说应该是一样的,但从编程的角度来说,它们可以不相同 但我们 ...

  5. 玩转mongodb(五):mongodb 3.0+ 查询性能分析

    mongodb性能分析方法:explain() 为了演示的效果,我们先来创建一个有200万个文档的记录.(我自己的电脑耗了15分钟左右插入完成.如果你想插更多的文档也没问题,只要有耐心等就可以了.) ...

  6. SpringMVC源码阅读:视图解析器

    1.前言 SpringMVC是目前J2EE平台的主流Web框架,不熟悉的园友可以看SpringMVC源码阅读入门,它交代了SpringMVC的基础知识和源码阅读的技巧 本文将通过源码(基于Spring ...

  7. MySQL中You can't specify target table for update in FROM clause异常

    mysql中You can't specify target table <tbl> for update in FROM clause错误的意思是说,不能先select出同一表中的某些值 ...

  8. 为 Nginx 创建 windows 服务自启动

    1.下载最新版的 Windows Service Wrapper 程序 下载地址:http://download.java.net/maven/2/com/sun/winsw/winsw/1.9/ 2 ...

  9. SQL Server如何存储特殊字符、上标、下标

    测试验证特殊符号能否存入数据库中: 其中,像一些普通单位符号比如“ ° ′"﹩ $ ﹠ & £¥ ‰ % ℃ ¤ ¢℉”可以正常录入没有问题,但是万分号“‱”之上就不可以了,录入后显 ...

  10. 转载:SQL中的case when then else end用法

    SQL中的case when then else end用法 来源: http://www.cnblogs.com/prefect/p/5746624.html Case具有两种格式.简单Case函数 ...