Встраивание проигрывателя Windows Media для всех браузеров
https://stackoverflow.com/questions/164
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
RussianВопрос
Мы используем WMV видеоролики размещены на внутреннем сайте, и мы встраиваем их в веб-сайты.Это довольно хорошо работает в Internet Explorer, но не в Firefox.Я нашел способы заставить это работать в Firefox, но затем оно перестает работать в Internet Explorer.
Мы пока не хотим использовать Silverlight, тем более что мы не можем быть уверены, что все клиенты будут работать под управлением Windows XP с установленным Windows Media Player.
Существует ли какой-то универсальный код, который встраивает WMP как в Internet Explorer, так и в Firefox, или нам нужно реализовать некоторое обнаружение пользовательского агента и предоставлять разный HTML для разных браузеров?
Решение
Следующее работает для меня в Firefox и Internet Explorer:
<object id="mediaplayer" classid="clsid:22d6f312-b0f6-11d0-94ab-0080c74c7e95" codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#version=5,1,52,701" standby="loading microsoft windows media player components..." type="application/x-oleobject" width="320" height="310">
<param name="filename" value="./test.wmv">
<param name="animationatstart" value="true">
<param name="transparentatstart" value="true">
<param name="autostart" value="true">
<param name="showcontrols" value="true">
<param name="ShowStatusBar" value="true">
<param name="windowlessvideo" value="true">
<embed src="./test.wmv" autostart="true" showcontrols="true" showstatusbar="1" bgcolor="white" width="320" height="310">
</object>
Другие советы
Могу я предложить следующее Медиа-плагин jQuery?Предоставляет код для встраивания для всех видов видео, а не только WMV, и выполняет распознавание браузером, удаляя все эти беспорядочные инструкции переключения / обращения из ваших шаблонов.
Используйте следующее.Это работает в Firefox и Internet Explorer.
<object id="MediaPlayer1" width="690" height="500" classid="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95"
codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701"
standby="Loading Microsoft® Windows® Media Player components..." type="application/x-oleobject"
>
<param name="FileName" value='<%= GetSource() %>' />
<param name="AutoStart" value="True" />
<param name="DefaultFrame" value="mainFrame" />
<param name="ShowStatusBar" value="0" />
<param name="ShowPositionControls" value="0" />
<param name="showcontrols" value="0" />
<param name="ShowAudioControls" value="0" />
<param name="ShowTracker" value="0" />
<param name="EnablePositionControls" value="0" />
<!-- BEGIN PLUG-IN HTML FOR FIREFOX-->
<embed type="application/x-mplayer2" pluginspage="http://www.microsoft.com/Windows/MediaPlayer/"
src='<%= GetSource() %>' align="middle" width="600" height="500" defaultframe="rightFrame"
id="MediaPlayer2" />
И в JavaScript,
function playVideo() {
try{
if(-1 != navigator.userAgent.indexOf("MSIE"))
{
var obj = document.getElementById("MediaPlayer1");
obj.Play();
}
else
{
var player = document.getElementById("MediaPlayer2");
player.controls.play();
}
}
catch(error) {
alert(error)
}
}
У Элизабет Кастро есть интересная статья по этой проблеме: До свидания, До свидания ..Стоит прочитать о том, как она решала эту проблему, а также о том, как обращаться с контентом QuickTime.
Вы могли бы использовать условные комментарии, чтобы заставить IE и Firefox делать разные вещи
<![if !IE]>
<p> Firefox only code</p>
<![endif]>
<!--[if IE]>
<p>Internet Explorer only code</p>
<![endif]-->
Сами браузеры будут игнорировать код, который не предназначен для их чтения.
Лучший способ разместить видео в Интернете - это использовать Flash - его гораздо проще встроить в веб-страницу, и он будет воспроизводиться более или менее в любой комбинации браузера и платформы.Единственная причина использовать Windows Media Player - это если вы транслируете контент в потоковом режиме и вам необходимо чрезвычайно надежное управление цифровыми правами, и даже тогда провайдеры сейчас начинают использовать Flash даже для них.Смотрите iPlayer от BBC для получения превосходного примера.
Я бы посоветовал вам переключиться на Flash даже для внутреннего использования.Вы никогда не знаете, кому понадобится доступ к нему в будущем, и это обеспечит вам наилучшую совместимость в будущем.
ПРАВКА - 20 марта 2013 года.Интересно, как эти старые вопросы всплывают время от времени!Насколько изменился современный мир и каким устаревшим все это кажется.Я бы ни в коем случае не рекомендовал использовать маршрут только для Flash сегодня - лучшей практикой в наши дни, вероятно, было бы использовать HTML 5 для встраивания видео в кодировке H264 с резервным вариантом Flash, как описано здесь: http://diveintohtml5.info/video.html
Кодирование флэш-видео на самом деле очень простое с помощью ffmpeg.Вы можете использовать одну команду для конвертации практически из любого видеоформата, ffmpeg достаточно умен, чтобы разобраться с остальным, и он будет использовать каждый процессор на вашем компьютере.Вызвать его несложно:
ffmpeg -i input.avi output.flv
ffmpeg определит нужный вам битрейт, но если вы хотите указать его, вы можете использовать опцию -b, так что -b 500000 например, это 500 Кбит/с.Конечно, есть масса вариантов, но обычно я получаю хорошие результаты без особых усилий.Это хорошее место для начала, если вы ищете дополнительные варианты: параметры видео.
Вам не нужен специальный веб-сервер для показа flash-видео.Я отлично справился, просто загрузив flv-файлы на стандартный веб-сервер и связавшись с ними с помощью хорошего swf-плеера, например потоковый проигрыватель.
WMV-файлы хороши, если вы можете быть уверены, что все ваши пользователи всегда будут использовать только [последнюю, обновленную версию] Windows, но даже в этом случае Flash часто лучше подходит для работы в Интернете.Плеер даже очень удобен в использовании и может управляться с помощью javascript.
Я нашел хорошую статью о использование WMP в Firefox в MSDN.
Основываясь на статье MSDN и после нескольких проб и ошибок, я обнаружил, что использование JavaScript лучше, чем использование условных комментариев или вложенных тегов "EMBED / OBJECT".
Я создал JS-функцию, которая генерирует WMP-объект на основе заданных аргументов:
<script type="text/javascript">
function generateWindowsMediaPlayer(
holderId, // String
height, // Number
width, // Number
videoUrl // String
// you can declare more arguments for more flexibility
) {
var holder = document.getElementById(holderId);
var player = '<object ';
player += 'height="' + height.toString() + '" ';
player += 'width="' + width.toString() + '" ';
videoUrl = encodeURI(videoUrl); // Encode for special characters
if (navigator.userAgent.indexOf("MSIE") < 0) {
// Chrome, Firefox, Opera, Safari
//player += 'type="application/x-ms-wmp" '; //Old Edition
player += 'type="video/x-ms-wmp" '; //New Edition, suggested by MNRSullivan (Read Comments)
player += 'data="' + videoUrl + '" >';
}
else {
// Internet Explorer
player += 'classid="clsid:6BF52A52-394A-11d3-B153-00C04F79FAA6" >';
player += '<param name="url" value="' + videoUrl + '" />';
}
player += '<param name="autoStart" value="false" />';
player += '<param name="playCount" value="1" />';
player += '</object>';
holder.innerHTML = player;
}
</script>
Затем я использовал эту функцию, написав несколько разметок и встроенных JS, подобных этим:
<div id='wmpHolder'></div>
<script type="text/javascript">
window.addEventListener('load', generateWindowsMediaPlayer('wmpHolder', 240, 320, 'http://mysite.com/path/video.ext'));
</script>
Вы можете использовать jQuery.готов вместо того, чтобы событие загрузки окна чтобы сделать коды более обратно совместимыми и кроссбраузерными.
Я протестировал коды в IE 9-10, Chrome 27, Firefox 21, Opera 12 и Safari 5 в Windows 7/8.
Я нашел кое-что, что действительно работает как в FireFox, так и в IE, на сайте Элизабет Кастро (благодаря ссылке на этом сайте) - я перепробовал все другие версии здесь, но не смог заставить их работать в обоих браузерах
<object classid="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6"
id="player" width="320" height="260">
<param name="url"
value="http://www.sarahsnotecards.com/catalunyalive/fishstore.wmv" />
<param name="src"
value="http://www.sarahsnotecards.com/catalunyalive/fishstore.wmv" />
<param name="showcontrols" value="true" />
<param name="autostart" value="true" />
<!--[if !IE]>-->
<object type="video/x-ms-wmv"
data="http://www.sarahsnotecards.com/catalunyalive/fishstore.wmv"
width="320" height="260">
<param name="src"
value="http://www.sarahsnotecards.com/catalunyalive/fishstore.wmv" />
<param name="autostart" value="true" />
<param name="controller" value="true" />
</object>
<!--<![endif]-->
</object>
Загляните на ее сайт: http://www.alistapart.com/articles/byebyeembed/ и версия с classid в исходном теге object
