puppeteer可以借助cookie登录吗,可以自动输入用户名密码登录

puppeteer可以借助cookie登录吗,可以自动输入用户名密码登录?

答案是:完全可以,而且这正是 Puppeteer 最擅长、最常用的两个核心场景!

在自动化测试和爬虫中,处理登录通常有以下两种方式:


方法一:自动输入用户名和密码登录(表单交互)

Puppeteer 可以完全模拟人在键盘上打字和点击鼠标的过程。

核心原理:

  1. 打开登录页面。
  2. 找到用户名和密码框的 CSS 选择器(Selector)。
  3. 使用 page.type() 模拟打字输入。
  4. 使用 page.click() 点击登录按钮(或按 Enter 键)。
  5. 等待页面跳转/登录成功。

代码示例:

const puppeteer = require('puppeteer');  
  
(async () => {  
    const browser = await puppeteer.launch({ headless: false }); // 设为 false 方便看效果  
    const page = await browser.newPage();  
  
    // 1. 打开登录页面  
    await page.goto('https://example.com/login');  
  
    // 2. 输入用户名(#username 是输入框的 ID 或 Selector)  
    await page.type('#username', 'my_account_name', { delay: 100 }); // delay 模拟真实打字速度  
  
    // 3. 输入密码  
    await page.type('#password', 'my_secret_password', { delay: 100 });  
  
    // 4. 点击登录按钮(#login-btn 是登录按钮的 ID)  
    await page.click('#login-btn');  
  
    // 5. 等待登录成功的关键元素出现(比如右上角的个人头像或退出按钮)  
    await page.waitForSelector('.user-avatar');  
  
    console.log('登录成功!');  
    await browser.close();  
})();  

提示:如果遇到图片/拖拽验证码,自动输入密码后可能需要配合第三方打码平台,或者切换到下面这种更高效的方式:Cookie 登录


方法二:借助 Cookie 免密登录(更高效、稳定)

在绝大多数自动化场景中,反复输入密码登录不仅高效性低,还容易触发网站的验证码或风控

更好的做法是:先登录一次,把 Cookie 保存到本地,以后每次直接注入 Cookie 绕过登录过程

步骤 1:保存 Cookie 到本地(只需运行一次)

先通过代码打开浏览器,手动(或自动)登录后,把 Cookie 提取并存为 JSON 文件。

const puppeteer = require('puppeteer');  
const fs = require('fs');  
  
(async () => {  
    const browser = await puppeteer.launch({ headless: false });  
    const page = await browser.newPage();  
  
    await page.goto('https://example.com/login');  
  
    console.log('请在弹出的浏览器中手动完成登录/扫码...');  
  
    // 等待登录成功(比如等待页面跳转到首页/个人中心)  
    await page.waitForNavigation({ waitUntil: 'networkidle0' });  
  
    // 获取当前所有的 Cookie  
    const cookies = await page.cookies();  
  
    // 将 Cookie 保存为本地 json 文件  
    fs.writeFileSync('./cookies.json', JSON.stringify(cookies, null, 2));  
    console.log('Cookie 已保存到 cookies.json');  
  
    await browser.close();  
})();  

步骤 2:直接注入 Cookie 实现免密登录(后续每次运行)

以后每次运行脚本时,直接将保存好的 Cookie 注入浏览器,访问受保护的页面:

const puppeteer = require('puppeteer');  
const fs = require('fs');  
  
(async () => {  
    const browser = await puppeteer.launch({ headless: "new" });  
    const page = await browser.newPage();  
  
    // 1. 读取本地保存的 Cookie  
    const cookies = JSON.parse(fs.readFileSync('./cookies.json'));  
  
    // 2. 将 Cookie 注入到 Puppeteer 的当前页面中  
    await page.setCookie(...cookies);  
  
    // 3. 直接访问需要登录后才能看的页面(如个人中心/后台)  
    await page.goto('https://example.com/user/profile');  
  
    // 验证是否登录成功(截图查看)  
    await page.screenshot({ path: 'logged_in_page.png' });  
    console.log('免密登录成功,页面已截图!');  
  
    await browser.close();  
})();  

总结与最佳实践建议

  1. 自动输入登录:适合做 UI 自动化测试(测试登录功能本身是否正常)。
  2. Cookie 免密登录:适合做 数据爬虫/自动化运维。不仅速度快,而且可以完全绕过验证码、极验滑块、手机短信验证等复杂的安全防线。
  3. 补充(LocalStorage/SessionStorage):现代很多前端框架(如 React/Vue)使用 JWT 令牌保存在 LocalStorage 中,Puppeteer 也可以通过 page.evaluate() 直接向 localStorage 写入 Token 来实现免密登录。