захват изображения с веб-камеры в html

Question

Я пытаюсь сделать свою первую веб-разработку. У меня проблема при захвате изображения с веб-камеры. я уже подключаюсь к своей веб-камере с flask. но я не знаю, как сделать несколько снимков.

, когда я провожу некоторые исследования о захвате изображения с html, большинство из них получает доступ к веб-камере с внешнего интерфейса, который javascript, захватывает его и отправляет фото для бэкенда.

но я сделал доступ к веб-камере из бэкэнда. Мне нужен совет, так как я начинающий, какой из них лучше всего делать? захватить изображение из внешнего интерфейса и отправить его в бэкэнд или захватить изображение из внутреннего интерфейса? простите мой плохой английский sh.

вот мой код

rout.py

from app import app
from flask import render_template, jsonify, request, redirect, Response
from app.camera import VideoCamera
import cv2


@app.route('/employees/new', methods=['GET'])
def index():
    return render_template('index.html')

def gen(camera):
    while True: 
        frame = camera.get_frame()
        yield (b'--frame\r\n'
               b'Content-Type: image/jpeg\r\n\r\n' + frame + b'\r\n\r\n')

@app.route('/video-feed')
def video_feed():
    return Response(gen(video_stream),
                    mimetype = 'multipart/x-mixed-replace; boundary=frame')

camera.py

import cv2


class VideoCamera(object):

    def __init__(self):
        self.video = cv2.VideoCapture(0)

    def __del__(self):
        self.video.release()

    def get_frame(self):
        ret, frame = self.video.read()

        ret, jpeg = cv2.imencode('.jpg', frame)

        return jpeg.tobytes()

index. html

<div class="container">
    <div class="justify-content-md-center">
        <img src="{{ url_for('video_feed') }}" width="400px" height="300px">
    </div>
</div>