phantomjs小试

本文作者：IMWeb 李冬冬 原文出处：IMWeb社区 未经同意，禁止转载

简单来说，phantomjs就是一个运行在node上的webkit内核，支持DOM渲染，css选择器，Canvas，SVG等，在浏览器上能做的事情，理论上，phantomjs 都能模拟做到。

phantomjs 使用场景：

页面自动化测试： 无需浏览器的情况下进行快速的Web测试，且支持很多测试框架，如YUI Test、Jasmine、WebDriver、Capybara、QUnit、Mocha等。 网页监控： 定期打开页面，检查网站是否正常加载，加载结果是否符合预期等 页面截图：以编程方式抓起CSS、SVG和Canvas等页面内容 网络爬虫：抓取网络页面

start

在官网直接下载phantomjs。windows环境直接下载exe文件，解压，运行

http://phantomjs.org/download.html

来个截图小demo

由于phantomjs相当于一个没有UI的浏览器，可以抓取url下的所有内容，并渲染。因此，网络截图，对于phantomjs来说，就不费劲了。

代码语言：javascript复制

var page = require('webpage').create();
var url = 'http://ke.qq.com';
page.open(url, function (status) {
  page.render('index.png');
  phantom.exit();
});

保存文件为capture.js，在终端运行 phantomjs catpure.js ，然后就可以在同目录下看到高大上的腾讯课堂首页的图片了。

phantomjs 实现登录

在写一些爬虫程序的时候，可能会需要先登录系统，获取登录的cookie。如果有node request 或是java 写的话，需要去了解系统本身的登录逻辑，实现起来比较困难，特别是登录设计复杂的时候。用phantomjs 实现登录要简单很多，加载登录页面后，在evalutae 包裹的沙箱内，直接对页面进行登录信息的写入，并模拟登记的行为，之后的跳转、cookie set等就直接交给phantomjs 完成。

下面是一个用phantomjs实现小米商城登录的栗子：

代码语言：javascript复制

var page = require('webpage').create(),
    testindex = 0,
    loadInProgress = false;

page.onLoadStarted = function() {
    loadInProgress = true;
     console.log("load started");
};

page.onLoadFinished = function() {
    loadInProgress = false;
      console.log("load finished");
};

var steps = [
    function() {
      //Load Login Page
      page.open("https://account.xiaomi.com/pass/serviceLogin");
    },
    function() {
        page.evaluate(function(obj) {
            var form = document.getElementById("miniLogin");
            form.elements["miniLogin_username"].value = '用户名';
            form.elements["miniLogin_pwd"].value = '密码';
            form.elements['message_LOGIN_IMMEDIATELY'].click();
            return document.title;
        });
        loadInProgress = true;
    },
    function() {
        page.render('login-succ.png');
    }
];

var interval = setInterval(function() {
    if (!loadInProgress && typeof steps[testindex] == "function") {
        steps[testindex]();
        testindex  ;
    }
    if (typeof steps[testindex] != "function") {
        phantom.exit();
    }
}, 10);

在终端执行phantomjs 命令，最后，可以看到登录后的页面截图

延伸阅读

CasperJS：一个开源的导航脚本处理和高级测试工具

svg canvas javascript node.js 网络安全

0 人点赞