如何使用 Puppeteer 登录 Google？

Question

我正在使用 Puppeteer，并且正在尝试登录我的 Gmail 帐户

网址：https://accounts.google.com/ServiceLogin/identifier?service=mail&passive=true&rm=false&continue=https%3A%2F%2Fmail.google.com%2Fmail%2F&ss=1&scc=1<mpl=default<mplcache=2&emr= 1&osid=1&flowName=GlifWebSignIn&flowEntry=AddSession

目前我的代码输入电子邮件表单并提交输入， 然后当页面进入密码屏幕时，无法输入密码。这可能是因为它在技术上不是新页面，而是相同的。不管怎样，当我在电子邮件页面上按 Enter 时，我似乎无法与这个新页面进行交互。

我尝试过很多方法，但都没有效果。

const elementHandle = await page.$('input');
await elementHandle.type('[email protected]');
  await page.click("#identifierNext");

//goes to new page
//this code does not work. 
const pw = await page.$('input[type="password"]');


page.on('load', () => console.log("Loaded: " + page.url()));

}）

Answer 1

这个完整的脚本应该可以工作，请注意，如果您已经登录或者您的帐户使用双因素身份验证，这不会处理，祝您好运

const puppeteer = require('puppeteer');
(async () => {
  const browser = await puppeteer.launch({ headless: false})
  const page = await browser.newPage()

  const navigationPromise = page.waitForNavigation()

  await page.goto('https://accounts.google.com/')

  await navigationPromise

  await page.waitForSelector('input[type="email"]')
  await page.click('input[type="email"]')

  await navigationPromise

  //TODO : change to your email 
  await page.type('input[type="email"]', '[email protected]')

  await page.waitForSelector('#identifierNext')
  await page.click('#identifierNext')

  await page.waitFor(500);

  await page.waitForSelector('input[type="password"]')
  await page.click('input[type="email"]')
  await page.waitFor(500);

  //TODO : change to your password
  await page.type('input[type="password"]', 'yourpassword')

  await page.waitForSelector('#passwordNext')
  await page.click('#passwordNext')

  await navigationPromise

  //await browser.close()
})()

Answer 2

目前有效...您可以在加载后登录。也绕过联邦快递登录限制:) 谢谢@ABDELJALILAITETALEB !!!

const puppeteer = require('puppeteer-extra');
const StealthPlugin = require('puppeteer-extra-plugin-stealth');
puppeteer.use(StealthPlugin());
doit = async () => {
    const browser = await puppeteer.launch({args: ['--no-sandbox'], headless: false});
    let page = await browser.newPage();
    await page.goto('https://accounts.google.com');
}
doit();

Answer 3

在此代码中，waitForSelector('[type="password"]', {visible: true }) 行等待密码输入字段在同一页面上变得可见，然后继续输入密码并单击“下一步”按钮。

const express = require("express");
const puppeteer = require("puppeteer-extra");
const StealthPlugin = require("puppeteer-extra-plugin-stealth");

puppeteer.use(StealthPlugin());

const { executablePath } = require("puppeteer");

const app = express();
app.use(express.json());


(async () => {
    try {
      const browser = await puppeteer.launch({
        headless: false,
        executablePath:executablePath(),
      });
     
      const page = await browser.newPage();
      await page.goto("https://accounts.google.com/");
  
      await page.waitForSelector('[type="email"]');
      await page.type('[type="email"]', "[email protected]");
      await page.click("#identifierNext");
  
      // Wait for the password input field to appear
      await page.waitForSelector('[type="password"]', { visible: true });
      await page.type('[type="password"]', "password");
  
      await page.click("#passwordNext");
      await page.waitForNavigation();

      console.log("Login successful");
    } catch (error) {
      console.error("Error:", error);
    }
  })();
  
app.listen(3000, () => {
  console.log("Server started on port 3000");
});

Answer 4

如果发生页面加载，则后续命令/脚本将无法工作，因为它们未正确加载。为此，有 waitForNavigation 方法。

您的代码将类似于：

const elementHandle = await page.$('input');
await elementHandle.type('[email protected]');
await page.click("#identifierNext");

// Wait for next pageload
await page.waitForNavigation(waitOptions)
const pw = await page.$('input[type="password"]');

Answer 5

通过在 puppeteer 运行实例上手动注册过程解决并在 Gmail 上成功登录。谢谢

Answer 6

兄弟，我通过在指令之间添加间隔来得到它，如下所示：

await page.goto('google-login-page-here')
await page.waitForTimeout(1000) // 1s interval
await page.waitForSelector('input[type="email"]')
await page.focus('input[type="email"]')
await page.keyboard.type('your-email-here', { delay: 50 })
await page.waitForTimeout(1000) // 1s interval
await page.click('next-button-selector-here')

await page.waitForTimeout(3000) // 3s interval
await page.waitForSelector('input[type="password"]')
await page.focus('input[type="password"]')
await page.keyboard.type('your-password-here', { delay: 50 })
await page.waitForTimeout(1000) // 1s interval
await page.click('next-button-selector-here')

Answer 7

这与其他略有不同，但也很有用。在 puppeteer 中创建一个测试并粘贴以下代码：

    test('google_login', async () => {
           const browser = await puppeteer.launch({ headless: false})
           const page = await browser.newPage()
  
           await page.goto('https://accounts.google.com/')
           await page.waitForTimeout(1000) // 1s interval
           await page.waitForSelector('input[type="email"]')
           await page.focus('input[type="email"]')
           await page.keyboard.type('YOURMAIL', { delay: 50 })
           await page.waitForTimeout(1000) // 1s interval
           await page.click('#identifierNext')
           await page.waitForNavigation();
 
           await page.waitForSelector('input[type="password"]');
           await page.focus('input[type="password"]')
           await page.waitForTimeout(1000);

           await page.type('input[type="password"]', 'YOURPASS', { delay: 50 })
      
           await page.click("#passwordNext");
           await page.waitForNavigation();
           console.log('Succesfully logued');

在文件package.json的文件末尾添加以下句子：

     "scripts": {
         "start": "jest ."
       }

然后简单地测试一下控制台上运行的代码：

npm start

Answer 8

输入电子邮件完成=>下一步=>谷歌通知： “此浏览器或应用程序可能不安全”