Question

当我请求实现的api时遇到错误。一旦使用了其中一个端点，它就会向我显示错误之后的错误，如下所示。

将无法控制该错误。

错误消息：

TypeError: Cannot read property 'contentFrame' of null
    at Object.getAnimeVideo (C:\Users\c\Desktop\ryuanime\src\api\scraper.ts:89:37)
    at process._tickCallback (internal/process/next_tick.js:68:7)

代码：

const getAnimeVideo = async (id: string, chapter: number) => {
  const BASE_URL = `${url}${id}/${chapter}/`;
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.goto(BASE_URL);
  const elementHandle = await page.$('.player_conte');
  const frame = await elementHandle.contentFrame(); //line 89 error
  const video = await frame.$eval('#jkvideo_html5_api', el =>
    Array.from(el.getElementsByTagName('source')).map(e => e.getAttribute("src")));
  await browser.close();
  return video;
}

Answer 1

问题

elementHandle是null。这就是为什么您会收到错误消息，指出contentFrame上没有函数null。当找不到选择器时，page.$是null。

解决方案

要解决此问题，您可以做两件事：

选择器实际上是您要寻找的选择器吗？是在框架内，而不是在页面本身上，还是拼写错误？
也许在脚本运行时该元素不存在？页面可能异步加载更多数据并更改DOM？在这种情况下，您可以像这样使用page.waitForSelector来等待元素出现：
```
const elementHandle = await page.waitForSelector('.player_conte');
```

如何解决，错误：无法使用puppeteer读取null的属性'contentFrame'

1 个答案: