Pat McKay asked 5 years ago
This might be a crazy thought but I’ll post anyway.
I’m thinking of capturing the img src stream and recording the html5 canvas. The idea being I then have some options such as using the canvas stream (mediaCapture) as the source for webRTC or to simply record the canvas and save for upload to a remote server.
So something like:
var ctx = document.getElementById(‘captureCanvas’).getContext(‘2d’);
var img = new Image();
img.onload = function() {
ctx.drawImage(img, 0, 0);
};
img.src = “http://192.x.x.x/stream”;
window.setInterval(“refreshCanvas()”, 10);
function refreshCanvas(){
ctx.drawImage(img, 0, 0);
};
Has anyone tried this? Any help would be really appreciated.
Thanks
Pat
Sara Santos Staff answered 5 years ago
Hi Pat.
Thanks for sharing your idea.
Your idea seems feasible. However, I’m not familiar with those subjects, so I don’t thing I can help much in this matter.
I’m sorry that I can’t help much.
If anyone knows something about this, please share.
Regards,
Sara
Pat McKay answered 5 years ago
Thanks Sara,
I’ve done the html part and now need to get the hardware. I’m purchasing the esp32 board and camera module, FTDI and female-female cables as you indicate on the site. But unsure where to get the right usb for the ftdi. Can you point me in the right direction for the usb connector? Sorry to ask such a basic questions but as a html programmer I’m really starting from scratch but willing to learn.
Thanks
Pat
Sara Santos Staff answered 5 years ago
Hi again.
If you bought an FTDI programmer like ours:https://makeradvisor.com/tools/ftdi-programmer-board/, you need a mini USB to USB cable. Like this one, for example: https://www.amazon.com/AmazonBasics-USB-2-0-Cable-Male/dp/B00NH11N5A
Regards,
Sara