Вспышка в mediaelement.js показывает только " скачать файл"
Я хотел бы получить резервную копию Flash для mediaelement.js для работы, но он показывает только черную область с надписью "загрузить файл" в верхнем левом углу. Разметка видео, которую я генерирую, выглядит примерно так. Я просто изменил некоторые пути по соображениям конфиденциальности:
<video width="1024" height="576" preload="none" style="display: none; ">
<object width="1024" height="576" type="application/x-shockwave-flash" data="flashmediaelement.swf">
<param name="movie" value="/wp-content/themes/my_theme/js/vendor/mediaelement/flashmediaelement.swf">
<param name="flashvars" value="controls=true&file=http://mybucket.s3.amazonaws.com/my_video.mp4">
</object>
</video>
есть ли что-то явно неправильное в этом? Есть ли способ получить отладочный вывод? Когда появляется" загрузить файл"? Метод MediaElement.js page нигде не упоминает об этом. Сначала я подумал, что один из пути должны быть неправильными, но я не вижу никаких неудачных запросов в инструментах отладки Chrome.
любая помощь приветствуется!
изменить: Я извлек минимальный пример неудачного кода и загрузил его здесь
3 ответов
1) Вы не указали <source/>
внутри видео - Вот почему он не работает. Вам нужно указать несколько <source/>
для его работы в разных браузерах-см. "вариант B" вhttp://mediaelementjs.com/ .
ссылка"Загрузить файл" действительно генерируется логикой MediaElement (см. mediaelement-and-player.js:1027
).
2) Флэш версии будет только в том случае, если браузер не поддерживает <video>
тег. Чтобы проверить его в браузере, замените"
вот фиксированный код (заменены некоторые пути, чтобы иметь возможность проверить его):
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="http://ajmurmann.com/flash_test/mediaelement-and-player.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('video').mediaelementplayer({
enablePluginDebug: true,
plugins: ['flash','silverlight']
});
});
</script>
</head>
<body>
<video width="1024" height="576" controls="controls">
<!-- MP4 for Safari, IE9, iPhone, iPad, Android, and Windows Phone 7 -->
<source type="video/mp4" src="http://mediaelementjs.com/media/echo-hereweare.mp4" />
<!-- WebM/VP8 for Firefox4, Opera, and Chrome -->
<source type="video/webm" src="http://mediaelementjs.com/media/echo-hereweare.webm" />
<!-- Ogg/Vorbis for older Firefox and Opera versions -->
<source type="video/ogg" src="http://mediaelementjs.com/media/echo-hereweare.ogv" />
<object width="1024" height="576" type="application/x-shockwave-flash" data="http://ajmurmann.com/flash_test/flashmediaelement.swf">
<param name="movie" value="http://ajmurmann.com/flash_test/flashmediaelement.swf">
<param name="flashvars" value="controls=true&file=http://ajmurmann.com/flash_test/echo-hereweare.mp4">
</object>
</video>
</body>
</html>
Как заявил ivan_pozdeev, вам нужно указать тег src в вашем элементе видео. Однако вам не нужно предоставлять несколько источников для MediaElement.js для работы в разных браузерах.
в вашем случае вы можете предоставить один .mp4-файл, и он будет работать в браузерах (см. Шаг 2: опция a в http://www.mediaelementjs.com) до тех пор, пока у вас установлена вспышка или Silverlight (т. е. функциональность "Fall-Forward" ME).
"Загрузить Файл " появится, когда HTML5 не является родным для браузера, который вы используете, и у вас нет соответствующего плагина (например, Flash или Silverlight). В медиаэлемент-и-плеер.js, перерыв на линии 162 (var pv = this.plugins[plugin];) - если "pv" имеет значение "0, 0, 0", MediaElement не обнаружил плагин, и вы получите ссылку "Загрузить файл".
Если вы пытаетесь сделать видео youtube, и это показывает это, что произошло, я забыл поставить type="video/youtube" в исходном теге. Он был просто установлен на type= 'video'