因为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. 《LeetBook》leetcode题解(17):Letter Combinations of a Phone Number[M]

    我现在在做一个叫<leetbook>的免费开源书项目,力求提供最易懂的中文思路,目前把解题思路都同步更新到gitbook上了,需要的同学可以去看看 书的地址:https://hk029.g ...

  2. MyEclipse *的下载

    找到MyEclipse的各种历史版本下载页面 : MyEclipse官方中文网 欢迎大家,加入我的微信公众号:大数据躺过的坑        人工智能躺过的坑       同时,大家可以关注我的个人博客 ...

  3. Scope及其子类介绍

    之前写的文章: 关于作用域范围Scope Scope及相关的子类如下: 同时有些Scope还继承了Scope.ScopeListener类,如下: 1.StarImportScope及ImportSc ...

  4. kafka报错处理

    Kafka报错处理 1.   记一次kafka报错处理   Kafka停止后,再启动的时候发生了报错: [2017-10-27 09:43:18,313] INFO Recovering unflus ...

  5. SSH和SSL比较

    一.SSH介绍 什么是SSH? 传统的网络服务程序,如:ftp.pop和telnet在本质上都是不安全的,因为它们在网络上用明文传送口令和数据, 别有用心的人非常容易就可以截 获这些口令和数据.而且, ...

  6. 1000. A-B

    1000. A-B -----> http://soj.me/1000 Constraints Time Limit: 1 secs, Memory Limit: 32 MB Descripti ...

  7. win7 iis7 asp.net 编译器错误消息: CS0016:

    编译器错误消息: CS0016: 未能写入输出文件“c:/Windows/Microsoft.NET/Framework/v2.0.50727/Temporary ASP.NET Files/root ...

  8. 如何编写makefile文件

    最近一直在学习makefile是如何编写的.       当我们写的程序文件比较少的时候,敲入gcc /g++,当你在大型工程中,在一个个编译文件的话,你可能就会很郁闷.linux有一个自带的make ...

  9. 撩课-Web大前端每天5道面试题-Day21

    1.对async.await的理解,内部原理? ①async---声明一个异步函数: 自动将常规函数转换成promise,返回值也是一个promise对象, 只有async函数内部的异步操作执行完,才 ...

  10. 湘潭校赛 Bob's Problem

    Bob's Problem Accepted : 18   Submit : 115 Time Limit : 1000 MS   Memory Limit : 65536 KB  题目描述 Bob今 ...