Streaming network camera into browser in a Angular Project

Question

Can Please any one help with my requirement I have an camera connected in network simply an IP Camera I need to display it in the browser.Simply live feed to the browser

Some Inferences..

Can I directly use rtsp://admin:Admin-123@192.168.0.252:554 URL in video tag tried but not working

Does streaming a feed requires a server so many examples using wss is it necessary probably no idea on wss

Does this require a node or java to convert the format or stream it to browser

If possible can ping some tutorials links or something which can be helpful

Answer 1

include the video directive like this:

<video #video width="640" height="480" autoplay></video>

then in your component:

@ViewChild('video') video:any; 
// note that "#video" is the name of the template variable in the video element

ngAfterViewInit() {
  let _video=this.video.nativeElement;
  if(navigator.mediaDevices && navigator.mediaDevices.getUserMedia) {
    navigator.mediaDevices.getUserMedia({ video: true })
                          .then(stream => {
                            _video.src = window.URL.createObjectURL(stream);
                            _video.play();
                          })
  }
}