Встраивание проигрывателя Windows Media для всех браузеров

Мы используем видео WMV на внутреннем сайте и встраиваем их в веб-сайты. Это хорошо работает в Internet Explorer, но не в Firefox. Я нашел способы заставить его работать в Firefox, но затем он перестает работать в Internet Explorer.

Мы пока не хотим использовать Silverlight, тем более что мы не можем быть уверены, что все клиенты будут работать под управлением Windows XP с установленным проигрывателем Windows Media.

Существует ли какой-то универсальный код, который встраивает WMP как в Internet Explorer, так и в Firefox, или нам нужно реализовать какое-либо обнаружение пользовательских агентов и предоставлять разные HTML для разных браузеров?

1.08.2008 18:02:22
Кросс-браузерное решение, которое всегда работает ... Как транслировать музыку или аудио с вашего сайта: nunzioweb.com/streaming_audio-example.htm
user257952 24.01.2010 20:17:45
9 ОТВЕТОВ
РЕШЕНИЕ

В 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>
46
14.07.2013 11:45:15
Когда я использую этот метод, я не могу управлять плеером через JavaScript. Например, mediaplayer.controls не определен. Есть ли кросс-браузерный способ, который также позволяет это?
Zack The Human 10.04.2009 21:37:14
это потому , что objectимеет , idно embedэлемент бежится. Лучше дать обоим элементам «уникальный» класс, выбрать оба и отфильтровать тот, который активен.
zzzzBov 21.02.2011 22:14:24
Помните, что с версии 7.0 идентификатор класса был изменен на 6BF52A52-394A-11d3-B153-00C04F79FAA6. Смотрите, например, здесь .
Simon 28.10.2011 22:32:49
Я настоятельно рекомендую эту ссылку от Элизабет Кастро, так как код намного скуднее и не требует classid. Кроме того, парень ниже меня действительно рекомендовал статью в первую очередь.
Joseph 20.01.2014 20:33:56

Могу ли я предложить плагин jQuery Media ? Предоставляет код для встраивания для всех видов видео, не только WMV, а также для обнаружения в браузере, исключая все эти беспорядочные операторы switch / case из ваших шаблонов.

20
8.08.2008 18:29:13

Используйте следующее. Работает в 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)
        } 


        }
9
8.04.2011 16:23:19

У Элизабет Кастро есть интересная статья по этой проблеме: Bye Bye Embed . Стоит прочитать о том, как она справилась с этой проблемой, а также о работе с контентом QuickTime.

7
10.11.2008 19:52:28

Вы можете использовать условные комментарии, чтобы IE и Firefox делали разные вещи

<![if !IE]>
<p> Firefox only code</p>
<![endif]>

<!--[if IE]>
<p>Internet Explorer only code</p>
<![endif]-->

Сами браузеры будут игнорировать код, который не предназначен для их чтения.

6
1.08.2008 18:14:56

Лучший способ развернуть видео в Интернете - это использовать Flash - его гораздо проще встроить в веб-страницу, и он будет воспроизводиться в более или менее любой комбинации браузера и платформы. Единственная причина использовать Windows Media Player - если вы используете потоковую передачу контента и вам необходимо чрезвычайно сильное управление цифровыми правами, и даже тогда провайдеры теперь начинают использовать Flash даже для этих целей. Посмотрите iPlayer BBC для превосходного примера.

Я бы предложил вам переключиться на Flash даже для внутреннего использования. Вы никогда не знаете, кому понадобится доступ к нему в будущем, и это обеспечит вам наилучшую совместимость в будущем.

РЕДАКТИРОВАТЬ - 20 марта 2013 г. Интересно, как время от времени всплывают эти старые вопросы! Насколько отличается мир сегодня и как все это выглядит устаревшим. Я не рекомендовал бы сегодня использовать только флэш-маршрут. Лучше всего в наши дни использовать HTML 5 для встраивания видео в кодировке H264 с резервной версией Flash, как описано здесь: http://diveintohtml5.info/video.html.

