node.js - 运行 puppeteer 时输入文本

Question

我正在尝试在一个站点中自动填写表单。但问题是，该网站有验证码。那么，有没有什么方法可以让我在显示登录页面时，在命令提示符下手动输入验证码，例如 C# 中的 Console.ReadLine(); 。 puppeteer中有类似的功能吗？

这是我的代码:

const puppeteer = require('puppeteer');

(async () => {
    const browser = await puppeteer.launch({headless: false});
    const page = await browser.newPage();
    await page.setViewport({ width: 1366, height: 768});
    await page.goto('https://www.irctc.co.in/nget/train-search');
    await page.click('#loginText');
    await page.type('#userId','xxxxxx');
    await page.type('#pwd','xxxxxx');
    await page.screenshot({path: 'varanjith.png'});
})();

屏幕截图:

Answer 1

如果想在命令行输入验证码，可以使用内置的readline模块

const puppeteer = require('puppeteer');
const readline = require('readline');

async function readLine() {

    const rl = readline.createInterface({
      input: process.stdin,
      output: process.stdout
    });

    return new Promise(resolve => {

        rl.question('Enter captcha: ', (answer) => {
          rl.close();
          resolve(answer)
        });
    })
}

(async () => {
    const browser = await puppeteer.launch({headless: false});
    const page = await browser.newPage();
    await page.setViewport({ width: 1366, height: 768});
    await page.goto('https://www.irctc.co.in/nget/train-search');
    await page.click('#loginText');
    await page.type('#userId','xxxxxx');
    await page.type('#pwd','xxxxxx');

    const captcha = await readLine();

    await page.type('#nlpAnswer', captcha)

    await page.screenshot({path: 'varanjith.png'});
})();

<小时/>

原始答案:

如果您想在 UI 中输入验证码，并在填充完毕后继续使用脚本，您可以使用: page.waitForFunction

const puppeteer = require('puppeteer');

(async () => {
    const browser = await puppeteer.launch({headless: false});
    const page = await browser.newPage();
    await page.setViewport({ width: 1366, height: 768});
    await page.goto('https://www.irctc.co.in/nget/train-search');
    await page.click('#loginText');
    await page.type('#userId','xxxxxx');
    await page.type('#pwd','xxxxxx');

    console.log('Waiting for captcha');
    await page.waitForFunction(() => {
        const captchaInput = document.getElementById('nlpAnswer');
        return captchaInput && 
           captchaInput.value && 
           captchaInput !== document.activeElement
    })
    console.log('Captcha filled');

    await page.screenshot({path: 'varanjith.png'});
})();

分割:

• 该特定页面中的验证码输入为:'nlpAnswer'

  const captchaInput = document.getElementById('nlpAnswer');
  

• 等到captchaInput可用，它有值(value)并且不再集中

return captchaInput && 
       captchaInput.value && 
       captchaInput !== document.activeElement