Show USB Camera Steam in Perspective Video Player

Hi

I’m trying to show live video from a USB camera in Perspective.

I have setup VNC to stream data to HTTP and configured a html container folder for the video following this guide:

https://ipcamtalk.com/threads/how-to-use-vlc-to-transcode-ip-video-to-an-html5-compatible-format.1371/

I can open the html URL I created from Google Chrome and see “live data” (there a still a ~5 second delay that I need to look into) from any PC on our network – Great!

Now the last step is display the stream in Perspective. I have tried loading the URL from the Video Player control, but it complains about “Cross-Origin Read Blocking (CORB)”. If I deploy the html page via the Web Dev Module in perspective then the CORB errors goes away, but it still gives me a “File not Valid” error (but no error in the console).

I have tried loading the video via a “Inline frame” in Perspective, and that works well (except for scaling of the video, which makes it hard to view).

I think next step is to try to add CORS headers to the webpage hosting the html page, but I’m not 100% that the correct path forward?

Has anyone successfully done this before?

Do you have TLS/SSL enabled? Chromium auto “upgrades” mixed content in which case you would need to be able to serve your video with https.

Thanks for the reply - yes we do have both http and https configured, but I’m testing using http at the moment, as I was running into the problem that you described when using https.

Just checking, but you are streaming from the gateway, and getting the file not found in a perspective session, not in designer right?

I’m getting a “File not valid” error in the browsers as well(the documentation mentions that a few codec’s are not loaded in the designer).

The stream is not on the same box. but I tried to move the html file to the gateway, but the video stream still comes from another server.

here is the html file I moved to the Gateway:

<html><head></head><body><video id="video" src="http://192.168.50.50:8181/stream" type="video/ogg; codecs=theora" autoplay="autoplay">
</video>
</body></html>

How does the html file come into play? I think hosting a page on the gateway that receives the stream from VLC on the other server would work, I haven’t tried that though.

You could use VLC on the gateway to re-broadcast your HTTP stream coming from the other server, then use that URL in the video player component.

Edit:
Actually i don’t think its necessary to re-stream, what if you just use (http://192.168.50.50:8181/stream) as the source for your player?`

If one of the forum big brains has more info or corrections, i hope they chime in.

Using http://192.168.50.50:8181/stream gives the same result (no error message other than “File not valid”).

I also setup MPEG-DASH and HLS, and it works in browser, but not in Perspective.

Could be a permissions issue. You are using your credentials by opening a browser, but unless you changed it ignition is using the service account.

Good idea, but the streaming server is running apache without any security… As far as I understand it, then it also the browser that will open the steam in perspective, but I might be wrong.

If i understand your setup correctly, i think you may be over complicating things. All you need is VLC to broadcast your stream as a HTTP URL, then use that url for the video players source. The only two scenarios i know where it would work in a browser but not perspective (assuming you have your streaming setup correctly) are incorrect permissions, and having TLS/SSH enabled. I never could get it to work with TLS/SSH enabled.

Yes you are right, I think I overcomplicated it a bit. I finally found a solution! I found a program called “ustreamer”, it streams 4k with almost no lag (less than 1 second), and it works without any issues with Perspective.

Does it work with TLS/SSH enabled, i never did get that figured out.

I just requested a SSL certificate from our IT department for my camera, I’ll update this thread when I get it tested :).

I just got the SSL certificate, and everthing works over https as well. I had to proxy though nginx as ustreamer does not support https by itself, but that was pretty simple to setup…