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

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

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

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

9 ответов

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

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

    Браузеры сами игнорируют код, который не предназначен для чтения.

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

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

    EDIT — 20 марта 2013.
    Интересно, как эти старые вопросы всплывают время от времени! Как отличается мир сегодня и как все это выглядит. Я бы не рекомендовал маршрут Flash только сегодня никакими средствами — лучшей практикой в эти дни, вероятно, было бы использование HTML 5 для встраивания H264 закодированного видео, с запасным вариантом вспышки, как описано здесь: http://diveintohtml5.info/video.html

  3. Следующие работы для меня в 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>
    
  4. Кодирование флэш-видео на самом деле очень легко с ffmpeg. Вы можете использовать одну команду для преобразования практически из любого формата видео, ffmpeg достаточно умен, чтобы понять остальное, и он будет использовать каждый процессор на вашей машине. Вызывать его легко:

    ffmpeg -i input.avi output.flv
    

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

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

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

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

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

  7. Использовать следующее. Он работает в 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)
            } 
    
    
            }
    
  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 в теге начального объекта

  9. Я нашел хорошую статью об использовании 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.