官网

https://pptr.dev/

api 与 教程:

https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md
https://pptr.dev/#?product=Puppeteer&version=v1.6.0&show=api-class-puppeteer

第三方教程:

https://www.jianshu.com/p/2f04f9d665ce
https://jeffjade.com/2017/12/17/134-kinds-of-toss-using-puppeteer/
https://segmentfault.com/a/1190000010736797

安装

$ npm init -y && npm i puppeteer

Dmoe1: 无头浏览器也可以可视化,方便调试

const puppeteer = require('puppeteer')

// https://pptr.dev/#?product=Puppeteer&version=v1.6.0&show=api-class-page
puppeteer.launch({
headless: false //要看演示可以使用false
}).then(async browser => {
const page = await browser.newPage();
await page.goto('https://www.baidu.com/');
await page.type('#kw', '贝尔塔猫');
await page.click('#su');
await browser.close();
})

Demo1: 打开百度并且截图

const puppeteer = require('puppeteer');

// https://pptr.dev/#?product=Puppeteer&version=v1.6.0&show=api-class-page
puppeteer.launch().then(async browser => {
const page = await browser.newPage();
await page.goto('https://www.baidu.com');
await page.screenshot({path: 'screenshot.png'});
await browser.close();
});

Demo2: 输入内容,点击按钮

const puppeteer = require('puppeteer')

// https://pptr.dev/#?product=Puppeteer&version=v1.6.0&show=api-class-page
puppeteer.launch().then(async browser => {
const page = await browser.newPage()
await page.goto('https://www.baidu.com/')
await page.type('#kw', '贝尔塔猫')
await page.click('#su')
await page.waitFor(1000)
await page.screenshot({path: 'screenshot.png'});
await browser.close()
})

Demo3:通过往浏览器注入原生js,然后返回内容给Nodejs

请注意,不要尝试返回dom对象给nodejs,即时你返回了也无法正常调用DOM的属性和方法!!!。

const puppeteer = require('puppeteer')

// https://pptr.dev/#?product=Puppeteer&version=v1.6.0&show=api-class-page
puppeteer.launch().then(async browser => {
const page = await browser.newPage()
await page.goto('https://www.baidu.com/')
await page.type('#kw', '贝尔塔猫')
await page.click('#su')
await page.waitFor(1000)
await page.screenshot({path: 'screenshot.png'});
const list = await page.evaluate(() => {
return [...document.querySelectorAll('#content_left .result')].map(function (e, i) {
return e.textContent
})
})
console.log(20180714211647, list);
await browser.close()
})

Demo5: 监听Console

const puppeteer = require('puppeteer')

// https://pptr.dev/#?product=Puppeteer&version=v1.6.0&show=api-class-page
puppeteer.launch().then(async browser => {
const page = await browser.newPage()
page.on('console', msg => {
for (let i = 0; i < msg.args().length; ++i)
console.log(`${i}: ${msg.args()[i]}`);
});
await page.goto('https://www.baidu.com/')
await browser.close()
})

