I want to make a simple face detection program with opencv and django

I found out how to get the webcam going in django and how to detect faces but i cant seem to find out how to combine both , any help would be appreciated

face_cascade = cv2.CascadeClassifier('haarcascade_frontalface_default.xml')

def home(request):
 context = {}
 return render(request, "home.html", context)

class VideoCamera(object):
 def __init__(self): 
     self.video = cv2.VideoCapture(0) 
     (self.grabbed, self.frame) = self.video.read() 
     threading.Thread(target=self.update, args=()).start()  

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

def get_frame(self): 
    image = self.frame
    _, jpeg = cv2.imencode('.jpg', image)
    return jpeg.tobytes()

def update(self): 
    while True:
        (self.grabbed, self.frame) = self.video.read() 


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') 
          


def detection(camera): 
    while True:
    
     _, img = gen(camera)

   
     gray = cv2.cvtColor(img, cv2.COLOR_BGR2GRAY)

    
     faces = face_cascade.detectMultiScale(gray, 1.1, 4)

    
     for (x, y, w, h) in faces:
        cv2.rectangle(img, (x, y), (x+w, y+h), (255, 0, 0), 2)

    

   
    k = cv2.waitKey(30) & 0xff
    if k==27:
        break

return img
    

this is how i tried to combine both

@gzip.gzip_page
def detectme(request):
  cam = VideoCamera() 
  return StreamingHttpResponse(detect(cam), content_type="multipart/x-mixed- 
  replace;boundary=frame")
  

this is the home.html incase i messed something up in there

{% load static %}
{%load widget_tweaks %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>DJAGO_OPENCV</title>
</head>
<body>

{% block body %}
<h1></h1>
<table>
    <tr>
        <td width="50%">
            <img src="http://127.0.0.1:8000/detectme" style="width:1200px;" />
        </td>
        <td width="50%">

        </td>
    </tr>
</table>
{% endblock %}


</body>
</html>
Back to Top