Hello all, I am interested in working with a live stream video from youtube in p5.js. Is there a specific way to access the video content? I have only managed to embed the video using Javascript for now, but I would want to access specifically the video or the frames to do some object detection. Is this possible?
Hope this is solvable 
1 Like
Hello @Andrew387!
In theory, if you could get the raw video URL (no iframe embed), it should be possible. In practice, I would find it very surprising if YouTube would allow you to embed that raw video file into your p5.js sketch. YouTube is making its money, showing ads, and driving traffic to their website. It would be disastrous if users could upload and host videos on YouTube for free and then embed them on their own websites, circumventing ads, and hide away the YouTube brand.
There’s also the security aspect, that works against your idea. Browsers restrict what you can do with the content on other websites (cross-domain). You can embed an iframe (YouTube video) in your sketch, sure, but you can’t access the content of that iframe from JavaScript. If you could, it would be possible for you to exploit that fact and, for example, steal the user’s YouTube session (and get access to their data).
So, no, I don’t think this is possible. At least not solely using p5.js on the client-side. You could possibly proxy the video somehow, though. Set up a server, capture the video-stream, and relay that to your p5.js sketch. That’s more than a little shady, though, and not something I would recommend.
1 Like
Another hacky solution would be to inject a JavaScript on youtube.com using a bookmarklet, Greasemonkey or similar. You could then manipulate the page content as you see fit, include p5.js, and work from there.
That goes outside the scope of p5.js, though. Something I’ll let you research on your own. 
2 Likes