Я пытаюсь создать веб-приложение для обнаружения лиц.
Приложение работает таким образом.
1-пользователь переходит на URL
2-камера запускается на клиентском компьютере
3-Каждый кадр затем отправляется на сервер для обнаружения лица
4-обработанный кадр затем отображается на веб-странице
Теперь мой вопрос заключается в том, что всякий раз, когда я делаю это на локальном хосте, он почти работает в режиме реального времени, но когда я размещаю его на aws, время отклика тем меньше, чем задерживается видео, есть ли какая-то причина для этого или нет? Любой другой способ сделать это, который будет хорошим, пожалуйста, помогите.
HTML-код страницы JavaScript для отправки и получения
video.addEventListener('play', function() {
var $this = this; //cache
// loop function to send video frames continuously
(function oop() {
// Till the video is playing
if (!$this.paused && !$this.ended) {
console.log($this.videoWidth);
console.log($this.videoHeight);
// draws the video frames to the canvas created
context.drawImage($this, 0, 0,200,200);
// generates the data from the canvas for each frame
var data = canvas.toDataURL('image/png');
//sending data using XMLHttpRequest (easy to use)
var xhr = new XMLHttpRequest();
// specify the method = POST for sending
// url - which will be recieving our data
xhr.open("POST","http://127.0.0.1:5000/camera", true);
// transmit the frame to specified url
xhr.send(data);
// console.log(value)
//receving the frames
var str = "data:image/jpeg;base64,";
var request = new XMLHttpRequest();
request.open('GET','http://127.0.0.1:5000/camera');
request.responseType = 'text';
request.onload = function() {
var value = str.concat(request.response);
img.src=value
// console.log(value)
};
request.send();
// specify the rate the function will iterate
setTimeout(oop, 1000 / 30); // drawing at 30fps
}
})();
}, 0);
}, false);
код на стороне сервера
from flask import request, Flask, render_template
import base64
import cv2
import numpy as np
from PIL import Image
import io
from flask_cors import CORS
app=Flask(__name__)
CORS(app) # used for cross origin request handling
# important -- otherwise we won't be able to send image to webpage
count=0
main_source=0
# index function execute when traffic occur at '/'
@app.route("/")
def index():
return render_template('index.html')
@app.route('/camera', methods=['POST','GET'])
def camera():
if request.method == 'POST':
# reading the image (byte stream)
data=request.stream.read()
# seperating data from the header {data:image/png;....}
data=str(data).split(',')[1]
global count
global main_source
count+=1
''' starting conversion of html-base64 data to cv-numpy array '''
# decoding base64 data
img = base64.b64decode(data)
# generating numpy array from decoded data
npimg = np.frombuffer(img, dtype=np.uint8)
# generating 3d array from 1d
source = cv2.imdecode(npimg, 1)
''' conversion finished '''
''' applying face detection on captured image '''
# defining classifier --- haarcascade face classifier
face_cascade=
cv2.CascadeClassifier('haarcascade_frontalface_default.xml')
face_img = source.copy()
# get faces from the image
face_rects = face_cascade.detectMultiScale(face_img,scaleFactor=1.2)
# draw rectangle over each face in image
for (x,y,w,h) in face_rects:
cv2.rectangle(face_img, (x,y), (x+w,y+h), (255,255,255), 10)
''' face detection finished '''
''' conversion of image again to base64 for html '''
face_img = face_img[...,::-1] # bgr to rgb
im = Image.fromarray(face_img.astype("uint8"), mode='RGB') # using pillow image library
rawBytes = io.BytesIO()
im.save(rawBytes, "JPEG") # saving image to buffer
rawBytes.seek(0) # return to the start of the file
encoded_string = base64.b64encode(rawBytes.read()) # read from file buffer and convert to base64
''' conversion to base64 finished '''
main_source=encoded_string
return ""
else:
print("return")
if type(main_source)==int:
return ""
return main_source
if __name__ == "__main__":
app.run()
заранее спасибо.