抓取稍后使用 Cheerio 加载的数据

Question

我正在尝试使用 Cheerio js 抓取网站 gogoanime。到目前为止，很多工作，直到我撞到墙。我想抓取一些稍后由 JavaScript 加载的数据。我知道cheerio 保存了源代码。在源代码中我们可以看到：

<div class="main_body">
    <div class="anime_name episode_video">
        <div class="anime_name_img_episode_video"></div>
            <h2>Episodes</h2>
        </div>
        <div class="clr"></div>
        <div class="anime_video_body" id="episode_wrapper">Loading...</div>
</div>

我要抓取的数据稍后会加载到#episode_wrapper 中。这将被加载到：

<ul data-range="0" style="display:block">
                                <li>
                <a data-name="1:01" data-name-normalized="1" href="/anime/my-hero-academia-dub-jwwn/ep-1" class="active" data-servers="28,40,35">
                    EP 01
                </a>
            </li>
                                            <li>
                <a data-name="2:02" data-name-normalized="2" href="/anime/my-hero-academia-dub-jwwn/ep-2" data-servers="28,40,35">
                    EP 02
                </a>
            </li>

...
</ul>

所以我知道在抓取页面之前我必须等待数据加载完毕。但我认为这不能用 Cheerio 来完成。但我看到了这个存储库，开发人员也使用 Cheerio：

查看函数：animeContentHandler。 https://github.com/ChrisMichaelPerezSantiago/gogoanime/blob/master/src/api/api.js

老实说，我不明白他为什么能和 Cheerio 一起刮。当我尝试抓取元素时，我找不到包含所有剧集的数据。

前进的最佳方式是什么？抓取稍后加载的数据的最佳方法是什么？有人可以向我解释为什么它对他有用而不对我有用。

感谢所有帮助！

Answer 1

我可以看到剧集数据，它来自这个 xhr：

https://gogoanime.pro/ajax/film/servers/jwwn?ep=&episode=

您也可以使用 puppeteer 一次性完成所有操作。