1. 一个无界浏览器内核: PhantomJS + CasperJS

PhantomJS官方网站: http://phantomjs.org/
API: https://github.com/ariya/phantomjs/wiki/API-Reference
Doc: https://github.com/ariya/phantomjs/wiki
CasperJS,基于PhantomJS的 工具包 http://www.cnblogs.com/ziyunfei/archive/2012/09/27/2706254.html

配置: Linux把PhantomJS加入到环境变量,window的直接运行exe文件。

PhantomJS简单教程: http://javascript.ruanyifeng.com/tool/phantomjs.html(很不错)


NodeJS + PhantomJS 抓取页面信息以及截图 http://www.cnblogs.com/justany/p/3279717.html
PhantomJS1.7 API http://www.cnblogs.com/ziyunfei/archive/2012/09/28/2705369.html

利用phantomjs+casperjs实现登陆抓取网页并截图 http://my.oschina.net/jiuxiaoyao/blog/148456

利用phantomjs将HTML源代码转换成图片 http://neoremind.net/2013/02/%E5%88%A9%E7%94%A8phantomjs%E5%B0%86html%E6%BA%90%E4%BB%A3%E7%A0%81%E8%BD%AC%E6%8D%A2%E6%88%90%E5%9B%BE%E7%89%87/
PhantomJS是一个无界面的WebKit浏览器引擎,还有配套的JavaScript API.它原生支持各种web标准技术: DOM处理, CSS选择器, JSON, Canvas, 以及SVG.
通常我们的需求是将网页渲染成图片保存,那么也会有这样的情况,将HTML源代码转换成图片,下面的代码将满足需求:
Js代码
/**
 * phantomjs /home/pandy/phantomjs/texttoimage.js http://192.168.0.198:8080/dev_cpm/staff/staffHome staffHome
 * @type {*}
 */

var webpage = require('webpage');
var system = require('system');
var url=system.args[1];
var fileName=system.args[2];

if(url==undefined){
    page.close();
    phantom.exit();
}

if(fileName==undefined){
    fileName="test";
    //page.close();
    //phantom.exit();
}


page = webpage.create();
//设定页面载入时候的窗体大小
page.viewportSize = { width: 1366, height: 800 };
//设定截图的区域
page.clipRect = { top: 0, left: 0, width: 1366, height: 800 };

page.settings = {
    javascriptEnabled: true,//有时候这个参数会影响截图
    loadImages: true,
    userAgent: 'Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.31 (KHTML, like Gecko) PhantomJS/19.0'
};

page.open(url, function (status) {
    var data;
    if (status === 'fail') {
        console.log('open page fail!');
    } else {
        page.render('./phantomjs/'+fileName+'.png');
        console.log(page.renderBase64());//打印出图片的base64编码
    }
    page.close();
    phantom.exit();
});
 

保存成texttoimage.js
运行: phantomjs /home/pandy/phantomjs/texttoimage.js http://192.168.0.198:8080/dev_cpm/staff/staffHome staffHome
图片保存到newimage.png中
一个问题: 有时候设定javascriptEnabled是true的时候,无法截图,还弄不清楚什么原因.



loadspeed.js脚本加载一个特殊的URL (不要忘了http协议) 并且计量加载该页面的时间。
var page = require('webpage').create(),
    system = require('system'),
    t, address;

if (system.args.length === 1) {
    console.log('Usage: loadspeed.js <some URL>');
    phantom.exit();
}

t = Date.now();
address = system.args[1];
page.open(address, function (status) {
    if (status !== 'success') {
        console.log('FAIL to load the address');
    } else {
        t = Date.now() - t;
        console.log('Loading time ' + t + ' msec');
    }
    phantom.exit();
});

你可能感兴趣的:(浏览器)