clearInterval 不停止间隔

Question

我正在尝试用 headless-chrome/puppeteer 抓取一些链接，同时像这样向下滚动：

 let interval
 const linkScraper = async () => {
        return new Promise(async (resolve,reject) => {
               interval = setInterval(async () => {
                const visiblePosts = await page.$$("div[class*='wrapper']")
                const data = await handleVisiblePosts(visiblePosts)
                allPosts = {...allPosts, ...data}
                await scroll()
                const stop = await areWeAtTheBottom()
                if (stop) {              
                    console.log('STOPPING')              
                    clearInterval(interval)
                    resolve()                
                }
            }, 100); 

           })
          }

有问题吗？ clearInterval 实际上并没有停止间隔。 stopping 被多次打印。

我怀疑这也可能是因为 setinterval 是异步的，它需要这样才能使用 await。

Answer 1

我可以找到以下可能导致您的间隔无法停止的原因：

您永远不会达到 stop 条件。
您正在以某种方式覆盖 interval 变量，因此不再保存您要停止的实际间隔。
你收到了一个被拒绝的承诺。

interval 变量似乎没有任何理由需要在 linkScraper 函数之外并将其放在函数内部将防止它以任何方式被覆盖。

有了这么多 await 调用，添加一个 try/catch 来捕获任何被拒绝的承诺并在出现错误时停止间隔似乎是明智的。

如果您看到 STOPPING 被记录，那么您显然达到了停止条件，因此看起来它必须是一个被覆盖的 interval 变量。

这是一个无法覆盖 interval 变量的版本，并为代码清洁做了一些其他更改：

 const linkScraper = async () => {
     return new Promise((resolve, reject) => {
         const interval = setInterval(async () => {
             try {
                 const visiblePosts = await page.$$("div[class*='wrapper']");
                 const data = await handleVisiblePosts(visiblePosts);
                 allPosts = { ...allPosts, ...data};
                 await scroll();
                 const stop = await areWeAtTheBottom();
                 if (stop) {
                     console.log('STOPPING');
                     clearInterval(interval);
                     resolve();
                 }
             } catch(e) {
                 clearInterval(interval);
                 reject(e);
             }
         }, 100);

     });
 }

在整理这段代码时，我运行提出了几个问题：

您使用的所有四个函数 await 实际上都 return 是一个承诺吗？
而且，allPosts 声明在哪里？

编辑： 刚发现另一个问题。 setInterval() 不知道函数内部的 await 调用。请记住，外部函数实际上并不阻塞。一旦你点击 await，它就会立即 return。这意味着您可以在处理第一个回调的异步操作时获得另一个 setInterval() 回调。那会把事情搞砸的。这是一个解决方法：

function delay(t) {
    return new Promise(resolve => {
        setTimeout(resolve, t);
    });
}

const linkScraper = () => {
        console.log("starting linkScraper");

        async function run() {
            const visiblePosts = await page.$$("div[class*='wrapper']");
            const data = await handleVisiblePosts(visiblePosts);
            allPosts = { ...allPosts, ...data};
            await scroll();
            const stop = await areWeAtTheBottom();
            if (stop) {
                console.log('STOPPING');
                return "stop";
            }
            return "continue";
        }

        return run().then(result => {
            if (result === "continue") {
                return delay(100).then(run);
            }
        })

    });
}

Answer 2

我接受了 jfriend00 的解决方案，因为它为我指明了正确的方向，我稍加修改后的最终工作版本如下所示：

const linkScraper = async () => {
    return new Promise(async (resolve, reject) => {
        const run = async () => {
            console.log("running")
            const visiblePosts = await page.$$("div[class*='wrapper']");
            const data = await handleVisiblePosts(visiblePosts);
            allPosts = {...allPosts, ...data};
            await scroll();
            const stop = await areWeAtTheBottom();
            if (stop) {
                console.log('STOPPING');
                resolve()
            } else {
                await page.waitFor(100)
                await run()
            }

        }

        await run()         
    })
}

clearInterval 不停止间隔

clearInterval not stopping interval

javascript

node.js

puppeteer