Как извлечь субтитры из приостановленного видеокадра внешнего веб-сайта и распечатать его через console.log? - PullRequest
Новая
       44

Как извлечь субтитры из приостановленного видеокадра внешнего веб-сайта и распечатать его через console.log?

0 голосов
/ 14 февраля 2020

Я хотел бы извлечь текст субтитров на приостановленном видеокадре внешнего сайта (например, youtube.com) через console.log.

Предполагается, что внешний веб-сайт предоставляет субтитры через webvtt или подобный файл.

Поскольку текст субтитров, возможно, является частью DOM, может ли код JavaScript использоваться в браузере Консоль разработчика для извлечения текста и отображения его через console.log () после определения времени, в которое он был приостановлен?

1 Ответ

0 голосов
/ 14 февраля 2020

Вы можете получить доступ к видео .textTracks, из которого вы сможете получить доступ к activeCues, откуда вы можете получить значение text: 

initTrack();
video.addEventListener('pause', e => {
 const track = [ ...video.textTracks ]
   .find( track => track.mode === "showing" );
 const texts = [...track.activeCues].map( cue => cue.text );
 console.log( texts.join('\n') );
});


// just to make a VTT accessible in Snippet
function initTrack() {
  const track = document.querySelector("track");
  let vttText = `WEBVTT`;
  for( let i=0; i<35; i++ ) {
    const t1 = (i + '').padStart(2 , '0');
    const t2 = ((i+1) + '').padStart(2 , '0');
    vttText += `
      00:00:${t1}.000 --> 00:00:${t2}.000
      Test${i}`
  }
  const vttBlob = new Blob([vttText], {
    type: 'text/plain'
  });
  track.src = URL.createObjectURL(vttBlob);
}
video { max-height: 150px;  }
::cue { font-size: 30px }
<div>
  <video id="video" controls>
    <source src="https://upload.wikimedia.org/wikipedia/commons/a/a4/BBH_gravitational_lensing_of_gw150914.webm">
    <track default kind="captions" label="English" srclang="en"/>
  </video>
</div>
...