puppeteer 爬去数据并自动填入

最新推荐文章于 2022-10-24 15:15:57 发布

weixin_34110749

最新推荐文章于 2022-10-24 15:15:57 发布

阅读量450

点赞数

原文链接：https://my.oschina.net/ihh/blog/1623134

版权

为什么80%的码农都做不了架构师？>>>

puppeteer 是 Google Chrome 团队官方的无界面（Headless）Chrome 工具。Chrome 作为浏览器市场的龙头，Chrome Headless 必将成为 web 应用自动化测试的行业有力竞争者。这篇文章是简单的使用puppeteer 实现爬去内容并存储，来学习下puppeteer的api。

我们要爬去的对象选择的是https://weekly.75team.com/ 最新的一条周刊，首先你需要安装puppeteer，

yarn add puppeteer 
or
npm install puppeteer

然后新建一个spider.js

内容如下


const puppeteer = require('puppeteer');

(async () => {
    const browser = await puppeteer.launch({ headless: false, devtools: true });
    const page = await browser.newPage();
    const viewConfig = {
        width: 360,
        height: 640,
        isMobile: true
    };
    //设置窗口
    page.setViewport(viewConfig);
    //跳转
    await page.goto('https://weekly.75team.com/', {
        waitUntil: 'networkidle2'
    });
    //处理拿到需要的数据
    const result = await page.evaluate(() => {
        let data = {};
        let elements = document.querySelector('.issue-list li');
        let title = elements.querySelector('a').innerHTML;
        let url = elements.querySelector('a').href;
        let date = elements.querySelector('.date').innerHTML;
        data = {
            title: title,
            url: url,
            date: date
        };
        return data;
    });
    //跳转到添加的页面
    await page.goto('http://yourwebsite.com/add.html', {
        waitUntil: 'networkidle2'
    });
    //填充数据并提交
    await page.type('#title', result.title);
    await page.type('#url', result.url);
    await page.type('#date', result.date);
    await page.waitFor(1000);
    await page.click('.submit');
    await page.waitFor(3000);
    browser.close();
})();