代码之家 › 专栏 › 技术社区 › C Alonso C Ortega

在Puppeter函数中使用await/async时出错

puppeteer node.js

0

C Alonso C Ortega · 技术社区 · 8 年前

这就是我把木偶舞步放在功能中的方法

login: function (page, selector){
    (async () => {
        await page.goto(âlocalhost:8080/loginâ);
        await page.type(â#usernameâ, âadminâ);
        console.log("STEP 1 USERNAMEâ);
        await page.type(â#passwordâ, âadmin1â);
        console.log("STEP 2 PASSWORDâ);
        await page.waitForSelector(â#submitâ).then(() =>
            page.click(â#submitâ)
        );
        console.log("STEP 3 - Login"); 
    })();
}

这是我的主js程序( main.js )

CASE1: function (req, res) {
        (async () => {
            const puppeteer = require('puppeteer');
            const browser = await puppeteer.launch();
            const page = await browser.newPage();
            try {
                console.log("STARTING CASE 1â);
                await page.setViewport({ "width": 1280, "height": 720 });
                login (page, selector);
                await page.waitForSelector(â#combobox_of_dayâ).then(() =>
                    page.click(â#combobox_of_dayâ)
                );
                console.log("SELECT combobox of dayâ);

await page.waitForSelector(â#combobox_of_monthâ).then(() =>
                    page.click(â#combobox_of_monthâ)
                );
                console.log("SELECT combobox of monthâ);
await page.waitForSelector(â#combobox_of_yearâ).then(() =>
                    page.click(â#combobox_of_ yearâ)
                );
                console.log("SELECT combobox of yearâ);
                await browser.close(); 
             console.log("ENDING navigationâ);

            } catch (error) {
                console.log(error);

            }
        })();
    }

所以在NodeJS控制台上,我希望看到类似的东西

STARTING CASE 1
STEP 1 USERNAME
STEP 2 PASSWORD
STEP 3 Login
SELECT combobox of day
SELECT combobox of month
SELECT combobox of year
ENDING navigation

但是你在控制台上看到的是这样的东西

STARTING CASE 1
STEP 1 USERNAME
SELECT combobox of day
SELECT combobox of month
SELECT combobox of year
STEP 2 PASSWORD
STEP 3 Login
ENDING navigation

{ TimeoutError: waiting for selector "#username" failed: timeout 30000ms exceeded
    at new WaitTask (Z:\Documents\AR-puppeter\node_modules\puppeteer\lib\FrameManager.js:864:28)
    at Frame._waitForSelectorOrXPath (Z:\Documents\AR-puppeter\node_modules\puppeteer\lib\FrameManager.js:755:12)
    at Frame.waitForSelector (Z:\Documents\AR-puppeter\node_modules\puppeteer\lib\FrameManager.js:713:17)
    at Page.waitForSelector (Z:\Documents\AR-puppeter\node_modules\puppeteer\lib\Page.js:1017:29)
    at Z:\Documents\AR-puppeter\pruebas-app-ar\modulos\escenarios\escenario.js:145:28
    at <anonymous> name: 'TimeoutError' }

因为问题似乎是调用函数“ Login () “不会停止连续行的执行。

主.js 登录() “功能继续?

async / await 和 WaitForSelector

我试着用不同的语法 “来自我的程序的函数( 主.js )但我也犯了同样的错误。

async login (page, selector); //Getting same error

await login (page, selector); //Getting same error

1 回复 | 直到 8 年前

1

2

Aankhen Jon 7 年前

你的公式 login IIFE 运行 async 异步 ,你从不等待承诺。你不要等 登录 CASE1 也可以,但是你不能那样做,因为它什么也不回。你得先做 登录 Promise 通过制造它 异步 (您可以返回 承诺 却没有成功 异步 ,但这样你就无法使用 await

login: async (page, selector) => {
  await page.goto("localhost:8080/login");
  await page.type("#username", "admin");
  console.log("STEP 1 USERNAME");
  await page.type("#password", "admin1");
  console.log("STEP 2 PASSWORD");
  const submit = await page.waitForSelector("#submit");
  await submit.click();
  console.log("STEP 3 - Login");
}

waitForSelector returns the ElementHandle ,所以你不需要打电话 page.click then 无论如何。现在 登录 承诺 .

等待 那个 承诺 在里面为了使功能本身 异步 :

CASE1: async (req, res) => {
    const puppeteer = require('puppeteer');
    const browser = await puppeteer.launch();
    const page = await browser.newPage();
    try {
      console.log("STARTING CASE 1");
      await page.setViewport({ "width": 1280, "height": 720 });
      await login(page, selector);

      for (const type of ["day", "month", "year"]) {
        const combobox = await page.waitForSelector(`#combobox_of_${type}`);
        await combobox.click();
        console.log(`SELECT combobox of ${type}`);
      }

      await browser.close(); 
      console.log("ENDING navigation");
    } catch (error) {
      console.log(error);
    }
}

selector 变量,也就是 登录 忽略它,但我还是留下它来匹配你的代码。