HTML5 视频循环在 Chrome 上不起作用（Sitefinity CMS）答案

【问题标题】：HTML5 video loop doesn't work on Chrome (Sitefinity CMS)HTML5 视频循环在 Chrome 上不起作用（Sitefinity CMS）
【发布时间】：2014-07-23 08:01:25
【问题描述】：

我遇到了一个特殊的问题，即我无法在本地开发环境 (ASP.NET + IIS7) 上将 HTML5 视频循环。视频自动播放就好了。我的代码如下所示：

<video id="frontpage-video" autoplay loop>
  <source src="http://test-site:8084/video_mp4.mp4" type="video/mp4">
  <source src="http://test-site:8084/video_webm.webm" type="video/webm">
</video>

如果我将视频源 URL 更改为一些公开可用的 URL（例如到 Dropbox），循环就可以正常工作。这不是一个大问题，因为我认为（希望）一旦我的网站上线并且视频公开可用，它就会起作用。

我的问题是：如果我的视频不公开，我可以制作视频循环吗？

我无法通过谷歌搜索找到类似的问题。会不会是某种阻止视频循环播放的 IIS 设置？

更新 1： 问题似乎只出现在 Chrome 中。 Firefox 和 IE 运行良好。

更新 2： 视频似乎会在最后停止，但对于 element.ended 永远不会返回 true

> document.getElementById('frontpage-video').duration;
< 16.12

> document.getElementById('frontpage-video').currentTime;
< 16.12

> document.getElementById('frontpage-video').ended;
< false

更新 3：问题出在 IIS 或 Telerik 的 Sitefinity CMS。服务器应该发送“206 Partial Content”状态，但它会发送 200 OK。是否有任何 Sitefinity 用户遇到此问题并知道如何解决？

【问题讨论】：

能否粘贴运行时看到的内容： curl -I -H "Range: bytes=0-200" test-site:8084/video_mp4.mp4
HTTP/1.1 200 OK Cache-Control: no-cache Pragma: no-cache Content-Length: 1492371 Content-Type: video/mp4 Expires: -1 Server: Microsoft-IIS/8.5 content-处置：内联；文件名=video_mp4.mp4 X-AspNet-版本：4.0.30319 X-Powered-By：ASP.NET 日期：2014 年 7 月 25 日星期五 12:51:47 GMT

标签： html iis webkit html5-video sitefinity

【解决方案1】：

您的问题似乎是您没有使用 HTTP 字节服务。您的服务器正在发送“200 OK”响应，但它应该发送“206 Partial Content”以及这些标头：

Accept-Ranges:bytes
Content-Range:bytes 0-1492370/1492371

字节范围请求允许浏览器仅请求它需要的文件部分。所以如果你四处寻找，它可以直接跳到那个点。

使用常规的 200 响应，您通常至少会发现您无法在视频中搜索。但是，根据您的视频文件的编码方式以及元数据在文件中的位置，您可能会看到更多问题。有时该文件甚至可能根本无法播放。 WebM 通常比 MP4 更健壮，MP4 无处不在。

我不太了解 IIS，无法告诉您如何配置它，但请尝试从这里开始： http://blogs.visigo.com/chriscoulson/easy-handling-of-http-range-requests-in-asp-net/

【讨论】：

有趣。我也不是 IIS 专家，所以我想得到一些帮助。谢谢。
您是否正在使用 ASP 自己编写实际的视频文件服务代码？或者 IIS 正在处理这个问题？如果您正在这样做，我链接到的那篇文章应该会有所帮助。
我不完全确定它是由 IIS 还是 Sitefinity CMS 处理的。
这个答案是否值得赏金，因为它告诉了我问题的原因。谢谢！
谢谢，亨利。祝你好运，我希望你一切顺利。

【解决方案2】：

如果视频本身没有提供 HTTP 206 Partial Content 响应而是 200 OK，则 Chrome/Opera 无法循环播放视频。

问题在于 Sitefinity 的存储提供商不支持部分内容（7.0 版）。他们计划在未来实施这一点。

目前可能的解决方法是使用外部 blob 存储提供程序，例如 Azure、Amazon 或 ExternalFileSystem (ExternalFileSystemStorageProvider)。

我从 Sitefinity 的支持团队获得了此信息。

【讨论】：

【解决方案3】：

可能是 IIS 中的 MIME 类型未针对 MP4 设置。打开 IIS，并找到您的默认页面。您将在右窗格中看到 MIME 类型。单击Add 并输入field1=.mp4 和field2=video/mp4。重新启动 IIS。希望这可能有效。

【讨论】：

我的 MIME 类型设置正确。视频第一次按应有的方式运行。问题只是循环播放视频。
我已经设置了 Mime 类型 - 它可以播放，但我无法跳过。

【解决方案4】：

在您的问题中，您的video-element 没有id frontpage-video（但我猜它是复制粘贴？）
检查您的 webkit 浏览器中是否调用了 video end event，如果是，请重新启动您的视频。

<script type='text/javascript'>
document.getElementById('frontpage-video').addEventListener('ended',myHandler,false);
function myHandler(e) {
    if(!e) { e = window.event; }
    //restart your video
}

【讨论】：

我在发布此问题后添加了 id，但它就在那里。如前所述，视频永远不会进入“结束”事件，因此脚本不会做任何事情。