With

With

关注
发信
关注(28)粉丝(399)

错误与Chrome的HTML5视频，使用RangeFilePathResult

本文介绍了错误与Chrome的HTML5视频，使用RangeFilePathResult的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

使用MVC3和的Flowplayer，我有一个设置为获得与下面的标记视频文件的视频播放器：

 ＆LT; D​​IV ID =视频＆GT;
    ＆LT; D​​IV ID =视频视口＆GT;
      ＆所述;！ - 的数据比率是一个十进制数再preseting视频的​​高度成比例地宽度 - ＆GT;
      ＆LT; D​​IV CLASS =的Flowplayer数据SWF =htt​​p://releases.flowplayer.org/5.1.1/flowplayer.swf
        数据比率=0.417数据引擎=HTML5数据的键盘=真正的数据native_ipad_fullscreen =真
        数据量=0.6＆GT;
        ＆lt;视频＆GT;
       ＆LT;！ - 默认的Flowplayer尝试使用HTML5视频，如果它不
       支持则Flash（9.0+）和MP4使用。 MP4就足够了
       完整的浏览器的支持，但提供的WebM和/或OGG给你
       对于HTML5视频这是preferred技术更广泛的支持。 - ＆GT;
     ＆LT;！ -  MP4提供了与Flash的帮助下完整的跨浏览器支持 - ＆GT;
     ＆lt;信源类型=视频/ MP4SRC =@ Url.Action（GetVideo，视频，新{ID = Model.WebMp4Video.Id}）/＆GT;
     ＆LT;！ -  WEBM给出了最新的Firefox，Chrome和Opera浏览器支持HTML5视频 - ＆GT;
      ＆lt;信源类型=视频/ W​​EBMSRC =@ Url.Action（GetVideo，视频，新{ID = Model.WebMVideo.Id}）/＆GT;
     ＆LT;！ -  OGG给出了旧版本的Firefox和Opera支持HTML5  - ＆GT;
      ＆lt;信源类型=视频/ OGVSRC =@ Url.Action（GetVideo，视频，新{ID = Model.OgvVideo.Id}）/＆GT;
      ＆LT; /视频＆GT;
      ＆LT; / DIV＆GT;
    ＆LT; / DIV＆GT;
  ＆LT; / DIV＆GT; ＆LT;！ -  /视频 - ＆GT;

在控制器我有这个方法返回的视频：

 公众的ActionResult GetVideo（字符串ID）{
                ...
        VAR CD =新System.Net.Mime.ContentDisposition {
        内嵌= FALSE
    };
    FileInfo的信息=新的FileInfo（路径）;
    Response.AppendHeader（内容处置，cd.ToString（））;
    返回新RangeFilePathResult（Mime类型，info.FullName，info.LastWriteTimeUtc，info.Length）;
 }

的一直在返回的部分反应挽救生命而这一切在Firefox和IE罚款，但在Chrome中我得到一个错误频繁：

and the player itself crashes, revealing the following error on the page:

I am still trying to get my head around partial responses, but could this be because the RangeFileResult sets a status code 206 with each partial response? Or is there anything else I am missing here?

Edit: If I debug through the RangeFileResult code and also inspect the Network tab in Chrome, I notice that the request to the controller method returns the partial response, with status pending, as soon as the code hits this line:

context.HttpContext.Response.Flush();

there seems to be a delay on this, sometimes more than 10 seconds, but when this is complete the status of the repsonse changes to 206. Often while the video is playing, though, the status is again changed to cancelled and this is when the

message appears on the video player.

