javascript - html 视频的当前播放位置不会改变

标签 javascript html video

我有一个位于 mvc3 razor View 上的 html5 视频播放器。我的视频播放得很好,但奇怪的是我似乎无法使用 video 元素的 slider 控件更改播放位置(时间)。我用鼠标改变播放位置,但它只是从离开的地方继续。

我认为我应该有一些额外的 javascript 来处理视频搜索,但这只是无稽之谈,不是吗?我在这里缺少什么?

下面是我的 html。

<video id="presentedFile" width="780" height="510" controls>
    <source src="/Folder/GetVideoStream?videoId=3" type="video/mp4">
</video>

编辑:我发现当我将源作为我的 mvc Controller 的操作链接时,就会出现此问题。如果我直接从文件中获取文件,它就会按我的预期工作。所以我的 Controller 肯定有问题。

public FileResult GetVideoStream( string videoId )
{
    /// create my stream
    return File(myStream, MimeMapping.GetMimeMapping(myVideo));
}

最佳答案

this 开头回答,我设法克服了这个问题。认为是响应中缺少 http header accept-rangescontent-range 导致视频无法拖动。

只是为了简化上面链接中提到的解决方案,他们使用了 http 处理程序来解决问题。但我想声明的是,使用实现 http 处理程序并不是所需解决方案的一部分。解决方案是您必须将必要的 header 添加到响应中,如下所示:

public FileResult GetVideoStream( string videoId )
{
    /// create the stream

    /// if request contains range details
    if ( !String.IsNullOrEmpty(HttpContext.Request.ServerVariables["HTTP_RANGE"]) )
        SetHeadersForRangedRequests(stream, HttpContext);

    return File(myStream, MimeMapping.GetMimeMapping(myVideo));
}

以下方法引用自上面的链接,我刚刚删除了 StreamReader 周围的 using,因为我需要在操作完成后使流保持打开状态。

void SetHeadersForRangedRequests ( Stream stream, HttpContextBase context )
{
    long size, start, end, length, fp = 0;
    StreamReader reader = new StreamReader(stream);

    size = reader.BaseStream.Length;
    start = 0;
    end = size - 1;
    length = size;

    context.Response.AddHeader("Accept-Ranges", "0-" + size);

    if ( !String.IsNullOrEmpty(context.Request.ServerVariables["HTTP_RANGE"]) )
    {
        long anotherStart = start;
        long anotherEnd = end;
        string[] arr_split = context.Request.ServerVariables["HTTP_RANGE"].Split(new char[] { Convert.ToChar("=") });
        string range = arr_split[1];

        // Make sure the client hasn't sent us a multibyte range
        if ( range.IndexOf(",") > -1 )
        {
            // (?) Shoud this be issued here, or should the first
            // range be used? Or should the header be ignored and
            // we output the whole content?
            context.Response.AddHeader("Content-Range", "bytes " + start + "-" + end + "/" + size);
            throw new HttpException(416, "Requested Range Not Satisfiable");
        }

        // If the range starts with an '-' we start from the beginning
        // If not, we forward the file pointer
        // And make sure to get the end byte if spesified
        if ( range.StartsWith("-") )
        {
            // The n-number of the last bytes is requested
            anotherStart = size - Convert.ToInt64(range.Substring(1));
        }
        else
        {
            arr_split = range.Split(new char[] { Convert.ToChar("-") });
            anotherStart = Convert.ToInt64(arr_split[0]);
            long temp = 0;
            anotherEnd = ( arr_split.Length > 1 && Int64.TryParse(arr_split[1].ToString(), out temp) ) ? Convert.ToInt64(arr_split[1]) : size;
        }
        /* Check the range and make sure it's treated according to the specs.
            * http://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html
            */
        // End bytes can not be larger than $end.
        anotherEnd = ( anotherEnd > end ) ? end : anotherEnd;
        // Validate the requested range and return an error if it's not correct.
        if ( anotherStart > anotherEnd || anotherStart > size - 1 || anotherEnd >= size )
        {

            context.Response.AddHeader("Content-Range", "bytes " + start + "-" + end + "/" + size);
            throw new HttpException(416, "Requested Range Not Satisfiable");
        }
        start = anotherStart;
        end = anotherEnd;

        length = end - start + 1; // Calculate new content length
        fp = reader.BaseStream.Seek(start, SeekOrigin.Begin);
        context.Response.StatusCode = 206;
    }

    // Notify the client the byte range we'll be outputting
    context.Response.AddHeader("Content-Range", "bytes " + start + "-" + end + "/" + size);
    context.Response.AddHeader("Content-Length", length.ToString());
} 

关于javascript - html 视频的当前播放位置不会改变,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23910806/

相关文章:

HTML5 视频 - 暂停加载/部分加载

javascript - 是否可以从 JavaScript 中的对象数组中获取特定属性?

javascript - 如何使用 Nodejs 将文件上传到 amazon Glacier?

javascript - 使用导航菜单显示隐藏 html 代码/内容

jquery - 使用Giggle JS在Firefox中无法进行音频/视频通话

ios - 无法在 UIWebView 中播放 Youtube 视频(iOS、Swift)

javascript - 为动态生成的 div 多次调用单击操作

java - 从 Rhino 脚本中访问 Java 特权操作

javascript - 单击时填充载波文本区域的调用函数

javascript - HTML/CSS : Set width & height of object in a div?