Incrustar Windows Media Player para todos los navegadores

Question

Estamos utilizando WMV videos en un sitio interno, y los estamos incorporando en sitios web. Esto funciona bastante bien en Internet Explorer, pero no en Firefox. He encontrado formas de hacerlo funcionar en Firefox, pero luego deja de funcionar en Internet Explorer.

No queremos utilizar Silverlight todavía, especialmente porque no podemos estar seguros de que todos los clientes ejecuten Windows XP con Windows Media Player instalado.

¿Hay algún tipo de código universal que incorpore WMP en Internet Explorer y Firefox, o tenemos que implementar alguna detección de agente de usuario y entregar HTML diferente para diferentes navegadores?

Answer 1

Lo siguiente me funciona en Firefox e 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> 

Answer 2

Se puede usar comentarios condicionales para obtener el IE y Firefox para hacer cosas diferentes

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

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

Los navegadores mismos ignorará código que no está pensado para que lo lean.

Answer 3

La mejor manera de implementar video en la web es usar Flash: es mucho más fácil incrustarlo limpiamente en una página web y jugará en más o menos cualquier combinación de navegador y plataforma. La única razón para usar Windows Media Player es si está transmitiendo contenido y necesita una administración de derechos digitales extraordinariamente sólida, e incluso entonces los proveedores están empezando a usar Flash incluso para estos. Vea la iPlayer de la BBC para ver un excelente ejemplo.

Le sugiero que cambie a Flash incluso para uso interno. Nunca se sabe quién necesitará acceder a él en el futuro, y esto le dará la mejor compatibilidad posible en el futuro.

EDITAR - 20 de marzo de 2013. ¡Interesante cómo estas viejas preguntas resurgen de vez en cuando! Qué diferente es el mundo hoy y qué tan anticuado parece todo esto. No recomendaría una ruta de Flash hoy, de ninguna manera, la mejor práctica en estos días sería usar HTML 5 para incrustar video codificado en H264, con un respaldo de Flash como se describe aquí: http://diveintohtml5.info/video.html

Answer 4

Encoding flash video es en realidad muy fácil con ffmpeg. Puede usar un comando para convertir desde cualquier formato de video, ffmpeg es lo suficientemente inteligente como para resolver el resto, y usará todos los procesadores de su máquina. La invocación es fácil:

ffmpeg -i input.avi output.flv 

ffmpeg se adivina en la tasa de bits que desee, pero si desea especificar uno, puede utilizar la opción -b, por lo -b 500000 es 500 kbps, por ejemplo. Hay un montón de opciones, por supuesto, pero generalmente obtengo buenos resultados sin demasiados retoques. Este es un buen lugar para comenzar si está buscando más opciones: video options.

No necesita un servidor web especial para mostrar el video flash. Lo he hecho muy bien simplemente presionando los archivos .flv hasta un servidor web estándar y vinculándolos con un buen reproductor de archivos SWF, como flowplayer.

Los WMV están bien si puede estar seguro de que todos sus usuarios siempre usarán [una versión reciente y actualizada de] Windows solamente, pero aun así, Flash es a menudo una mejor opción para la web. El jugador es incluso extremadamente manejable y puede controlarse con javascript.

Answer 5

¿Puedo sugerir el jQuery Media Plugin?Proporciona un código incrustado para todo tipo de video, no solo WMV y detección de navegador, manteniendo todas esas declaraciones desordenadas del conmutador/caso de sus plantillas.

Answer 6

Elizabeth Castro tiene un interesante artículo sobre este problema: Bye Bye Embed. Vale la pena leer sobre cómo atacó este problema, además de manejar el contenido de QuickTime.

Answer 7

Utilice lo siguiente. Funciona en Firefox e 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" /> 

Y en 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) 
     } 


     } 

Answer 8

he encontrado algo que realmente funciona en Firefox e IE, en el sitio de Elizabeth Castro (gracias al enlace en este sitio) - He intentado todas las demás versiones aquí, pero no podían hacer que funcionen tanto en los navegadores

<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> 

revisar su sitio hacia fuera: http://www.alistapart.com/articles/byebyeembed/ y la versión con el classid de la etiqueta de objeto inicial

Answer 9

Encontré un buen artículo sobre using the WMP with Firefox en MSDN.

Basado en el artículo de MSDN y después de algunas pruebas y errores, encontré que usar JavaScript es mejor que usar comentarios condicionales o etiquetas "EMBED/OBJECT" anidadas.

Hice una función JS que generan objeto WMP basado en argumentos dados:

<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> 

Luego utiliza esa función escribiendo algunas marcas y en línea JS como éstas:

<div id='wmpHolder'></div> 

<script type="text/javascript">   
    window.addEventListener('load', generateWindowsMediaPlayer('wmpHolder', 240, 320, 'http://mysite.com/path/video.ext')); 
</script> 

Le ofrecemos jQuery.ready en lugar de evento de carga de ventana en ma rey los códigos más compatibles hacia atrás y navegador cruzado.

He probado los códigos en IE 9-10, Chrome 27, Firefox 21, Opera 12 y Safari 5, en Windows 7/8.