开发者

Speeding up JPG "videos" pulled from a proxied web cam?

开发者 https://www.devze.com 2023-04-11 05:34 出处:网络
I have a snippet of javascript that is used to pull a series of jpg\'s from a webcam that is inside our network. Right now it\'s being reverse-proxied through Apache2 and embedded in our website.

I have a snippet of javascript that is used to pull a series of jpg's from a webcam that is inside our network. Right now it's being reverse-proxied through Apache2 and embedded in our website.

The thing is that to keep the display from "freezing" with timeouts I've had to adjust 开发者_JAVA技巧the consultant's snippet to 2 seconds. Someone suggested that it would be possible to cache some of the data better and speed it up with the proper javascript coding.

What I have now is:

<center>
<img id="video" src="../../img/unconnected.jpg" alt="video" height="480" width="640" />
</center>
<script type="text/javascript">// <![CDATA[
var sourceImage = "http://www.ourwebsite.com/video/link/image.cgi?v=jpg:640x480&seq=1";

function show() {
    document.getElementById("video").src = sourceImage + Math.random();

    setTimeout(show, 2000);
}

show();
// ]]></script>

Is there a way to do this?


It's not gorgeous but it takes care of the by-the-time-an-image-arrives-it's-expired problem.

Bonus points for writing an adaptive algorithm that adjusts the timing so that each image is fetched in advance but arrives a short while before it expires ;)

sourceImage = "http://www.yourwebsite.com/video/image.cgi?v=jpg:640x480&seq=1";

function show() {
        document.getElementById("video").src = sourceImage + Math.random();
}
document.getElementById("video").onload = show;
document.getElementById("video").onerror = show;

show();
0

精彩评论

暂无评论...
验证码 换一张
取 消