Uncaught (in promise) DOMException: the play() 请求被调用 pause() 中断 - Puppetter

问题描述

我正在使用 Puppetter 抓取此网站 - https://chillhop.com/releases/endless-sunday-vol-2/。所以，到目前为止，我已经能够获得所有曲目、艺术家姓名和曲目持续时间。但是，我还想抓取所有可用音乐曲目的 src。问题在于，播放曲目时，chillhop 网站会动态地将“src”添加到音频元素中。因此，我需要遍历所有曲目，单击它们播放曲目，然后获取“src”。我已经添加了我正在使用的代码，但是，我收到了这个错误：Uncaught (in promise) DOMException: The play() request was interrupted by call to pause()

这可能是因为循环快速迭代曲目并在当前曲目开始播放之前播放下一曲目。如何等待播放曲目，然后使用 Puppetter 单击下一曲目？

Git 存储库 - https://github.com/Vaasu-Dhand/chillhop-music-scraper。只需运行 npm start，它就会为您抓取网站并将数据保存到 json 文件中。

export async function scrape() {
    try {
      // set some options (set headless to false so we can see this automated browsing experience)
      let launchOptions = {
        headless: true,executablePath:
          'C:/Program Files (x86)/Google/Chrome/Application/chrome.exe',// because we are using puppeteer-core so we must define this option
        args: ['--start-maximized'],};

      const browser = await puppeteer.launch(launchOptions);
      const page = await browser.newPage();
      

      // set viewport and user agent (just in case for nice viewing)
      await page.setViewport({ width: 1366,height: 768 });
      await page.setUserAgent(
        'Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML,like Gecko) Chrome/78.0.3904.108 Safari/537.36'
      );

      // Go to the chillHop Albums Page
      await page.goto('https://chillhop.com/releases/');
      const albumLinks = await page.$$eval('.release > a',(list) =>
        list.map((elm) => elm.href)
      ); // 12 Albums Load Initaially

      // console.log(albumLinks);

      for (const [index,albumURL] of albumLinks.entries()) {
        // console.log(albumURL);
        await page.goto(albumURL);

        try {


          await page.waitForTimeout(2000) // * MAGIC

          await page.$$eval('.list',listElement => listElement[1].remove());

          let numOfTracks = await page.$$eval('.track-single',(tracks) => tracks.length
          );
          // [SOLVED] The number of tracks come out to be 25 more than the actual number of tracks for some reason
          // console.log(numOfTracks);

          // Hold for a bit
          // await page.waitForTimeout(50000)

          if (numOfTracks >= 5) {
            let albumName = await page.$eval('div.title-holder h1',(name) => name.textContent);
            let albumartist = await page.$eval('div.title-holder h2',(name) => name.textContent);
            let [imgSrc,imgalt] = await page.$eval('.col-md-6.col-sm-4.fa img',(img) => [img.getAttribute('src'),img.getAttribute('alt')]);
            // let audioSrc = await page.$eval('audio#jp_audio_0',(audio) => audio.childNodes
            // let releaseDate = await page.$$eval('span.date',date => [...date])
            // console.log(albumName,albumartist,imgSrc,imgalt);
            let trackData = await page.$$eval('.track-single',(tracks) => {
              
              return tracks.map((track,index) => {  // Maybe make this async?
                
                  track.querySelector(`a.track-${track.children[0].getAttribute('data-track')}`).click();   // Check if this is working properly
  
                  return {
                    'data-track': track.children[0].getAttribute('data-track'),title: track.querySelector('div.trackTitle').textContent,artists: track.querySelectorAll('div.trackArtists')[0].textContent,duration: track.querySelector('div.track-length').textContent,"audio-src": document.querySelector('audio').getAttribute('src')  
                  };
                  
              });
            });
            // console.log(trackData);

            let albumData = {
              "name": albumName,"artist": albumartist,"url": albumURL,"img-src": imgSrc,"img-alt": imgalt,"tracks": trackData
            }

            if ((index + 1) === albumLinks.length) {  // Last Album
              appendData(albumData,true)
            } else {
              appendData(albumData,false)
            }
          }
        } catch (error) { // * If Something Goes Wrong
          console.log(error);
          continue;
        }
        // formatData(albumData)
      }

      // close the browser
      await browser.close();
    } catch (error) {
      console.log(error);
    }
  
}

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）