流媒体技术世界——分享技术,增值服务
如何为直播流创建一个截帧图?
Flussonic Media Server 有两种机制为直播流生成截帧图:

1、自动截图:自动为接收到的每一个关键帧生成一个截帧图。如果视频流的关键帧间隔是3秒,那么在一分钟内,Flussonic 会为你生成20张截帧图。如果你的关键帧间隔是6秒,你会得到10张截帧图。

2、按需截图:根据需要(比如http请求)为直播流内容生成一个截帧图(可以是实时的当前最新内容的截图,也可以是历史NVR内容上的截图)。

首先你要安装扩展包flussonic-ffmpeg,然后重启flussonic media serer,如下:
apt-get -y install flussonic-ffmpeg
/etc/init.d/flussonic restart
	

接下来,我们分别介绍如何在Flussonic Media server中配置它们,如下:

一、自动截图


然后,你需要为直播流添加thumbnails指令,如下:
stream ort {
url udp://239.255.0.100:1234;
thumbnails;
}
    
这时,你会在Linux系统控制台上看到一个叫做flussonic-thumbnailer的处理进程,并可以观察到它的运行非常占用系统资源,但这没有办法,对视频处理得到截帧图确实是这样的。

另外,考虑到很多摄像头本身就可以提供截图,因此你可以为直播流设置一个获取截图的url,这样就不用flussonic去解开视频有生成一遍截图了,如下:
stream cam0 {
url rtsp://10.0.4.3:554/h264;
thumbnails url=http://10.0.4.3/cgi-bin/snapshot.cgi
}
	
在上面的例子中,flussonic media server可以通过http://10.0.4.3/cgi-bin/snapshot.cgi获取截图。你可以咨询摄像头厂家获取这个url。

你可以用下面的URL得到当前直播流最新的一个截帧图,如下:
http://flussonic:8080/ort/preview.jpg
或
http://flussonic:8080/ort/preview.mjpeg  // 最好不用使用这个
	
注意: 在没有为这个直播流启用DVR功能时,这些截图是保存在内存中的,并且只保留最新的,因此你也只能通过上面的url获得最新的截图。但如果你为这个直播流启用了DVR功能,那么这些截帧图全部都会被自动保存在磁盘上。

接下来,我们看看如何从磁盘上获取这些截帧图:

首先你需要明确一个时间段,也就是你说你要获取的是哪个时间范围的截帧图,假设现在是2017年4月21日21:10分,你要获得过去1个小时内的截图,首先得到过去1小时2017年4月21日20:10分的Unix时间戳1492776600,然后调用下面的http url:
curl 'http://flussonic:8080/myStream/recording_status.json?from=1492776600&duration=3600'
	
调用这个http接口后,你会得到下面的响应:
[{"stream":"myStream","ranges":[{"duration":3642,"from":1492776599}],"brief_thumbnails":[1492776599,1492776605,1492776617,1492776629,1492776641,1492776653,
1492776665,1492776677,1492776689,1492776701,1492776713,1492776725,1492776737,1492776749,1492776761,1492776773,1492776785,1492776797,1492776809,1492776821,
1492776833,1492776845,
....]}]
	
看到没有,你会得到在这一个小时内的所有截帧图的时间戳(注意:时间长度不一定是3600秒,可能多一些,可能少一些,原因是截帧图是从关键帧开始的)。然后你需要将时间戳转换为年月日时分秒的格式,例如1492776605是2017年4月21日20点10分5秒 ,然后你可以按按下面的URL获取到这个截帧图:
http://flussonic:8080/myStream/2017/04/21/20/10/05.jpg
	

二、按需截图


很明显,自动截图对资源的消耗太大,有时候我们仅仅在需要的时候生成截帧图,首先你不能在直播流的配置中使用thumbnails指令。然后请使用下面格式的请求来临时请求生成截图:
http://flussonic:8080/myStream/2017/04/21/12/10/05-preview.jpg
    
注意:这个方式只能配合DVR来使用,也就是说必须先启用DVR。这个方式还有一个显著的缺点,在调用这个http请求时,flussonic media server会临时增大对资源的占用,由于请求的发起是由外部控制的,因此这样会导致系统压力变得不可预知。

所以,我们不太推荐这个方式。如果确实是对截图有临时性的需求,请继续往下看,可以采取一个变通的方式:

--------------------------------------------------------------------------------------------------------------------------

对直播流进行截图对CPU和磁盘都有很大的资源占用,有什么办法可以解决这个问题?flussonic media server提供了一个变通的方式,这个变通方式生成的不是一个图片,而是只有一个关键帧的视频文件。


下面,我们来介绍这个变通方式:
<video src="http://flussonic:8080/myStream/preview.mp4" style="width: 640px; height: 480px;" autoplay />
	
注意:采用这种变通方式后,你无需在直播流的配置中使用thumbnails指令了。你可以用PC上的浏览器访问上面的页面,你会得到这个视频流最新截图(视频)。

在手机端如何展现这个截帧图呢?请使用下面的代码:
<video id="previewSource" src="http://flussonic:8080/clock/preview.mp4" style="display: none;" autoplay/></video>
<canvas id="preview" style="width: 640px; height: 480px;"></canvas>
<script>
  var previewSource = document.getElementById("previewSource");
  var preview = document.getElementById("preview");

  previewSource.addEventListener("loadeddata", function() {
    var context = preview.getContext("2d");
    var w = previewSource.videoWidth;
    var h = previewSource.videoHeight;

    preview.width = w;
    preview.height = h;

    context.fillRect(0, 0, w, h);
    context.drawImage(previewSource, 0, 0, w, h);
  });
</script>
	

下面的例子是从DVR中获取这个只有一个关键帧的视频(当然前提是你必须为这个直播流启用DVR):
http://flussonic:8080/clock/2017/04/21/12/10/05-preview.mp4
	
这要求你指定一个年月日时分秒,然后组成这个http url。Flussonic Media Server收到这个请求后在DVR中找到对应的切片,然后生成视频文件,如果这个视频的开始时间和上面的URL不符,Flussonic Media Server将会用302重定向机制返回一个新的url,如下:
$ curl -v http://localhost:8080/clock/2017/04/21/12/08/50-preview.mp4
*   Trying ::1...
* Connected to localhost (::1) port 8080 (#0)
> GET /clock/2017/04/21/12/08/50-preview.mp4 HTTP/1.1
> Host: localhost:8080
> User-Agent: curl/7.43.0
> Accept: */*
> 
< HTTP/1.1 302 Found
< Connection: keep-alive
< Date: Fri, 21 Apr 2017 14:03:15 GMT
< Content-Length: 70
< Server: Flussonic
< X-Route-Time: 664
< X-Run-Time: 13522
< Access-Control-Allow-Origin: *
< Access-Control-Allow-Methods: GET, OPTIONS
< Access-Control-Expose-Headers: Server, range, X-Run-Time, Content-Length
< Access-Control-Allow-Headers: x-vsaas-session, origin, authorization, accept, range
< Location: http://localhost:8080/clock/2017/04/21/12/10/05-preview.mp4
< 
Location: http://localhost:8080/clock/2017/04/21/12/10/05-preview.mp4
	
匿名用户
评论

我们的地址


北京市朝阳区管庄西里建基商务楼423室


邮编:100024

关于我们


北京联方信科信息技术有限责任公司


官网:www.ttstream.com

联系我们


王经理:phone


柳经理:phone

京ICP备14033868号-2