puppeteer学习----登录人才网并截图

时间:2022-07-23
本文章向大家介绍puppeteer学习----登录人才网并截图，主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项，具有一定的参考价值，需要的朋友可以参考一下。

1.puppeteer

1.1 介绍

image.png

1.2 相关资料

推荐看官方文档,因为api变的很多,网上流传的一些教程只能看一部分,还有一部分api已经不能用了

2.安装puppeteer

2.1 当然要先安装NodeJS

  1. windows下直接访问官网下安装包傻瓜安装, 推荐按LTS版本 当然 windows也能用nvm, 我机子就用的nvm, 不过上次帮别人安的时候发现环境变量有点问题, 我自己好得很...
  2. Linux和Mac当然推荐直接通过nvm安装
  3. 参考资料:

2.2 安装yarn? (可省略)

$ npm install -g yarn

参考资料:

2.3 开始安装吧

  1. 新建个文件夹
  2. 执行npm init 初始化项目
  3. 由于安装puppeteer需要下载chromium, 很难下载下来,官方也给了方法, 在命令行先输入set PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=1即可跳过下载

set PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=1即可跳过下载

命令行输入

  1. 开始安装
$ npm install --save puppeteer
# 或者
$ yarn add puppeteer
  1. 等待安装完即可 不知道是不是本生安装了chrome浏览器, 机子里自带了chromium, 我在依赖中看到了存在chromium, 如果你没有的话可以去网上下

存在chromium

  1. 参考资料

3.使用puppeteer模拟登录人才网并截图

1.在项目中新建一个文件, 例如test.js

2.写代码咯

  1. 引入依赖
const puppeteer = require('puppeteer');
  1. 初始化配置, 以及访问页面
(async () => {
  const browser = await puppeteer.launch({
    headless: false, // 不使用无头浏览器,即可以看到真实浏览器打开的操作
    defaultViewport: { // 浏览器框的大小
      width: 1366,
      height: 768
    }
  });
  const page = await browser.newPage(); // 打开一个新的标签页
  await page.goto('http://jd.0550.com'); // 访问人才网
  await page.screenshot({ // 先截个图保存下来
    path: 'job.png'
  });
  1. 登录人才网 可以先分析登录框的dom

image.png 随后进行相关操作 

  await page.tap('#username')  // 获取用户名input
  await page.type('#username', '111') 输入用户名

  await page.tap('#password') // 获取密码input
  await page.type('#password', 'nodetech2018') // 输入密码
  await page.tap('.btn-login') // 点击登录

  await timeout(3000) // 等会, 等登录完成
  await page.screenshot({ //截图
    path: 'job2.png'
  });
  browser.close(); // 任务完成, 关闭浏览器
})();
  1. 延时函数
let timeout = function (delay) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      try {
        resolve(1)
      } catch (e) {
        reject(0)
      }
    }, delay);
  })
}

4.操作录屏

操作录屏

随机文章
本站知识点必读
最近更新