Puppeteer and selenium

会后空翻的跳跳虎
674 阅读4分钟

简介

Puppeteer(中文翻译"木偶") 是 Google Chrome 团队官方的无界面（Headless）Chrome 工具，它是一个 Node 库，提供了一个高级的 API 来控制DevTools协议上的无头版（link.jianshu.com?t=https%3A%2F%2Fchromedevtools.github.io%2Fdevtools-protocol%2F） Chrome 。也可以配置为使用完整（非无头）的 Chrome。 Chrome素来在浏览器界稳执牛耳，因此，Chrome Headless 必将成为 web 应用自动化测试的行业标杆。使用Puppeteer，相当于同时具有 Linux 和 Chrome 双端的操作能力，应用场景可谓非常之多。此仓库的建立，即是尝试各种折腾使用 GoogleChrome Puppeteer；以期在好玩的同时，学到更多有意思的操作。


Puppeteer能做些什么

你可以在浏览器中手动完成的大部分事情都可以使用Puppeteer完成！

  • 生成页面的截图和PDF。
  • 抓取SPA并生成预先呈现的内容（即“SSR”）。
  • 从网站抓取你需要的内容。
  • 自动表单提交，UI测试，键盘输入等
  • 创建一个最新的自动化测试环境。使用最新的JavaScript和浏览器功能，直接在最新版本的Chrome中运行测试。
  • 捕获您的网站的时间线跟踪，以帮助诊断性能问题。


入门

想要在项目中使用 Puppeteer，只需要运行如下命令安装即可；不过要注意的是：Puppeteer 至少需要 Node v6.4.0，如要使用 async / await，只有 Node v7.6.0 或更高版本才支持；另外，安装 Puppeteer 时，它会下载最新版本的 Chromium（〜71Mb Mac，〜90Mb Linux，〜110Mb Win），保证与 API 协同工作。

yarn add puppeteer
# or 
npm i puppeteer

现在想知道具体怎么使用Puppeteer？这非常之容易；

const puppeteer = require('puppeteer');
(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.goto('https://example.com');
  await page.screenshot({path: 'example.png'});
  await browser.close();
})();

此示例，即实现了：导航到 https://example.com 并将截屏保存为 example.png；


Scene1：自动抓取网站文章分享至指定网站

项目地址：github.com/nicejade/to…

步骤简述

  • [X] 打开技术头条-提交页面，同时到网站中随机抓取一篇文章，获取到标题、地址、描述。
  • [X] 模拟人为操作，点开“用微博登录”按钮(会跳转至微博登录页面)；
  • [X] 模拟人为操作，填充用户名和密码并“点击”登录按钮，完成登录(会重新跳转至技术头条-提交页面)；
  • [X] 模拟人为操作，填充之前获取到的标题、地址、描述，并“点击”提交，打完收工。
  • [X] 将其部署于服务器，并设置任务，定时间隔性执行，完成自动按时分享。


Scene2：用Puppeteer Trace做性能分析

可以使用 tracing.start 和 tracing.stop 创建一个可以在 Chrome 开发工具或时间线查看器中打开的跟踪文件(每个浏览器一次只能激活一个跟踪)，具体参见 Puppeteer Trace Api。

await page.tracing.start({path: 'trace.json'})
await page.goto('https://www.google.com')
await page.tracing.stop()

项目地址：github.com/nicejade/to…

image.png

更多示例可参考 GoogleChrome Puppeteer Usage；在略为熟悉 Puppeteer的 Api 之后，即可用来她操纵浏览器，来为你做些你想搞的事儿；不过值得一提的是，她现在还处于开发阶段，随着版本的更替，Api 接口也有可能会跟着略有变动。


现在说说什么是selenium

selenium是一个用于web应用程序的自动化测试工具，Selenium测试直接运行在浏览器中，就像真正的用户在操作一样。支持的浏览器包括IE（7, 8, 9, 10, 11），Mozilla Firefox，Safari，Google Chrome，Opera等。selenium 是一套完整的web应用程序测试系统，包含了测试的录制（selenium IDE）,编写及运行（Selenium Remote Control）和测试的并行处理（Selenium Grid）。 Selenium的核心Selenium Core基于JsUnit，完全由JavaScript编写，因此可以用于任何支持JavaScript的浏览器上。 selenium可以模拟真实浏览器，自动化测试工具，支持多种浏览器，爬虫中主要用来解决JavaScript渲染问题。


这里要说一下比较重要的PhantomJS,PhantomJS是一个而基于WebKit的服务端JavaScript API,支持Web而不需要浏览器支持，其快速、原生支持各种Web标准：Dom处理，CSS选择器，JSON等等。PhantomJS可以用用于页面自动化、网络监测、网页截屏，以及无界面测试


如何使用

  1. 安装第三方库   pip install selenium
  2. 为你的测试浏览器下载驱动，以Chrome为例去百度搜索Chrome webdrive下载并解压到python安装目录scripts下
  3. 开始
from selenium import webdrive
browser = webdrive.Chrome()
browser.get('http://www.baidu.com')

这时就打开了Chrome浏览器并且发送了get请求跳转到了百度

and

像是知乎这样的经过大量js渲染过的，我们通过普通方法只能 获取到少量的部分html和js代码，并不能达到我们的目的，这时候就用到了selenium

from selenium import webdrive

browser = webdrive.Chrome()
browser.get('https://www.zhihu.com/explore')
print(browser.page_source)
browser.close()    #源码打印后，可以选择自动关闭或者手动关闭

模拟访问并且打印完整源码，之后我们就可以获取里面的任何数据了


然后如何找到标签

find_element_by_name

find_element_by_xpath

find_element_by_link_text

find_element_by_partial_link_text

find_element_by_tag_name

find_element_by_class_name

find_element_by_css_selector


which one？

更简单的javascript执行

测试离线模式

单一浏览器单一语言

更集中的库


avatar
文章
阅读
粉丝