How to access webcam in OpenCV on PythonAnywhere through Javascript?

I used to do something similar, the scheme I used was as follows:

Data flow

As you are already aware, we need javascript to get user's picture from the webcam. I found an article that shows us how to do that, you can use only the frontend side (the HTML file) if you want to use Django. That's code is for getting pictures and encode it to base64 (string) and send it via websocket.

After that, we want Django to serve websocket. In the past, I did it with Flask, not Django, but you can see how you can create websocket server using django-channel.

For the last step, you need a function with your OpenCV code. You need to decode base64 and convert it to opencv

def modify_picture(img_data):
    # decode image
    img = from_b64(img_data)

    # your OpenCV filter
    gray = cv2.cvtColor(img, cv2.COLOR_BGR2GRAY)

    # encode image to base64
    return to_b64(gray)

And of course, you don't need while True and cv2.imshow, but return the base64 version of your new picture. Hope it helps.


Update: I write a sample code in my github. Not in Django, but still in Python. Hope it will give you more insight.