Header .m4v 格式的视频无法在 IE 11 中播放

Question

我遇到一个问题，IE11 无法播放我的 html5 视频标签视频。我已经尝试过 Chrome/Firefox 等其他浏览器，并且它工作得非常好。 IE11 甚至没有在控制台中给我一个错误，为什么它不播放视频并显示白色背景。我尝试了不同的格式，如 .m4v 和 mp4。视频采用h264编码和网络优化（我使用名为"Handbrake"的软件对视频进行编码”），分辨率为1920x1088。我还尝试将“”放在我的网站头部。

我的HTML代码

<video autoplay loop muted id="player">

</video>
 <img id="backfill-image" src="<?php bloginfo('template_url'); ?>/img/backgroundimage.jpg"> 
</div>

我的JavaScript

let myPlayer;
let backfill;

window.addEventListener('DOMContentLoaded', (event) => {

myPlayer = document.getElementById("player");
backfill = document.getElementById("backfill-image");

 myPlayer.onerror = function() {
   console.error(myPlayer.error);
   showPlaceholderImage();
};

// Example invalid source to throw an error
myPlayer.src = ""+templateUrl+"/img/myvideo.m4v";
 // Example valid source that doesn't throw an error 
 // myPlayer.src = "https://www.w3schools.com/tags/movie.mp4";


 function showPlaceholderImage() {
   myPlayer.style.display = "none";
    backfill.style.display = "block";
 }



});

Answer 1

我尝试用MP4格式的H264编码视频做了一个测试

看起来它在 IE 11 浏览器上运行良好。

这里是测试代码：

<!DOCTYPE html> 
<html> 
<head>
<meta http-equiv="X-UA-Compatible" content="IE=Edge"/>
</head>
<body> 
 <video width="400" autoplay>
   <source src="https://test-videos.co.uk/vids/bigbuckbunny/mp4/h264/1080/Big_Buck_Bunny_1080_10s_5MB.mp4" type="video/mp4"> 
   Your browser does not support HTML video.
 </video>
</body> 
</html>

在这里，您可以看到我已经使用 VLC 播放器验证了该视频具有 H264 编码器。

在 IE 11 浏览器中的输出：

从this site

下载的视频

Header .m4v 格式的视频无法在 IE 11 中播放

Header video in .m4v format doesn't play in IE 11

html

javascript

video

internet-explorer-11