Chrome 59 支持 Headless 模式,PhantomJS 开发者功成身退

1,649 阅读2分钟
原文链接: mp.weixin.qq.com
“  Chrome 59 将支持Headless模式。而在 Chrome 未提供原生 Headless 模式前,Web 开发者可以使用 PhantomJS 等第三方 Headless 浏览器。现在官方准备提供 Headless 了,PhantomJS 主要的贡献者 Vitaly Slobodin 随即在邮件列表上宣布辞职。


Headless 


Headless 提供一种无 GUI 的纯浏览器环境,也就是说它有一个完整的浏览器内核,包括js解析引擎,渲染引擎,请求处理等,但是不包括显示和用户交互页面的浏览器。这对于 Web 应用和网页的自动化测试非常有用。


浏览器的Headless模式让开发者可以通过命令行或是API操作,通常可以用于以下场景:


  • 无需浏览器的Web测试:在无需浏览器的情况下进行快速的Web测试,希望自动登录网站并做一些后续操作,然后检查结果是否正常。


  • 页面自动化操作:使用标准的DOM API或一些JavaScript框架(如jQuery)访问和操作Web页面。


  • 屏幕捕获:以编程方式抓起CSS、SVG和Canvas等页面内容,即可实现网络爬虫应用。构建服务端Web图形应用,如截图服务、矢量光栅图应用。


  • 网络监控:自动进行网络性能监控、跟踪页面加载情况以及将相关监控的信息以标准的HAR格式导出。


Headless Chrome


Headless Chrome 已经在 Chrome 59 中发布。目前,Chrome Canary 是唯一包含 Chrome 59 的渠道。也就是说如果现在你想要尝鲜,体验一下 Headless Chrome,就需要安装 Chrome Canary。将来 Chrome 的开发团队会把 Chrome 59 放到正式的 Chrome 发布版本中,就不需要再安装 Chrome Canary 了。


启动headless Chrome:

  $ chrome --headless --remote-debugging-port=9222 https://chromium.org


示例

结合nods.js,用Headless Chrome 抓取数据。使用Node.js中的chrome-remote-interface 包抽取页面的DOM:


const CDP = require('chrome-remote-interface');


CDP((client) => {

  // Extract used DevTools domains.

  const {Page, Runtime} = client;


  // Enable events on domains we are interested in.

  Promise.all([

    Page.enable()

  ]).then(() => {

    return Page.navigate({url: 'https://example.com'});

  });


  // Evaluate outerHTML after page has loaded.

  Page.loadEventFired(() => {

    Runtime.evaluate({expression: 'document.body.outerHTML'}).then((result) => {

      console.log(result.result.value);

      client.close();

    });

  });

}).on('error', (err) => {

  console.error('Cannot connect to browser:', err);

});




获知Chrome Headless模式的最新消息后,PhantomJS 最主要的贡献者也是目前仅有的开发者Vitaly Slobodin 决定退出Phantom的开发。



本文对你有帮助?欢迎扫码加入前端学习小组微信群: