HTML5 читает видео метаданные mp4
Используя HTML5, я пытаюсь получить атрибут (то есть вращение), расположенный в заголовке mp4 (я воспроизвожу его с помощью тега видео), чтобы сделать это, я пытаюсь получить байты, составляющие заголовок, и зная структуру, найдите этот атом.
Кто-нибудь знает, как это сделать в javascript?
Ответы
Ответ 1
Я не думаю, что вы можете извлечь такие подробные метаданные из видео, используя HTML5 и его видео-тег. Здесь перечислены только те, которые вы можете извлечь (длина видео, видео треки и т.д.):
http://www.w3schools.com/tags/ref_av_dom.asp
Конечно, в некоторых браузерах могут быть специальные дополнительные методы, но нет "общего" подхода - вам понадобится больше, чем существующие методы HTML5.
Ответ 2
Вы можете использовать mediainfo.js
,
Это перенос mediainfo
(cpp) в javascript, скомпилированном с emsciptem
.
Вот рабочий пример: https://mediainfo.js.org/
Вам нужно будет включить файл js/mediainfo.js
и поместить файл mediainfo.js.mem
в ту же папку.
Вам нужно проверить источники в этом файле, чтобы увидеть, как он работает:
https://mediainfo.js.org/js/mediainfopage.js
[...]
function parseFile(file) {
if (processing) {
return;
}
processing = true;
[...]
var fileSize = file.size, offset = 0, state = 0, seekTo = -1, seek = null;
mi.open_buffer_init(fileSize, offset);
var processChunk = function(e) {
var l;
if (e.target.error === null) {
var chunk = new Uint8Array(e.target.result);
l = chunk.length;
state = mi.open_buffer_continue(chunk, l);
var seekTo = -1;
var seekToLow = mi.open_buffer_continue_goto_get_lower();
var seekToHigh = mi.open_buffer_continue_goto_get_upper();
if (seekToLow == -1 && seekToHigh == -1) {
seekTo = -1;
} else if (seekToLow < 0) {
seekTo = seekToLow + 4294967296 + (seekToHigh * 4294967296);
} else {
seekTo = seekToLow + (seekToHigh * 4294967296);
}
if(seekTo === -1){
offset += l;
}else{
offset = seekTo;
mi.open_buffer_init(fileSize, seekTo);
}
chunk = null;
} else {
var msg = 'An error happened reading your file!';
console.err(msg, e.target.error);
processingDone();
alert(msg);
return;
}
// bit 4 set means finalized
if (state&0x08) {
var result = mi.inform();
mi.close();
addResult(file.name, result);
processingDone();
return;
}
seek(l);
};
function processingDone() {
processing = false;
$status.hide();
$cancel.hide();
$dropcontrols.fadeIn();
$fileinput.val('');
}
seek = function(length) {
if (processing) {
var r = new FileReader();
var blob = file.slice(offset, length + offset);
r.onload = processChunk;
r.readAsArrayBuffer(blob);
}
else {
mi.close();
processingDone();
}
};
// start
seek(CHUNK_SIZE);
}
[...]
// init mediainfo
miLib = MediaInfo(function() {
console.debug('MediaInfo ready');
$loader.fadeOut(function() {
$dropcontrols.fadeIn();
window['miLib'] = miLib; // debug
mi = new miLib.MediaInfo();
$fileinput.on('change', function(e) {
var el = $fileinput.get(0);
if (el.files.length > 0) {
parseFile(el.files[0]);
}
});
});
Вот адрес Github с источниками проекта: https://github.com/buzz/mediainfo.js