soportados - HTML5: el video mp4 no se reproduce en IE9
reproducir formato mime en firefox (13)
Tengo un video de mp4 que quiero reproducir en IE9 usando la etiqueta HTML5 <video>
. Agregué el tipo MIME a IIS 7, por lo que si busco http://localhost/video.mp4
se reproduce tanto en Chrome como en IE9 pero no en HTML5, Chrome reproduce el video en HTML. Aquí está el código:
<html>
<body>
<video src="video.mp4" width="400" height="300" preload controls>
</video>
</body>
</html>
¿Algunas ideas?
Gracias
ACTUALIZAR:
Intenté el mismo archivo en Firefox 5.0 y tampoco funcionó, solo Chrome puede reproducir el video mp4.
Dan tiene una de las mejores respuestas y te sugiero que uses html5test.com en tus navegadores de destino para ver los formatos de video compatibles.
Como se mencionó anteriormente, no funciona ningún formato único y lo que uso es MP4 codificado para H.264, WebM y un respaldo de flash. Esto permite mostrar video sobre lo siguiente:
Win 7 - IE9, Chrome, Firefox, Safari, Opera
Win XP - IE7, IE8, Chrome, Firefox, Safari, Opera
MacBook OS X - Chrome, Firefox, Safari, Opera
iPad 2, iPad 3
Linux - Android 2.3, Android 3
<video width="980" height="540" controls>
<source src="images/placeholdername.mp4" type="video/mp4" />
<source src="images/placeholdername.webm" type="video/webm" />
<embed src="images/placeholdername.mp4" type="application/x-shockwave-flash" width="980" height="570" allowscriptaccess="always" allowfullscreen="true" autoplay="false"></embed> <!--IE 8 - add 25-30 pixels to vid height to allow QT player controls-->
</video>
Nota: El video .mp4 debe estar codificado en el perfil básico h264, de modo que se reproduzca en todos los dispositivos móviles.
Actualización: se agregó autoplay = "false" a la recuperación de Flash. Esto evita que el MP4 comience a jugar de inmediato cuando la página se carga en IE8, comenzará a reproducirse una vez que se presione el botón de reproducción.
Internet Explorer 9 admite MPEG4 con el códec H.264. Pero también requiere que el archivo pueda comenzar a reproducirse tan pronto como comience la descarga.
Estos son los pasos básicos sobre cómo hacer un archivo MPEG que funcione en IE9 (usando avconv en Ubuntu). Pasé muchas horas para resolverlo, así que espero que pueda ayudar a alguien más.
Convierta el video a MPEG4 usando el códec H.264. No necesita nada sofisticado, solo deje que avconv haga el trabajo por usted:
avconv -i video.mp4 -vcodec libx264 pre_out.mp4
Este video funcionará en todos los navegadores compatibles con MPEG4, excepto IE9. Para agregar soporte para IE9, debe mover la información del archivo al encabezado del archivo, para que el navegador pueda comenzar a reproducirlo tan pronto como comience a descargarlo. ESTA ES LA CLAVE PARA IE9 !!!
qt-faststart pre_out.mp4 out.mp4
qt-faststart
es una utilidad Quicktime que también admite el formato de archivo H.264 / ACC. Es parte del paquete libav-tools
.
Internet Explorer y Edge no son compatibles con algunos formatos MP4 que Chrome. Puede usar ffprobe
para ver el formato exacto de MP4. En mi caso tengo estos dos videos:
Input #0, mov,mp4,m4a,3gp,3g2,mj2, from ''a.mp4'':
Metadata:
major_brand : isom
minor_version : 512
compatible_brands: isomiso2avc1mp41
encoder : Lavf56.40.101
Duration: 00:00:12.10, start: 0.000000, bitrate: 287 kb/s
Stream #0:0(und): Video: h264 (High 4:4:4 Predictive) (avc1 / 0x31637661), yuv444p, 1000x1000 [SAR 1:1 DAR 1:1], 281 kb/s, 60 fps, 60 tbr, 15360 tbn, 120 tbc (default)
Metadata:
handler_name : VideoHandler
Input #0, mov,mp4,m4a,3gp,3g2,mj2, from ''b.mp4'':
Metadata:
major_brand : isom
minor_version : 512
compatible_brands: isomiso2avc1mp41
encoder : Lavf57.66.102
Duration: 00:00:33.83, start: 0.000000, bitrate: 505 kb/s
Stream #0:0(und): Video: h264 (Constrained Baseline) (avc1 / 0x31637661), yuv420p, 1280x680, 504 kb/s, 30 fps, 30 tbr, 15360 tbn, 60 tbc (default)
Metadata:
handler_name : VideoHandler
Ambos funcionan bien en Chrome, pero el primero falla en IE y Edge. El problema es que IE y Edge no son compatibles con yuv444 . Puede convertir a un espacio de colores shittier como este:
ffmpeg -i input.mp4 -pix_fmt yuv420p output.mp4
Por lo que he escuchado, el soporte de video es mínimo en el mejor de los casos.
Desde http://diveintohtml5.ep.io/video.html#what-works :
Al escribir estas líneas, este es el panorama del video HTML5:
Mozilla Firefox (3.5 y posterior) es compatible con el video Theora y el audio Vorbis en un contenedor Ogg. Firefox 4 también es compatible con WebM.
Opera (10.5 y posterior) es compatible con el video Theora y el audio Vorbis en un contenedor Ogg. Opera 10.60 también es compatible con WebM.
Google Chrome (3.0 y versiones posteriores) es compatible con el video Theora y el audio Vorbis en un contenedor Ogg. Google Chrome 6.0 también es compatible con WebM.
Safari en Mac y PC con Windows (3.0 y posterior) admitirán todo lo que QuickTime admita. En teoría, podría requerir que sus usuarios instalen complementos de QuickTime de terceros. En la práctica, pocos usuarios van a hacer eso. Así que te quedan los formatos que QuickTime admite "de fábrica". Esta es una lista larga, pero no incluye WebM, Theora, Vorbis o el contenedor Ogg. Sin embargo, QuickTime se envía con soporte para video H.264 (perfil principal) y audio AAC en un contenedor MP4.
Los teléfonos móviles como el iPhone de Apple y los teléfonos con Android de Google admiten video H.264 (perfil base) y audio AAC (perfil de "baja complejidad") en un contenedor MP4.
Adobe Flash (9.0.60.184 y versiones posteriores) admite video H.264 (todos los perfiles) y audio AAC (todos los perfiles) en un contenedor MP4.
Internet Explorer 9 admite todos los perfiles de video H.264 y audio AAC o MP3 en un contenedor MP4. También reproducirá video WebM si instala un códec de terceros, que no está instalado por defecto en ninguna versión de Windows. IE9 no es compatible con otros códecs de terceros (a diferencia de Safari, que reproducirá cualquier cosa que QuickTime pueda reproducir).
Internet Explorer 8 no tiene soporte de video HTML5 en absoluto, pero prácticamente todos los usuarios de Internet Explorer tendrán el complemento Adobe Flash. Más adelante en este capítulo, le mostraré cómo puede usar video HTML5, pero vuelva a utilizar Flash.
Además, debe tener en cuenta esta sección justo debajo en la misma página:
No existe una combinación única de contenedores y códecs que funcione en todos los navegadores HTML5.
Esto no es probable que cambie en el futuro cercano.
Para hacer que su video sea visible en todos estos dispositivos y plataformas, necesitará codificar su video más de una vez.
Pruebe lo siguiente y vea si funciona:
<video width="400" height="300" preload controls>
<source src="video.mp4" type="video/mp4" />
Your browser does not support the video tag.
</video>
Si alguna de estas respuestas anteriores no funciona, y está en un servidor apache, agregue lo siguiente a su archivo .htaccess:
//most of the common formats, add any that apply
AddType video/mp4 .mp4
AddType audio/mp4 .m4a
AddType video/mp4 .m4v
AddType video/ogg .ogv
AddType video/ogg .ogg
AddType video/webm .webm
Tuve un problema similar y al agregar esto solucioné todos mis problemas de reproducción.
Si todavía no funciona, esto es lo que sin duda puede ser una solución: codificar el mp4 con el formato de compresión H.264. Si lo codifica con formato mpeg4 o divx o de lo contrario no funcionará en IE9 y también puede bloquear Google Chrome. Para hacer eso, utilizo el freeware Any Video Converter. Pero podría hacerse con cualquier buena herramienta de video por ahí.
He estado probando todas las soluciones enumeradas aquí y he intentado con otras soluciones durante días, pero el problema es que mentí en la forma en que creé mi mp4. IE9 no decodifica otro formato que no sea H.264.
Espero que esto ayude, Jimmy
Sin JavaScript, la única forma en que podría jugar sin errores:
<!--[if lte IE 9]>
<!-- PUT HERE A FLASH PLAYER WITH video.flv -->
<![endif]-->
<!--[if gt IE 9]><!-->
<video controls class="video">
<source src="video.mp4" type="video/mp4">
<!-- REPEAT FLASH PLAYER CODE HERE -->
</video>
<!--<![endif]-->
Tengo un video de perfil base .mp4 que se reproduce en un servidor y no en otro.
La única diferencia es:
uno da un encabezado "Content-Length: ..."
el otro "Trasfer-Encoding: chunked".
Descubrí que Content-Length no es necesario, solo es importante, que NO debe haber ningún encabezado fragmentado. Esto se puede hacer desactivando la compresión (desinflar o gzip) para los archivos .mp4. Cómo se puede hacer esto es otro tema y otro tema: cómo desactivar la compresión Apache gzip para algunos archivos multimedia en el archivo .htaccess?
Puede haber otro problema con el servidor:
tiene que dar "Content-Type: video/mp4"
y NO "Content-Type: text/plain"
Terminó usando http://videojs.com/ para admitir todos los navegadores.
Pero para que el video funcione en IE9 y Chrome acabo de agregar el tipo de documento html5 y usé mp4:
<!DOCTYPE html>
<html>
<body>
<video src="video.mp4" width="400" height="300" preload controls>
</video>
</body>
</html>
Tuve que instalar IIS Media Services 4.1 desde la Galería de aplicaciones web de Windows.
para IE9 encontré que se necesitaba una metaetiqueta para configurar el modo
<meta http-equiv="X-UA-Compatible" content="IE=Edge"/>
<video width="400" height="300" preload controls>
<source src="movie.mp4" type="video/mp4" />
Your browser does not support the video tag
</video>
use ambos formatos, funciona bien en todos los navegadores:
<video width="640" height="360" controls>
<!-- MP4 must be first for iPad! -->
<source src="unbelievable.mp4" type="video/mp4" /><!-- Safari / iOS video -->
<source src="movie.ogg" type="video/ogg" /><!-- Firefox / Opera / Chrome10 -->
</video>