puppeteer (Nodejs版selenium )快速入门的更多相关文章

  1. 元素(WebElement)-----Selenium快速入门(三)

    上一篇<元素定位-----Selenium快速入门(二)>说了,如何定位元素,本篇说说找到的元素(WebElement)该怎么用. WebElement常用方法:  返回值  方法名  说 ...

  2. 隐式等待-----Selenium快速入门(九)

    有时候,网页未加载完成,或加载失败,但是我们后续的代码就已经开始查找页面上的元素了,这通常将导致查找元素失败.在本系列Selenium窗口切换-----Selenium快速入门(六)中,我们就已经出现 ...

  3. Selenium简介与环境搭配-----Selenium快速入门(一)

    Selenium是一套自动化测试框架.官方网站是:https://www.seleniumhq.org/  某些童鞋访问可能需要FQ. Selenium支持多种语言开发,例如Java,Python,C ...

  4. 元素定位-----Selenium快速入门(二)

    一.eclipse设置 工欲善其事必先利其器,在说元素定位之前,先来设置下eclipse. 首先放大一下字体,点击windows-preferences 其次,eclipse对于java的智能提示默认 ...

  5. 终结篇:RemoteWebDriver与Grid简介-----Selenium快速入门(十五)

    Selenium的基本使用,已经介绍得差不多了,今天来简单说说RemoteWebDriver与Grid,也是本系列的最后一篇. 还记得本系列第一章(Selenium简介与环境搭配)的配置中,提到我们下 ...

  6. 截图-----Selenium快速入门(十二)

    在自动化测试过程中,截图是常见的操作,因为有时候单靠程序无法判断是否已得到期望的结果,所以需要截图判断.又或者截图是作为判断的存证.Selenium的截图操作也是非常简单,而且自带了一个文件操作类Fi ...

  7. Cookie操作-----Selenium快速入门(十一)

    什么是cookie?顾名思义,就是饼干,小甜饼.而根据读音则是“曲奇”的意思,相信不少的人都吃过.而在网络上,cookie是指浏览器在本地的一种少量数据的存储方式.例如,我们常见的,登陆的时候有个ch ...

  8. 显式等待-----Selenium快速入门(十)

    上一篇说了元素定位过程中的隐式等待,今天我们来探讨一下显示等待.显式等待,其实就是在使用WebDriverWait这个对象,进行等待.显式等待对比隐式等待,多了一些人性化的设置,可以说是更细化的隐式等 ...

  9. js框操作-----Selenium快速入门(八)

    js框,就是JavaScript中的警告框(alert),确认框(confirm),提示框(prompt),他们都是模态窗口.什么是模态窗口,大家可以自行百度一下,简单说就是弹出的窗口是在最顶端的,你 ...

随机推荐

  1. 【SQLite】 C#中操作SQlite

    简介 SQLite是轻量级数据库,具体的介绍请参考官网(SQLite官网).在WinForm的项目中需要采用独立的数据库访问,可在断网单机上使用,所以选择了SQLite! 使用 主要针对C#项目(Wi ...

  2. Angular路由与Nodejs路由的区别

    转自:http://www.imooc.com/qadetail/114683?t=148182 觉得angualr.js的路由是针对于单页面的路由,每次路由发生变化,只是页面的状态发生变化,页面本身 ...

  3. [Algorithm] Tree: Lowest Common Ancestor

    By given a tree structure, task is to find lowest common ancestor: For example, LCA(4, 5) --> > ...

  4. [Backbone]Real Route

    Duplication is Bad. Let's DRY (Don't Repeat Yourself) our routes to make /pp:per_page an optional pa ...

  5. android实现六边形等不规则布局

    在去年广告机项目中,UI设计出一个比较华丽的UI,但是对于我来说无从下手,我试过view的叠加并设置外边距实现,虽然勉强可以实现,但是获取单击焦点是有很多问题: 效果图如下: 最后只有另外想办法:我对 ...

  6. js replace 如何替换字符串中的最后一个匹配项

    1.正则表达时,贪婪模式,.*会一直匹配到最后一个 // 验证 let str = "123[空]345[空]789[空]0"; let res = str.replace(/(. ...

  7. webpack配置上线地址

    webpack配置上线地址主要使用output配置项下的publicPath. webpack.config.js配置文件为: var htmlWebpackPlugin = require('htm ...

  8. HTTP请求响应码

    ① 客户方错误 100 继续 101 交换协议 ② 成功 200 OK 201 已创建 202 接收 203 非认证信息 204 无内容 205 重置内容 206 部分内容 ③ 重定向 300 多路选 ...

  9. ORACLE-SQL(二)

      CreateTime--2017年6月1日14:36:37 Author:Marydon 一.SQL语句 (二)提升篇 1.2.3 分页,分组,计数,排序 /** * 返回数据 * FORGID ...

  10. pythong 中的 __call__

    python __call__ (可调用对象) __call__ Python中有一个有趣的语法,只要定义类型的时候,实现__call__函数,这个类型就成为可调用的. 换句话说,我们可以把这个类型的 ...