I currently have a setup where I use a Logitech Brio 4k webcam to stream video using my PC to twitch in order to view the feed remotely as well as share it easily. I used to have Logitech Pro 9000 hooked up to my pi so I could have a video feed for octoprint when manually moving axis' around, as well as giving smartphone controller apps and slack/discord bots the ability to share a pic/vid of the print in progress. the 9k died (i think, it was from 2008 gen1 rip webcam that could), as a result I was conflicted with deciding between "do I buy a rpi cam just for eagle eyes" OR is there some way I could tell Octo to instead tell the end user to load up the twitch video feed.
My original thought was to simply modify the html file that the octoprint hands out when you access it, and simply edit the tab for the webcam and change the source to instead embed a twitch window in its place. Browser based clients would then just access the modified page and the rpi would have a module in the background that wouldn't be under any load but still running. Just like the re-theming plugins.
Final Result:
What I want to achieve, is the ability to remove an entire load bearing module off of the raspberry pi in order to optimize performance, quality, and ease of use for other features. With the pi not running a module, that frees up resources. With a much more powerful hardware setup you can stream a higher quality video feed to a web server that greatly outmatches the performance power of a rpi. Web server at your disposal means the ability to safely share the video feed without directly exposing your private network details, and the ability to integrate other web server features such as AWS (AI image analysis) & use of other various storage/streaming services.
Why are you re-inventing the wheel:
"Just install octo on your windows unit streaming the video then, that way you just capture the video source from the octo browser to feed into your streaming client."
-No
I don't think this project is all that difficult per say, it might be out of reach for my grasp of programming but that just means I'll have to work for it.
It is HIGHLY recommended that you not connect your OctoPi / OctoPrint directly to the outside world (@OutsourcedGuru help me out with a link here).
That being said, it sounds like you don't really want to do that anyway as the video feed you do want to provide isn't being generated by the RPi. It sounds like what you may want is for OctoPrint to tell the system hosting the video source that a print is in progress. This can be done in a variety of ways. I think there is even a Twitch plugin.
Security risks aside, as that's a whole rabbit hole that I'm not really trying to even get close to, I just want to be able to tell Octoprint "Hey, instead of using the USB webcam for your video feed, can you instead just load up this streaming video link instead?"
People seem to be getting confused on what i'm trying to accomplish.
I'm not trying to stream the Octoprint feed out.
I know of the various twitch/youtube octo plugins that allow you to turn your raspi into a streaming unit to stream it OUT to twitch/youtube.
This is NOT what i'm trying to achieve.
Yeah, the current implementation of OctoPrint is utilizing an img tag, so unless you are able to provide an mjpg stream it will require a plugin, or some other change to core OctoPrint in order to change that img tag into either a video tag or iframe. There has been several discussions in the community and in the OctoPrint issue tracker that discuss this as well.
Thanks! This is EXACTLY what i'm looking for, i'll start digging through the issue tracker, I looked earlier before submitting this and didn't see any posts that aligned with my request. It might be lumped in with another feature.
It's funny because the Twitch/Youtube streaming plugins actually have an embedded player setup already, so half way there!
Something like this added to a plugin would accomplish what you are trying to do. You can actually open chrome's developer console and paste this in and hit enter and it will load a 10 minute short. In theory you should be able to use an h264 url as well.
$('#webcam_image').replaceWith('<video class="row-fluid" controls="" autoplay="autoplay"><source src="http://distribution.bbb3d.renderfarming.net/video/mp4/bbb_sunflower_1080p_60fps_normal.mp4" type="video/mp4"><p>Your browser does not support H.264/MP4.</p></video>');
As suggested, you want to be careful opening up your OctoPrint instance on the Internet. Searching the forum here for "safe remote access" should provide some pointers.
A good way of offloading the webcam features are to create a separate dedicated webcam server for this purpose.
At least one user on here was targeted with what appears to be a distributed denial-of-service because he opened a port to the Internet. So you want to be careful doing that, if that's what you had in mind.
$('#webcam_container').replaceWith('<video class="row-fluid" controls="controls" autoplay="autoplay"><source src="http://distribution.bbb3d.renderfarming.net/video/mp4/bbb_sunflower_1080p_60fps_normal.mp4" type="video/mp4"><p>Your browser does not support H.264/MP4.</p></video>');
$('#webcam_container').replaceWith('<video class="row-fluid" controls="controls" autoplay="autoplay"><source src="https://player.twitch.tv/?channel=atticakes&muted=true" type="video/mp4"><p>Your browser does not support H.264/MP4.</p></video>');
The caveat to this approach is that if the browser is minimized the "stream loading" div gets initiated and you have to re-run the code above. This could probably be handled in code somehow by overriding the function being called to enable/disable the webcam stream as that is taking place to free up resources on the browser if I'm not mistaken.
Definitely a step in the right direction.
Yeah the process is still running, and if you disable webcam it disables the ifram the video is nested in sadly. So the toggle webcam option would need to be modified for when set to off to not disable the iframe.
Here's a quick plugin for you that you should be able to install and accomplish what you're after. Note, it will break keyboard control on mouseover of the camera, but I've been using OctoPrint for a real long time now and have never used that feature. Update the webcam stream url in OctoPrint's settings to your twitch stream url you linked above and then install the plugin using the url below in plugin manager.
