Image refresh sync about webcamjs HOT 1 CLOSED

Hmm, well, you can improve the capture side of things, by triggering another snap() after each upload is complete. So instead of relying on timers on the client-side, the frequency of the image capture and upload is "as quickly as it can". The Webcam.upload() function actually accepts three arguments, the 3rd being a callback function that is fired when the upload is complete. So you can use that to trigger another snap(). Example:

Webcam.upload( data_uri, '/webcam/myscript.php', take_snapshot );

That will stream images to your server as quickly as it possibly can, without using timers. Now, on the server side, you should make sure to save your images to disk "atomically" (save temp file, then rename temp file over original), so when clients are viewing your images, you don't send any "half written" (i.e. corrupted) ones. Actually, I see you're using move_uploaded_file() -- I believe that is atomic.

Now, the problem really becomes how to "stream" the images to clients who are watching it. You could do the same sort of trick on the view side -- trigger an image reload after each load event is fired on the IMG object. Something like...

<img src="/webcam-img/webcam.jpg" onload="this.src='/webcam-img/webcam.jpg'+Math.random();"/>

This should work, but it will waste some bandwidth on the viewer's side, because the image will likely be able to refresh faster than you can upload it.

For something more like a true "video stream" I think you'd need Node.JS and Websockets.

Good luck!

from webcamjs.