Trying to acess js webcam stream

from dash import Dash, html, dcc

app = Dash(__name__)

app.layout = html.Div([html.Div([
    html.H1("hi"),
    html.Video(id="videoElement", autoPlay=True, controls=True)
], id="container")])

if __name__ == '__main__':
    context = ('cert.pem', 'key.pem')
    app.run_server(host="0.0.0.0", debug=True, ssl_context=context)

Above is the dash code,

here is the content of the js script

var video = document.querySelector('videoElement');
navigator.mediaDevices.getUserMedia({video:true}).then(function(mediaStream){
    window.stream = mediaStream;
    video.src = mediaStream;
    video.play();
});

but the stream refuses to dsiplay, the webcam permission request pops up and i accept following which the webcam ligts up, but no stream is displayed,

What am i missing ?

Also facing the same issue.

1 Like