使用NodeJS爬取涉及到页面操作才会有数据的页面

前言

作为一个前端菜鸟，我们需要一个网站数据时，通常是打开控制台看接口的请求，往往在我们程序里面请求这个接口即可，虽然大部分都可以做到；但仍然有一些接口是会进行权限的鉴定，防止恶意请求爬取数据。有的人可能通过代理能成功请求，但我最近仍然遇到了通过代理也无法进行请求的接口，由此写下这篇记录，以供有需求的人参考。
那到这里，我们就只能用一个笨方法——所见即所得，核心思路就是直接去获取页面显示的数据，网页所呈现出来的，我们能看见去把它解析出来供我们使用。

---

涉及技术及库

• JS
• HTML
• NodeJs
• Puppeteer

一、Puppeteer是什么？

Puppeteer 是一个 Node 库，它提供了一个高级 API 来通过 DevTools 协议控制 Chromium 或 Chrome。
在浏览器中手动执行的绝大多数操作都可以使用 Puppeteer 来完成。
Puppeteer官方文档

二、使用步骤

1.安装

npm install puppeteer

2.使用

代码如下（示例）：

const puppeteer = require('puppeteer');

const puppeteer = require('puppeteer');
let page;
let PAGEDATA;
(async ()=>{
  const browser = await puppeteer.launch({
    headless:false
  });
  page = await browser.newPage();
  await page.goto("www.baidu.com");
  await page.evaluate(()=>{
  	//此处就可以像写JS一样操作DOM,获取数据
    document.querySelectorAll(".dom")[1].innerHTML;
  })
})()

进阶

那有人可能要问了，我需要的数据在另一个标签下面呢?
那这里puppeteer提供了非常多的API，比如页面点击

page.evaluate(()=>{
  document.querySelectorAll(".tab__item")[0].click();
})

那可能又有人要问了，博主博主，我只想要接口数据，有没有快一点的方法，当然有例如下面的代码，通过response这个API来监听来至页面的请求。

page.on("response",async response=>{
	//此处是监听所有的页面请求
    if(response.url()){
      const data = await response.json();
    }
  })

那可能又又有人要问了，博主博主，那如果我要输入数据怎么办呢，当然，通过Keyboard这个API来实现键盘输入。例如下面代码就输入了一个A

await page.keyboard.down('Shift');
await page.keyboard.press('KeyA');
await page.keyboard.up('Shift');

---

总结

以上就是今天要讲的内容，本文仅仅简单介绍了Puppeteer的使用，而Puppeteer提供了大量能使我们快速便捷地处理页面数据的API，有兴趣的小伙伴可以看看官方文档。