puppeteer 教程（6） ----入门例子（模拟登陆51cto）

目标

模拟登陆51cto

主要学习以下知识点

方法名称	方法说明
page.$x	此方法解析指定的XPath表达式。
page.waitForNavigation	此方法找到一个匹配 selector 选择器的元素，如果需要会把此元素滚动到可视，然后通过 page.mouse 点击它。 如果选择器没有匹配任何元素，此方法将会报错。

详细api 可参考
https://blog.csdn.net/mengxiangxingdong/article/details/99237204

开始

本文章代码均在 上传在
https://gitee.com/hugo110/puppeteer-demo
效果图

1.代码

/*

模拟登陆 51  cto
https://home.51cto.com/index
 */


const puppeteer = require('puppeteer'); //引入puppeteer库
const xpathUtil = require('./util/XpathUtil');
(async () => {
    const browser = await puppeteer.launch({    //启动浏览器
        headless: false,   //代码运行时打开浏览器方便观察
        // devtools:true   //打开f12界面
    });
    const page = await browser.newPage();  //打开浏览器的一个tab 页
    //networkidle2 - 只有2个网络连接时触发（至少500毫秒后）
    await page.goto('https://home.51cto.com/index', {timedout: 10 * 1000, waitUntil: 'networkidle2'});  //访问51cto 登陆页面
    //等待 账号密码登陆元素出现  並且點擊
    await  page.waitForXPath('//a[contains(string(),"账号密码登录")]', {timedout: 10 * 1000});
    await xpathUtil.$xClick(page, '//a[contains(string(),"账号密码登录")]');
    //等待账号密码显示
    await  page.waitForSelector('#loginform-username', {timedout: 10 * 1000});
    //输入账号密码
    await   page.type('#loginform-username', "你的账号")
    await   page.type('#loginform-password', "你的密码")
    //点击登录
    await page.click('.loginbtn');
    //等待网页跳转  networkidle0  不在有网络响应
    const response = await  page.waitForNavigation({timedout: 10 * 1000, waitUntil: 'networkidle0'});
    //输出响应的页面
    console.log(await response.text())


    // await browser.close();  //关闭浏览器
})();

参考博客

https://zhaoqize.github.io/puppeteer-api-zh_CN/#?product=Puppeteer&version=v1.19.0&show=api-pageevalselector-pagefunction-args-1