Node.js 中实现 HTTP 206 内容分片(3)

我们怎么来测试我们的代码呢?就像在介绍中提到的,部分正文最常用的场景是流和播放视频。所以我们创建了一个ID为mainPlayer并包含一个<source/>标签的<video/>。函数onLoad()将在mainPlayer预读取当前视频的元数据时被触发,这用于检查在URL中是否有数字参数,如果有,mainPlayer将跳到指定的时间点。

<!DOCTYPE html>
<html>
    <head>
        <script type="text/Javascript">
 
            function onLoad() {
                var sec = parseInt(document.location.search.substr(1));
               
                if (!isNaN(sec))
                    mainPlayer.currentTime = sec;
            }
       
        </script>
        <title>Partial Content Demonstration</title>
    </head>
    <body>
        <h3>Partial Content Demonstration</h3>
        <hr />
        <video
            autoplay="autoplay" controls="controls" onloadedmetadata="onLoad()">
            <source src="https://www.linuxidc.com/dota2/techies.mp4" />
        </video>
    </body>
</html>

现在我们把页面保存为"player.html"并和"https://www.linuxidc.com/dota2/techies.mp4"一起放在initFolder目录下。然后在浏览器中打开URL::8000/player.html

在Chrome中看起来像这样:

Node.js 中实现 HTTP 206 内容分片


 

因为在URL中没有任何参数,文件将从最开始出播放。

接下来就是有趣的部分了。让我们试着打开这个然后看看发生了什么::8000/player.html?60

Node.js 中实现 HTTP 206 内容分片

如果你按F12来打开Chrome的开发者工具,切换到网络标签页,然后点击查看最近一次日志的详细信息。你会发现范围的头信息(Range)被你的浏览器发送了:

Range:bytes=225084502-

很有趣,对吧?当函数onLoad()改变currentTime属性的时候,浏览器计算这部视频60秒处的字节位置。因为mainPlayer已经预加载了元数据,包括格式、比特率和其他基本信息,这个起始位置立刻就被得到了。之后,浏览器就可以下载并播放视频而不需要请求开头的60秒了。成功了! 

结论 

我们已经用Node.js来实现支持部分正文的HTTP服务器端了。我们也用HTML5页面测试了。但这只是一个开始。如果你对头部信息和工作流这些都已经理解透彻了,你可以试着用其他像ASP.NET MVC或者WCF服务这类框架来实现它。但是不要忘记启动任务管理器来查看CPU和内存的使用。像我们在之前讨论到的,服务器没有在单个响应中返回所用剩余的字节。要找到性能的平衡点将是一项重要的任务。

Node.js 的详细介绍请点这里
Node.js 的下载地址请点这里

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:http://www.heiqu.com/10693ed63df28ee701e8f603e0fe9796.html