Edit2: The repsonses I am getting are as follows (3 responses, first and third are cancelled, second has 206 status:

Request

URL: http://localhost:64729/Video/GetVideo/24
Method: GET
Status Code: 206 Partial Content

Request Headers

Accept:*/*
Accept-Charset:ISO-8859-1,utf-8;q=0.7,*;q=0.3
Accept-Encoding:identity;q=1, *;q=0
Accept-Language:en-US,en;q=0.8
Cache-Control:max-age=0
Connection:keep-alive
Cookie:.ASPXAUTH=BD5B9748E6985F5659B56289A5543C11CACBF1602AFFD5D4335453560988B870F2543269809401D13EE9F12EFBAC2D4CE0322B5F826871B9968B3D2986C01E35C536B28B5EC24E8E4F631D094B0DBEFF76DA84DA7CCC753E06C38C0FA36A858AC87548099BD23D4BE9B80434970A542489EC5E5F4543A9C98CA573F196DCBFE1B8CC18C10AE1AFEB0E4E899C6CA4DEFC59138E170954016DCB9C007FDC7C2B2950436E24AA5FF9C0888822626C9AE01C07A98F317A9499F0E9D5E61434F959E9;ASP.NET_SessionId=o112vzki5owvbptr4kudbdax
Host:localhost:64729
Range:bytes=0-
Referer:http://localhost:64729/Video/Index/3
User-Agent:Mozilla/5.0 (Windows NT 6.2) AppleWebKit/537.17 (KHTML, like Gecko) Chrome/24.0.1312.52 Safari/537.17

Response headers

Cache-Control:private, s-maxage=0
Connection:Close
Content-Length:7362920
Content-Range:bytes 0-7362919/7362920
Content-Type:video/mp4
Date:Tue, 15 Jan 2013 12:55:24 GMT
Server:ASP.NET Development Server/10.0.0.0
X-AspNet-Version:4.0.30319
X-AspNetMvc-Version:3.0

Request

URL: http://localhost:64729/Video/GetVideo/24
Method: GET
Status Code: 206 Partial Content

Request headers

Accept:*/*
Accept-Charset:ISO-8859-1,utf-8;q=0.7,*;q=0.3
Accept-Encoding:identity;q=1, *;q=0
Accept-Language:en-US,en;q=0.8
Connection:keep-alive
Cookie:.ASPXAUTH=BD5B9748E6985F5659B56289A5543C11CACBF1602AFFD5D4335453560988B870F2543269809401D13EE9F12EFBAC2D4CE0322B5F826871B9968B3D2986C01E35C536B28B5EC24E8E4F631D094B0DBEFF76DA84DA7CCC753E06C38C0FA36A858AC87548099BD23D4BE9B80434970A542489EC5E5F4543A9C98CA573F196DCBFE1B8CC18C10AE1AFEB0E4E899C6CA4DEFC59138E170954016DCB9C007FDC7C2B2950436E24AA5FF9C0888822626C9AE01C07A98F317A9499F0E9D5E61434F959E9;ASP.NET_SessionId=o112vzki5owvbptr4kudbdax
Host:localhost:64729
Range:bytes=7339303-
Referer:http://localhost:64729/Video/Index/3
User-Agent:Mozilla/5.0 (Windows NT 6.2) AppleWebKit/537.17 (KHTML, like Gecko) Chrome/24.0.1312.52 Safari/537.17

Response headers

Cache-Control:private, s-maxage=0
Connection:Close
Content-Length:23617
Content-Range:bytes 7339303-7362919/7362920
Content-Type:video/mp4
Date:Tue, 15 Jan 2013 12:55:24 GMT
Server:ASP.NET Development Server/10.0.0.0
X-AspNet-Version:4.0.30319
X-AspNetMvc-Version:3.0

Request

URL: http://localhost:64729/Video/GetVideo/24
Method: GET
Status Code: 206 Partial Content

Request headers

Accept:*/*
Accept-Charset:ISO-8859-1,utf-8;q=0.7,*;q=0.3
Accept-Encoding:identity;q=1, *;q=0
Accept-Language:en-US,en;q=0.8
Connection:keep-alive
Cookie:.ASPXAUTH=BD5B9748E6985F5659B56289A5543C11CACBF1602AFFD5D4335453560988B870F2543269809401D13EE9F12EFBAC2D4CE0322B5F826871B9968B3D2986C01E35C536B28B5EC24E8E4F631D094B0DBEFF76DA84DA7CCC753E06C38C0FA36A858AC87548099BD23D4BE9B80434970A542489EC5E5F4543A9C98CA573F196DCBFE1B8CC18C10AE1AFEB0E4E899C6CA4DEFC59138E170954016DCB9C007FDC7C2B2950436E24AA5FF9C0888822626C9AE01C07A98F317A9499F0E9D5E61434F959E9;ASP.NET_SessionId=o112vzki5owvbptr4kudbdax
Host:localhost:64729
Range:bytes=48-
Referer:http://localhost:64729/Video/Index/3
User-Agent:Mozilla/5.0 (Windows NT 6.2) AppleWebKit/537.17 (KHTML, like Gecko) Chrome/24.0.1312.52 Safari/537.17

Response headers

Cache-Control:private, s-maxage=0
Connection:Close
Content-Length:7362872
Content-Range:bytes 48-7362919/7362920
Content-Type:video/mp4
Date:Tue, 15 Jan 2013 12:55:24 GMT
Server:ASP.NET Development Server/10.0.0.0
X-AspNet-Version:4.0.30319
X-AspNetMvc-Version:3.0
解决方案

After some intensive testing (thank you for sample project) it looks like Chrome is having some issues with mp4 format.

In order to fix this situation it should be enough to move webm as the first format so Chrome will pick it up instead of mp4 (IE will skip to mp4 so it will work too):

<div id="video">
    <div id="video-viewport">
        <div class="flowplayer" data-swf="http://releases.flowplayer.org/5.1.1/flowplayer.swf" data-ratio="0.417" data-engine="html5" data-keyboard="true" data-native_ipad_fullscreen="true" data-volume="0.6">
            <video>
                <source type="video/webm" src="@Url.Action("GetVideo", "Video", new { id = Model.WebMVideo.Id })"/>
                <source type="video/ogv" src="@Url.Action("GetVideo", "Video", new { id = Model.OgvVideo.Id })"/>
                <source type="video/mp4" src="@Url.Action("GetVideo", "Video", new { id = Model.WebMp4Video.Id })"/>
            </video>
        </div>
    </div>
</div>

这篇关于错误与Chrome的HTML5视频，使用RangeFilePathResult的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！

08-16 06:20
Powered by LMLPHP ©2024 With 0.039098