Angular + media stream

Asked

Viewed 86 times

0

I have a component where I request permission for the user to use the webcam, the purpose of it is to do facial recognition.

It’s working, but when I navigate to other components, the browser tab says that the page is "using the camera or microphone".

This is bad because it generates a distrust on the part of users, as they are in a component where the camera/microphone should not be used.

I wonder if there is any way to stop video capture when changing component, or if you need to disallow, I don’t know for sure, but when changing component the webcam should stop being used.

Thank you!

angular stream

  • Dude, I imagine you can do something with Event listeners like this: https://juristr.com/blog/2016/09/ng2-event-registration-document/ you could use the event Document.hasFocus() to find out if you changed windows and deactivate

  • Thanks for the help friend, I was able to solve it like this: Using the "ngOnDestroy()" cycle, I created a function called "async destroyThing()", just for testing, and in it I took the stream and used the foreach to clean any existing stream. const stream = await Navigator.mediaDevices.getUserMedia(window.webkitURL.constraints); stream.getTracks(). foreach(track => track.stop()); .

1 answer

0

For those facing the same problem, try as follows: In the "ngOnDestroy" event, create an asynchronous type helper function, start the stream, and then clean any existing stream.

async funcao(){ const stream = await Navigator.mediaDevices.getUserMedia(window.webkitURL.constraints); stream.getTracks(). foreach(track => track.stop()); }

Browser other questions tagged angular stream

You are not signed in. Login or sign up in order to post.