How to check the time of a video

Asked

Viewed 2,642 times

0

I would like help on a problem. I need to check the total time of a embedded video on a website and the video time that was watched. Would anyone have given me a north to be taken? Thank you!

1 answer

4

In Javascript use the properties:

  • .currentTime: position in seconds of video

  • .duration: time in total seconds of video

Note: cannot take the current position of the video via PHP, PHP is on the server side and not on the client side, what you can do is send currentTime via a form or via Ajax

So with document.querySelector can take the video, an example:

var meuVideo = document.querySelector('#meuVideo');
var pegarBtn = document.querySelector('#pegarBtn');
var playBtn = document.querySelector('#playBtn');

pegarBtn.onclick = function () {
    console.log("posição atual:", meuVideo.currentTime);
    console.log("duração:", meuVideo.duration);
};

playBtn.onclick = function () {
    meuVideo.play();
};
<button id="playBtn">Iniciar video</button>
<button id="pegarBtn">Pegar tempo</button>

<video id="meuVideo" src="https://www.w3schools.com/html/mov_bbb.mp4">

Formatting the time

To convert the seconds to a format more visually easy to understand you can split from 60 to 60, for example (example from Maniero in PHP):

var tempo = 1909202;

var horas = Math.floor(tempo / 3600);
var minutos = Math.floor((tempo - (horas * 3600)) / 60);
var segundos = Math.floor(tempo % 60);

if (horas < 10) horas = '0' + horas;
if (minutos < 10) minutos = '0' + minutos;
if (segundos < 10) segundos = '0' + segundos;

console.log(horas + ':' + minutos + ':' + segundos);

So in your video you could use it like this:

function humanizar_horas(tempo)
{
    var horas = Math.floor(tempo / 3600);
    var minutos = Math.floor((tempo - (horas * 3600)) / 60);
    var segundos = Math.floor(tempo % 60);

    if (horas < 10) horas = '0' + horas;
    if (minutos < 10) minutos = '0' + minutos;
    if (segundos < 10) segundos = '0' + segundos;

    return horas + ':' + minutos + ':' + segundos;
}

var meuVideo = document.querySelector('#meuVideo');
var pegarBtn = document.querySelector('#pegarBtn');
var playBtn = document.querySelector('#playBtn');

pegarBtn.onclick = function () {
    console.log("posição atual:", humanizar_horas(meuVideo.currentTime));
    console.log("duração:", humanizar_horas(meuVideo.duration));
};

playBtn.onclick = function () {
    meuVideo.play();
};
<button id="playBtn">Iniciar video</button>
<button id="pegarBtn">Pegar tempo</button>

<video id="meuVideo" src="https://www.w3schools.com/html/mov_bbb.mp4">


With PHP

As I already said, as PHP directly is not possible to catch the current time of the video (as far as watched), but it is possible to catch the duration:

You can experience the getID3, download him into https://sourceforge.net/projects/getid3/files/getID3%28%29%201.x/

require_once '<pasta aonde salvou o getid3>/getid3/getid3.php';

$filename = '<pasta aonde esta o video>/video.mp4';

$getID3 = new getID3;
$file = $getID3->analyze($filename);

echo 'Duração: ', $file['playtime_string'], PHP_EOL,
     'Resolução: ', $file['video']['resolution_x'], 'x', $file['video']['resolution_y'], PHP_EOL,
     'Bytes: ', $file['filesize'];

Or install the ffmpeg and use combined with the shell_exec() PHP, example based on this answer https://stackoverflow.com/a/6251209/1518921:

function getDuration($path) {
     $response = shell_exec('ffmpeg -i ' . escapeshellarg($path) . ' 2>&1', $output);

     $parseduration = '/duration.*?([0-9]{1,})/';

     if (preg_match($parseduration, $response, $matches, PREG_OFFSET_CAPTURE, 3) > 0) {
         return $matches[1][0];
     }
}

echo 'Duração: ', getDuration('pasta/video.flv');
  • It only works in <embed> and <video>?

  • @Erickanderson only in <video> and <audio>. The tag <embed> is obsolete, use video tag for videos and audio for music.

  • @Erickanderson edited the answer with an example of how to humanize the time of the video, leaving it in a format "00:00:00", so it is easier to read

Browser other questions tagged

You are not signed in. Login or sign up in order to post.