缘起

一直想做一个无界面浏览器自动化的工具，用来实现三个小目标：

• 完善的CSS，JS，SVG支持，抓取渲染后的页面，实现截图
• 实现必要的页面交换，比如按钮点击，表单填写
• 无界面运行，跨平台

一通搜索之后，真的很详细了，列出了各种语言实现的无界面浏览器，基本都没有用过，只能根据开发的活跃度和github的星星数做一个简单筛选， Phantomjs和Nightmare进入了候选。Phantomjs之前接触过，思路还是很直接的，就是用js驱动webkit浏览器核心，星星1w+了，挺靠谱的应该。但是API真的比较原始，Nightmare最初应该是对Phantomjs的一次封装，从零星的网络介绍文章可以了解到这一点。上github主页看了看，8千多的星星，也不错。另外一个重大发现是已经和Phantomjs分道扬镳了，用了Electron这个当红炸子鸡，Phantomjs俨然被它推到了对立面，主页上正是两个工具的代码对比：

phantom.create(function (ph) {  ph.createPage(function (page) {    page.open('http://yahoo.com', function (status) {      page.evaluate(function () {        var el =          document.querySelector('input[title="Search"]');        el.value = 'github nightmare';      }, function (result) {        page.evaluate(function () {          var el = document.querySelector('.searchsubmit');          var event = document.createEvent('MouseEvent');          event.initEvent('click', true, false);          el.dispatchEvent(event);        }, function (result) {          ph.exit();        });      });    });  });});

看着嵌套，唉，是不是有点晕了。再看Nightmare的：

yield Nightmare()  .goto('http://yahoo.com')  .type('input[title="Search"]', 'github nightmare')  .click('.searchsubmit');

是不是很简单？！

另外，安装也很简洁，npm install nightmare 墙内的朋友如果npm安装不成功，就试试cnpm吧，安装 请看：

小试牛刀

因为nightmare是node驱动其工作，npm init 创建项目后，添加nightmare依赖，就可以开始编写node脚本，驱动Electron浏览器干活啦。登陆OSC，只需几行代码搞定：

var Nightmare = require('nightmare');var nightmare = Nightmare({ show: false });nightmare  .goto('https://www.oschina.net/')  .wait('footer')  .exists('div.user-info')  .then(function (result) {        if(!result)    {      return nightmare        .goto("https://www.oschina.net/home/login")        .wait("div.login-form")        .type("#userMail","红薯@oschina.net")        .type("#userPassword","hahaha")        .click("button.btn-login")        .wait(5000)        .exists("div.user-info")    }    else    {      console.log("已经是登陆状态了，不用登陆");      return nightmare.end();        }  })  .then(function(result) {      if(result && result == true)      {        console.log("登陆成功！")        return nightmare.end();      }      else      {        console.error('登陆失败');      }  })  .catch(function (error) {    console.error('异常:', error);  });

是不是代码都通俗易懂？

深入了解

文档已经比较清楚了： 另外再看看几个例子：

调试

个人在选型的时候，会很在意调试是否方便，不能断点调试的，都会自动进入待定区，打上一个问号。Nightmare,配合VSCode，调试实在太方便。

• 直接F5，选Nodejs脚本，然后配置下launch.js里的入口文件，设置断点
• var nightmare = Nightmare({ show: true}); //true表示显示Electron浏览器
• 启动调试，浏览器就跳出来了，按照脚本一步步运行，在断点就停下来了

结束语

本人接触Nightmare也就3天时间，深感这是一个好用的工具，又觉得中文的介绍都很旧了，所以写下这篇博文，希望抛砖引玉，大家共同研究，一起提高！