Wie greife ich über Javascript auf Webcam in OpenCV auf PythonAnywhere zu?

Ich habe in Django eine Webanwendung entwickelt, die eine Ansichtsmethode enthält, die den OpevCV-Code enthält, der beim Auslösen die Benutzer-Webcam öffnet, um ihr Gesicht zu erkennen. Diese App funktioniert auf meinem lokalen Server einwandfrei, aber wenn ich sie auf PythonAnywhere gehostet habe, heißt es, dass die Kamera nicht gefunden wurde, da mein PA-Hosting keine Kamera bedient.
Also schlug mir jemand vor, die Webcam über Javascript zu öffnen, da sie sich mit dem Client-Computer befasst, und dann ihren Feed an den Server-Computer weiterzuleiten, der mein Hosting ist.
Aber da ich ein Anfänger in Python bin, kann ich nicht herausfinden, wie ich die obige Aufgabe ausführen soll. Ich habe diesen Teil von js Code gefunden, aber ich weiß nicht, wie und wo ich ihn in meine Django App einfügen soll.

Code zum Abrufen des Feeds mit Javascript

var video = document.querySelector("#videoElement");

if (navigator.mediaDevices.getUserMedia) {
    navigator.mediaDevices.getUserMedia({video: true}).then(function(stream) {
      video.srcObject = stream;
  }).catch(function(err0r) {
      console.log("Something went wrong!");
  });
}

Mein Python-Code zum Öffnen der Kamera und zum Erkennen von Gesichtern lautet wie folgt (funktioniert auf dem lokalen Server).

import cv2

cascade = cv2.CascadeClassifier('./haarcascade_frontalface_default.xml')

cam = cv2.VideoCapture(0)


while True:
    ret, frame = cam.read()
    frame = cv2.flip(frame, 1)

    if ret:
        gray = cv2.cvtColor(frame, cv2.COLOR_BGR2GRAY)

        faces = cascade.detectMultiScale(gray, scaleFactor=1.3, minNeighbors=3)

        for (x, y, w, h) in faces:
            cropped = cv2.resize(frame[y:y+h, x:x+w], (198,198))
            cv2.rectangle(frame, (x, y), (x+w, y+h), (255, 0, 0), 2)

        if cv2.waitKey(1) & 0xFF == ord('q'):
            break
            cv2.destroyAllWindows()

        cv2.imshow('Stream', frame)

Jede Hilfe wird geschätzt. Vielen Dank im Voraus

Ich habe etwas Ähnliches gemacht, das Schema, das ich verwendet habe, war wie folgt:

Wie Sie bereits wissen, benötigen wir Javascript, um das Bild des Benutzers von der Webcam zu erhalten. Ich habe einen Artikel gefunden , der uns zeigt, wie das geht. Sie können nur die Frontend-Seite (die HTML-Datei) verwenden, wenn Sie Django verwenden möchten. Dieser Code dient zum Abrufen von Bildern und zum Codieren in base64 (Zeichenfolge) und zum Senden über den Websocket.

Danach möchten wir, dass Django den Websocket bedient. In der Vergangenheit habe ich es mit Flask gemacht, nicht mit Django, aber Sie können sehen, wie Sie einen Websocket- Server mit Django-Channel erstellen können .

Für den letzten Schritt benötigen Sie eine Funktion mit Ihrem OpenCV-Code. Sie müssen base64 dekodieren und in opencv konvertieren

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)

Und natürlich brauchen Sie nicht while Trueund cv2.imshow, sondern geben die base64-Version Ihres neuen Bildes zurück. Ich hoffe es hilft.

Update: Ich schreibe einen Beispielcode in meinen Github . Nicht in Django, aber immer noch in Python. Ich hoffe, es gibt Ihnen mehr Einblick.

Sie müssen das Live-Video-Streaming mit Javascript abrufen und diesen Stream dann an opencv2 weiterleiten, damit es funktioniert.

Verwenden Sie: Holen Sie sich Live-Videostream in NodeJS

Sie erhalten eine URL, "http://localhost:3000"die Sie im Python-Code wie folgt verwenden können:

import cv2

cascade = cv2.CascadeClassifier('./haarcascade_frontalface_default.xml')

cam = cv2.VideoCapture('http://localhost:3000')


while True:
    ret, frame = cam.read()
    frame = cv2.flip(frame, 1)

    if ret:
        gray = cv2.cvtColor(frame, cv2.COLOR_BGR2GRAY)

        faces = cascade.detectMultiScale(gray, scaleFactor=1.3, minNeighbors=3)

        for (x, y, w, h) in faces:
            cropped = cv2.resize(frame[y:y+h, x:x+w], (198,198))
            cv2.rectangle(frame, (x, y), (x+w, y+h), (255, 0, 0), 2)

        if cv2.waitKey(1) & 0xFF == ord('q'):
            break
            cv2.destroyAllWindows()

        cv2.imshow('Stream', frame)