node puppeteer(headless chrome)实现网站登录


Posted in Javascript onMay 09, 2018

puppeteer简介

puppeteer是Chrome团队开发的一个node库,可以通过api来控制浏览器的行为,比如点击,跳转,刷新,在控制台执行js脚本等等。有了这个神器,写个爬虫,自动签到,网页截图,生成pdf,自动化测试什么的,都不在话下。

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();//关掉浏览器
})();

阅读上述代码,我们可以发现,1,代码中每一步都是异步操作,2,每一步操作都对应实际使用浏览器的一个行为。理解这两点对使用这个库有很大帮助。另外,比较常用的两个对象就是browser和page对象,对象上有一堆用来操作两个对象的方法。接下来,我们就写一个登录网站的小demo。

没有验证码的网站

对于没有验证码的网站,基本上就是输入账号,输入密码,点击登录这三步,需要用到page对象的两个方法:type用来在输入框中输入信息,click用来点击登录。下面以登录豆瓣为例来举个例子:

const puppeteer = require('puppeteer');
const account = `123456@qq.com`;
const password = `123456`;
(async () => {
 const browser = await puppeteer.launch();//打开浏览器
 const page = await browser.newPage();//打开一个空白页
 await page.goto('https://www.douban.com/');//打开豆瓣网站
 await page.type('#form_email', account);  
 await page.type('#form_password', password);
 await page.click('.bn-submit');
 await page.waitForNavigation({
  waitUntil: 'load'
 });//等待页面加载出来,等同于window.onload
 await page.screenshot({path: 'example.png'});//截个图
 await browser.close();//关掉浏览器
})();

有人说,我怎么知道到底有没有登录成功呢,一种调试的办法就是使用screenshot,如果你看到的是一个验证码页面,说明没有登录成功,还有一种办法像下面这样:

const browser = await puppeteer.launch({headless: false});//打开有界面的浏览器

传入headless:false后会真的打开一个浏览器的界面,这样你就可以实时看到代码执行到什么地方了。接下来我们说说碰到验证码时怎么办。

有验证码的网站

node puppeteer(headless chrome)实现网站登录

碰到有验证码的网站,可以将headless设成false,借助界面输入验证码,同时监听页面加载事件,实现登录,代码如下:

...

 await page.waitForNavigation({
  waitUntil: 'load'
 });//等待页面加载出来,等同于window.onload


//代码中监听跳转事件
if(page.url() === 'https://www.douban.com/accounts/login'){ 
   //登录不成功
  console.log('需要输入验证码');
  //等待再一次跳转
  while(true){
    await page.waitForNavigation({
      waitUntil: 'load'
    })
    console.log(page.url())
    if(page.url() === 'https://www.douban.com/'){
      console.log('登录成功');
      break;
    }
  }
 }

整体思路就是写也个循环,不断监听页面跳转,直到浏览器登录成功后跳转到首页为止。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
WebGame《逆转裁判》完整版 代码下载(1月24日更新)
Jan 29 Javascript
JScript中的"this"关键字使用方式补充材料
Mar 08 Javascript
JS解析XML的实现代码
Nov 12 Javascript
Node.js操作mysql数据库增删改查
Mar 30 Javascript
js实现密码强度检验
Jan 15 Javascript
Vuejs 组件——props数据传递的实例代码
Mar 07 Javascript
Javascript中Promise的四种常用方法总结
Jul 14 Javascript
在页面中引入js的两种方法(推荐)
Aug 29 Javascript
Vue中使用webpack别名的方法实例详解
Jun 19 Javascript
详解性能更优越的小程序图片懒加载方式
Jul 18 Javascript
Vue中用props给data赋初始值遇到的问题解决
Nov 27 Javascript
PHP读取远程txt文档到数组并实现遍历
Aug 25 Javascript
JS中移除非数字最多保留一位小数
May 09 #Javascript
JS关于刷新页面的相关总结
May 09 #Javascript
Vue引入jquery实现平滑滚动到指定位置
May 09 #jQuery
webstorm中vue语法的支持详解
May 09 #Javascript
JavaScript DOM元素常见操作详解【添加、删除、修改等】
May 09 #Javascript
Vue中使用vee-validate表单验证的方法
May 09 #Javascript
VeeValidate在vue项目里表单校验应用案例
May 09 #Javascript
You might like
用PHP+MySql编写聊天室
2006/10/09 PHP
PHP在特殊字符前加斜杠的实现代码
2011/07/17 PHP
php中大括号作用介绍
2012/03/22 PHP
Javascript 获取链接(url)参数的方法
2009/02/15 Javascript
jQuery 获取对象 定位子对象
2010/05/31 Javascript
基于jQuery实现图片的前进与后退功能
2013/04/24 Javascript
javascript删除option选项的多种方法总结
2013/11/22 Javascript
用nodejs实现PHP的print_r函数代码
2014/03/14 NodeJs
JavaScript实现鼠标点击后层展开效果的方法
2015/05/13 Javascript
JavaScript子窗口调用父窗口变量和函数的方法
2015/10/09 Javascript
基于Bootstrap实现图片轮播效果
2016/05/22 Javascript
JS实用的带停顿的逐行文本循环滚动效果实例
2016/11/23 Javascript
Angular2+国际化方案(ngx-translate)的示例代码
2017/08/23 Javascript
vue单页开发父子组件传值思路详解
2018/05/18 Javascript
微信小程序之批量上传并压缩图片的实例代码
2018/07/05 Javascript
Vue中的$set的使用实例代码
2018/10/08 Javascript
JavaScript继承的特性与实践应用深入详解
2018/12/30 Javascript
详解vue项目中使用token的身份验证的简单实践
2019/03/08 Javascript
使用Vue父子组件通信实现todolist的功能示例代码
2019/04/11 Javascript
layUI实现三级导航菜单效果
2019/07/26 Javascript
微信小程序实现转盘抽奖
2020/09/21 Javascript
[01:04:35]2018DOTA2亚洲邀请赛 4.3 突围赛 Secret vs VG 第一场
2018/04/04 DOTA
简单谈谈Python的pycurl模块
2018/04/07 Python
Python中asyncio模块的深入讲解
2019/06/10 Python
解决Numpy中sum函数求和结果维度的问题
2019/12/06 Python
Python 实现OpenCV格式和PIL.Image格式互转
2020/01/09 Python
python-地图可视化组件folium的操作
2020/12/14 Python
python解包用法详解
2021/02/17 Python
意大利制造的西装、衬衫和针对男士量身定制的服装:Lanieri
2018/04/08 全球购物
英国皇家造币厂:The Royal Mint
2018/10/05 全球购物
酒店总经理助理岗位职责
2014/02/01 职场文书
义务教育学校标准化建设汇报材料
2014/08/16 职场文书
给女朋友的道歉短信
2015/05/12 职场文书
详解JSON.parse和JSON.stringify用法
2022/02/18 Javascript
十大最强火系宝可梦,喷火龙上榜,第一名有双火属性
2022/03/18 日漫
mybatis 获取更新记录的id
2022/05/20 Java/Android