通过node.js与HTML 5进行视频流式传输 [英] Video streaming with HTML 5 via node.js

查看:1638
本文介绍了通过node.js与HTML 5进行视频流式传输的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我试图建立一个网络服务器,使用node.js支持将流式视频转换为HTML5视频标签。以下是我的代码:

  var range = request.headers.range; 
var total = file.length;

var parts = range.replace(/ bytes = /,).split( - );
var partialstart = parts [0];
var partialend = parts [1];

var start = parseInt(partialstart,10);
var end = partialend? parseInt(partialend,10):total-1;

var chunksize =(end-start)+1;

response.writeHead(206,{Content-Range:bytes+ start + - + end +/+ total,Accept-Ranges:bytes, Content-Length:chunksize,Content-Type:type});
response.end(file);

其中request代表http请求,type代表application / ogg或video / ogg(我已经试过)和文件是从文件系统读取的.ogv文件。这里是响应标头:

 内容范围字节0-14270463 / 14270464 
接受范围字节
内容长度14270464
连接保持活动
Content-Type视频/ ogg

我已经检查了响应头文件,并且此代码似乎工作正常,但存在一些问题:


  1. 视频似乎加载非常缓慢,因为在本地网络上。根据我所知道的使用萤火虫检测响应,该文件似乎以大约150 kb /秒的速度传输。

  2. 视频根本不播放。即使我等待所有内容加载,HTML 5视频标签在firefox中只显示一个大的x而不是电影。





谢谢!

Chris

解决方案

我可以通过nodejs论坛的帮助获得此功能:



http://groups.google.com/group / nodejs / browse_thread / thread / 8339e0dc825c057f / 822b2dd48f36e890



Google网上论坛主题:


谷歌浏览器首先发出一个范围为0-1024
的请求,然后请求范围1024-。



response.end(file.slice(start,chunksize),binary);

然后:


我可以通过设置
the 连接标题关闭


然后:


看起来你错误地计算了content-length:

var chunksize =(end-start)+1;



如果start为0且end为1,则在您的情况下,chunksize为2,并且它应该为
为1。


I'm trying to set up a web server that will support streaming video to an HTML5 video tag using node.js. Here's my code so far:

var range = request.headers.range;
var total = file.length;

var parts = range.replace(/bytes=/, "").split("-");
var partialstart = parts[0];
var partialend = parts[1];

var start = parseInt(partialstart, 10);
var end = partialend ? parseInt(partialend, 10) : total-1;

var chunksize = (end-start)+1;

response.writeHead(206, { "Content-Range": "bytes " + start + "-" + end + "/" + total, "Accept-Ranges": "bytes", "Content-Length": chunksize, "Content-Type": type });
response.end(file);

Where "request" represents the http request, type is either "application/ogg" or "video/ogg" (I've tried both) and "file" is the .ogv file that's been read from the file system. Here are the response headers:

Content-Range   bytes 0-14270463/14270464
Accept-Ranges   bytes
Content-Length   14270464
Connection     keep-alive
Content-Type     video/ogg

I've examined the response headers and this code appears to be working fine, but there are a couple of problems:

  1. The video appears to load very slowly for being on a local network. From what I can tell examining the response using firebug, the file appears to be streamed in at about 150 kb/sec.
  2. The video doesn't play at all. Even if I wait for the whole thing to load, the HTML 5 video tag just shows a big "x" instead of a movie in firefox.

Does anyone have any ideas as to what I can do to get video streaming working via node.js?

Thanks!
Chris

解决方案

I was able to get this to work with some help from the nodejs forums:

http://groups.google.com/group/nodejs/browse_thread/thread/8339e0dc825c057f/822b2dd48f36e890

Highlights from the Google Groups thread:

Google chrome is known to first make a request with the range 0-1024 and then request the range "1024-".

response.end(file.slice(start, chunksize), "binary");

Then:

I was able to get the video to play no problems in firefox by setting the "connection" header to "close"

Then:

Seems that you are incorrectly computing the content-length:

var chunksize = (end-start)+1;

If start is 0 and end is 1, in your case chunksize is 2, and it should be 1.

这篇关于通过node.js与HTML 5进行视频流式传输的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