Сообщение от czp
|
то что вы показываете это прямая ссылка на видео, так то работает, но у меня стрим, я получаю чанки с сервака и запихиваю в буфер, через MediaSource, вот так уже не работает, потому что не прямая ссылка
|
Я вам написал, как оно работает, а то каким образом вы получаете данные не имеет значение... Вот пример со «стримом»...
<body style="display: grid; grid-gap: 1em; justify-content: center; ">
<video id="video"></video>
<button id="button">Сделать снимок видео</button>
<canvas id="canvas"></canvas>
<dialog id="tapArea" hidden>Tap to play</dialog>
<script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
<script>
var hls = new Hls();
hls.loadSource('https://lsqvc1uscln-lh.akamaihd.net/i/lsqvc1uscln_01@809410/master.m3u8');
hls.attachMedia(video);
hls.on(Hls.Events.MANIFEST_PARSED,function() {
video.play().catch(() => {
tapArea.hidden = false;
document.addEventListener("click", () => {
video.play();
tapArea.hidden = true;
}, { once: true });
});
});
/* функция «снимка видео» не поменялась */
button.onclick = () => {
canvas.width = video.videoWidth;
canvas.height = video.videoHeight;
canvas.getContext("2d").drawImage(video, 0, 0);
}
</script>