ultimos - windows 11 2018




Incrustar Windows Media Player para todos los navegadores (6)

Estamos usando videos WMV en un sitio interno, y los estamos incrustando 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.

Todavía no queremos usar Silverlight, especialmente porque no podemos estar seguros de que todos los clientes ejecutarán Windows XP con Windows Media Player instalado.

¿Existe algún tipo de Código Universal que incorpore WMP tanto en Internet Explorer como en Firefox, o necesitamos implementar alguna detección de agente de usuario y entregar HTML diferente para diferentes navegadores?


¿Puedo sugerir el complemento jQuery Media ? Proporciona código de incrustación para todo tipo de video, no solo WMV y realiza la detección del navegador, manteniendo todas esas declaraciones desordenadas / de cambio fuera de sus plantillas.


Codificar video flash es realmente muy fácil con ffmpeg. Puede usar un comando para convertir desde casi cualquier formato de video, ffmpeg es lo suficientemente inteligente como para resolver el resto, y usará todos los procesadores de su máquina. Invocarlo es fácil:

ffmpeg -i input.avi output.flv

ffmpeg adivinará la tasa de bits que desea, pero si desea especificar una, puede usar la opción -b, por lo que -b 500000 es 500 kbps, por ejemplo. Hay un montón de opciones, por supuesto, pero generalmente obtengo buenos resultados sin muchos ajustes. Este es un buen lugar para comenzar si está buscando más opciones: opciones de video .

No necesita un servidor web especial para mostrar videos flash. Lo hice muy bien simplemente empujando archivos .flv a un servidor web estándar y vinculándolos con un buen reproductor 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 a menudo se adapta mejor a la web. El reproductor es incluso extremadamente personalizable y puede controlarse con javascript.


Encontré algo que en realidad funciona tanto en FireFox como en IE, en el sitio de Elizabeth Castro (gracias al enlace en este sitio). He probado todas las otras versiones aquí, pero no pude hacer que funcionen en ambos 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>

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


Encontré un buen artículo sobre el uso de WMP con Firefox en MSDN.

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

Hice una función JS que genera un 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 usé esa función escribiendo algunas marcas y JS en línea como estas:

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

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

Puede usar jQuery.ready en lugar del evento de carga de la ventana para hacer que los códigos sean más compatibles con versiones anteriores y entre navegadores.

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


Puede usar comentarios condicionales para que IE y Firefox hagan cosas diferentes

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

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

Los navegadores mismos ignorarán el código que no está destinado a leer.


Usa 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)
        } 


        }




media