1

mjpeg をストリーミングする IP カメラがあります。私はもともと次のようにストリーミングしていました:

//JQUERY
    setInterval(function(){
    $("#overView").attr("src", "http://74.105.102.4:9999/cgi-bin/view/image?pro_3?"+new Date().getTime());
},1000);

//HTML
    <img id="overView" class="overView" width="710" height="400" style="" src="http://74.105.102.4:9999/cgi-bin/view/image?pro_3">

これは問題なく動作しますが、1 秒あたり 1 フレームしか得られません。これ以上絞ろうとすると、バッファを作成する必要があるため停止します。カメラ設定は最大 30fps です。SO より多くの FPS を達成するために、次のように jQuery を使用してバッファーを作成しようとしました。

//JQUERY
var mjpegImg = 'http://74.105.102.4:9999/cgi-bin/view/image?pro_3';

$('#start').attr('disabled', false).toggle(function() {
    $(this).text('Stop');

    $('#buffer').load(function() {
        $('#video').attr('src', this.src);
        this.src = mjpegImg + '?cache=' + new Date().getTime();
    }).trigger('load');
}, function() {
    $(this).text('Start');
    $('#buffer').unbind();
});​

//HTML
<img id="buffer" alt="" />
<img id="video" alt="" />
<button id="start" disabled="disabled">Start</button>​

この種の作品は、まだグリッチがあります。上記のスクリプトのフィドルは 次のとおりですhttp://jsfiddle.net/XgAWJ/2/ストリームの右上にタイムスタンプがカウントアップされているため、ストリームがどのように動いているかがわかります。

Is there anyway I can squeeze out more FPS using this method? 15-20fps would be ideal. The camera is hosted from a 15mbs upload line, that should suffice for mjpeg. I am not afraid of using PHP either if theres a way to utilize the ob_start(), I saw a solution using that here http://ben-collins.blogspot.com/2010/06/php-sending-motion-jpeg.html Not sure if that would work right, I don't see anywhere to set a time interval.

Thanks a bunch guys!

4

0 に答える 0