javascript - 如何等待 ajax 请求并处理结果？

Question

我打开一个网站，然后等待所有重定向完成。然后我捕获一个验证码图像，并通过 nodejs 将其发送给用户。然后我收到输入的验证码:

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

    await page.goto('http://localhost/p1.php' );
    await page.waitForNavigation();

    const captcha_image = await page.$eval('#security', e => e.getAttribute('src'));

    io.emit('send_captcha_to_client' , {text : captcha_image });

    var captcha = await captchaPromise;

收到输入的 capthca 值后，我将其放入字段中并单击登录按钮:

    await page.$eval('#W_CAPTCHA', (el , _captcha) => el.value = _captcha.W_CAPTCHA , captcha );

    await page.click('#login-btn');

现在点击按钮后，ajax 请求将发送到服务器。让我们说 http://example.com/login.php - 如果验证码正确，我将被重定向到我的仪表板，但如果 ajax 调用返回，可以说 {status:er}

还有 <span id="alert"></span>在页面中它会添加 .Error对其进行分类并将错误文本放在那里。如何拦截ajax调用并检查登录是否成功？

我可以检查 ajax 调用的结果或等待并检查 div.Error 的文档.但我不确定我该怎么做。这是我失败的尝试:

await page.waitForNavigation();

page.waitForSelector('.Error');
const error  = await page.$eval('.Error', e => e.value );

console.log(error);

browser.close();

Answer 1

您可以同时等待两者并处理先发生的一个:

await Promise.race([
  page.waitForNavigation({ waitUntil: "networkidle0" }),
  page.waitForSelector(".Error")
]);

if (await page.$(".Error")) {
  // there was an error
} else {
  // the page changed
}