6
20.03.2013 17:59:17
Я сказал, что это наивный комментарий. iPlayer легко сравнивается с другими продуктами, в основном потому, что их «DRM» - просто случай, когда кто-то работает через GeoIP. Flash повезло, что у него нет конкурентов с его третьим языком программирования и некорректной средой исполнения -1, слишком субъективным, вопрос был в том, как встроить WMP во все браузеры ... какое отношение Flash имеет к этому ???
Matt 29.11.2009 00:13:07
Это альтернативный подход - что наивного в предложении альтернатив?
Polsonby 1.12.2009 13:43:24
Может быть, это не так, теперь, когда у нас есть HTML5.
Robert Harvey 25.05.2012 16:48:57
Как говорится в исходном комментарии, предполагающем использование Silverlight, этот комментарий определенно действителен как мнение одного источника.
qwertzman 19.03.2013 14:49:02

Кодирование флеш-видео на самом деле очень просто с помощью ffmpeg. Вы можете использовать одну команду для преобразования практически из любого видео формата, ffmpeg достаточно умен, чтобы понять все остальное, и он будет использовать каждый процессор на вашей машине. Вызывать это легко:

ffmpeg -i input.avi output.flv

ffmpeg будет угадывать желаемый битрейт, но если вы хотите указать его, вы можете использовать опцию -b, -b 500000например, 500 кбит / с. Конечно, есть множество вариантов, но я обычно получаю хорошие результаты без особых усилий. Это хорошее место для начала, если вы ищете больше вариантов: видео .

Вам не нужен специальный веб-сервер для показа флэш-видео. Я сделал это просто, просто поместив файлы .flv на стандартный веб-сервер и связавшись с ними с помощью хорошего SWF-плеера, такого как flowplayer .

WMV - это хорошо, если вы можете быть уверены, что все ваши пользователи всегда будут использовать только [последнюю, актуальную версию] Windows, но даже в этом случае Flash часто лучше подходит для Интернета. Плеер даже очень скины и может управляться с помощью JavaScript.

4
4.08.2008 02:14:59

Я нашел хорошую статью об использовании 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.ready вместо события загрузки окна, чтобы сделать коды более обратно-совместимыми и кросс-браузерными.

Я тестировал коды в IE 9-10, Chrome 27, Firefox 21, Opera 12 и Safari 5 в Windows 7/8.

4
1.09.2013 20:40:35
Это работает, но в Firefox все видео загружается до того, как оно начнет воспроизводиться. Очевидно, это создает довольно длинный загрузочный экран. Есть ли способ, чтобы этот поток видео в Firefox?
MNRSullivan 28.08.2013 16:26:56
К сожалению, я не нашел пути, чтобы предотвратить эту проблему. По-видимому, такова природа объекта WMP в Firefox. По этой причине я использую событие загрузки окна , потому что это последняя точка (момент) интерпретации разметки (ресурсов) страницы. Установка атрибута данных после загрузки страницы, возможно, уменьшит время загрузки (очевидно, не на 100%!). Удачи.
Perseus 30.08.2013 09:03:12
Я нашел решение. Изменен тип проигрывателя Firefox на video / x-ms-wmv. Я также заметил, что Firefox и Chrome не могут воспроизводить видео с пробелами в названии. Я исправил это, заменив все пустые места в строке videoUrl на «% 20», после чего все
MNRSullivan 30.08.2013 13:11:02
Отличная работа! Я изменил свои коды: Line 15: videoUrl = encodeURI(videoUrl); и Line 19: //player += 'type="application/x-ms-wmp" '; Line 20: player += 'type="video/x-ms-wmp" ';
Perseus 1.09.2013 20:55:45

На сайте Элизабет Кастро я нашел что-то, что на самом деле работает и в 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 в теге начального объекта

3
8.11.2009 06:21:20